@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/golos-text-cyrillic.woff2?v=17d048ca05') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Golos Text';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/golos-text-latin.woff2?v=9a69d0aa47') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url('../fonts/unbounded-cyrillic.woff2?v=e30bf6a606') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 600 700;
  font-display: swap;
  src: url('../fonts/unbounded-latin.woff2?v=22f9b928aa') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --bg:#FDFDFB; --glass:rgba(253,253,251,.88); --surface:#FFFFFF; --tint:#F6F5FA;
  --ink:#1A1B22; --ink2:#2A2A34; --mut:#55555F; --mut2:#6B6B78; --mut3:#8A8A98; --mut4:#9A99A8;
  --line:#ECEBF2; --line2:#DBDAE5; --chip:#F1F0F6; --chip2:#E9E8F0; --panel:#14141F;
  --kick:#7A2FE0; --link:#7A2FE0; --linkh:#5A1FB0; --dot:rgba(26,27,34,.06);
  --onPanel:#F1F1F6; --onPanel2:#A6A6BC; --onPanelLine:rgba(255,255,255,.10);
  --save:#0B7A55; --saveBg:rgba(11,122,85,.10); --saveBd:rgba(11,122,85,.30); --saveOn:#34D399;
  --oaccT:#D8400A; --warn:#B45309; --warnBg:rgba(180,83,9,.10); --warnBd:rgba(180,83,9,.28);
  --dngr:#B42318; --dngrBg:rgba(180,35,24,.10); --dngrBd:rgba(180,35,24,.30);
  --hl:#6C2BD9; --hlT:rgba(108,43,217,.12);
  --acc:#FF5A1F; --acch:#E8490F; --accT:rgba(255,90,31,.12);
  --accB:rgba(255,90,31,.34); --accS:rgba(232,73,15,.28);
}

:root[data-theme="dark"] {
  --bg:#0E0E16; --glass:rgba(14,14,22,.86); --surface:#16161F; --tint:#12121B;
  --ink:#F1F1F6; --ink2:#E2E2EC; --mut:#ABABBE; --mut2:#9595A9; --mut3:#83839A; --mut4:#75758B;
  --line:#23232F; --line2:#31313F; --chip:#1C1C27; --chip2:#252532; --panel:#181824;
  --kick:#B18CFF; --link:#B18CFF; --linkh:#C9B4FF; --dot:rgba(255,255,255,.06);
  --onPanel:#F1F1F6; --onPanel2:#A6A6BC; --onPanelLine:rgba(255,255,255,.10);
  --save:#34D399; --saveBg:rgba(52,211,153,.12); --saveBd:rgba(52,211,153,.30); --saveOn:#5EEAB4;
  --oaccT:#FF8A50; --warn:#FBBF24; --warnBg:rgba(251,191,36,.10); --warnBd:rgba(251,191,36,.28);
  --dngr:#FF7A70; --dngrBg:rgba(255,122,112,.12); --dngrBd:rgba(255,122,112,.32);
  --hl:#8B5CF6; --hlT:rgba(139,92,246,.16);
}

@keyframes omFadeA{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes omPop{from{opacity:0;transform:scale(.94) translateY(12px)}to{opacity:1;transform:none}}
@keyframes omDd{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@keyframes omShakeA{0%,100%{transform:none}25%{transform:translateX(-9px)}55%{transform:translateX(8px)}80%{transform:translateX(-4px)}}
@keyframes omSpin{to{transform:rotate(360deg)}}
@keyframes omConf{0%{transform:translateY(0) rotate(0deg)}100%{transform:translateY(108vh) rotate(680deg)}}

[hidden] { display: none !important; }
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: 'Golos Text', sans-serif;
  -webkit-font-smoothing: antialiased;
  transition: background .3s ease, color .3s ease;
}
h1, h2, h3, p, ul, ol, dl, dd, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--linkh); }
button { font-family: inherit; }
input, select, button { font-family: 'Golos Text', sans-serif; }
input:focus, select:focus, button:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
::placeholder { color: var(--mut4); }
::selection { background: #FFD9C4; color: #1A1B22; }
img { max-width: 100%; display: block; }
svg { flex: none; }

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.container {
  max-width: 1220px;
  margin: 0 auto;
  padding: 0 40px;
  box-sizing: border-box;
}
.hide-mobile { display: inline-flex; }

.hdr {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--glass);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}
.hdr__inner {
  height: 68px;
  display: flex;
  align-items: center;
  gap: 18px;
}
.hdr__logo { display: flex; align-items: center; flex: none; }
.hdr__logo-img { height: 42px; display: block; }
:root[data-theme="dark"] .hdr__logo-img--light,
:root:not([data-theme="dark"]) .hdr__logo-img--dark { display: none; }

.hdr__secure {
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  color: var(--mut2);
  border-left: 1px solid var(--line);
  padding-left: 18px;
}
.hdr__secure svg { color: var(--save); }

.hdr__spacer { flex: 1; }

.theme-toggle {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--chip);
  border: none;
  color: var(--mut);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex: none;
  transition: background .15s, color .15s;
}
.theme-toggle:hover { background: var(--chip2); color: var(--ink); }
.theme-toggle .icon-sun, .theme-toggle .icon-moon { display: none; }
:root[data-theme="dark"] .theme-toggle .icon-moon,
:root:not([data-theme="dark"]) .theme-toggle .icon-sun { display: block; }

.hdr__catalog-link {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  padding: 9px 14px;
  border: 1.5px solid var(--line2);
  border-radius: 11px;
  white-space: nowrap;
}
.hdr__catalog-link:hover { border-color: var(--ink); color: var(--ink); }

.lang-switch { position: relative; flex: none; }
.lang-switch__toggle {
  display: flex;
  align-items: center;
  gap: 7px;
  background: var(--chip);
  border: none;
  border-radius: 999px;
  padding: 8.5px 15px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}
.lang-switch__toggle:hover { background: var(--chip2); }
.lang-switch__toggle svg { color: var(--mut3); }
.lang-switch__menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 176px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
  box-shadow: 0 20px 48px rgba(10,10,18,.28);
  padding: 6px;
  z-index: 70;
  display: flex;
  flex-direction: column;
  animation: omDd .18s ease;
}
.lang-switch__item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  background: transparent;
  border: none;
  border-radius: 10px;
  padding: 9px 11px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--mut);
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.lang-switch__item:hover { background: var(--tint); }
.lang-switch__item[aria-checked="true"] { font-weight: 700; color: var(--ink); }
.lang-switch__check { color: var(--acc); visibility: hidden; }
.lang-switch__item[aria-checked="true"] .lang-switch__check { visibility: visible; }

.card {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 34px;
  box-shadow: 0 22px 60px rgba(10,10,20,.10);
  animation: omFadeA .35s ease;
}
.card__kicker {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--kick);
}
.card__title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 26px;
  line-height: 1.2;
  margin-top: 11px;
  letter-spacing: -.015em;
  text-wrap: balance;
}
.card__lead {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--mut);
  margin-top: 11px;
  text-wrap: pretty;
}
.card__disclaimer {
  font-size: 12px;
  color: var(--mut3);
  line-height: 1.55;
  text-align: center;
  margin-top: 14px;
  text-wrap: pretty;
}

.field__label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin: 22px 0 8px;
}
.field__control { position: relative; }
.field__input {
  width: 100%;
  border: 1.5px solid var(--line2);
  border-radius: 12px;
  padding: 14px 44px 14px 15px;
  font-size: 16px;
  background: var(--bg);
  color: var(--ink);
  transition: border-color .15s;
}
.field__input:focus { border-color: var(--acc); outline: none; }
.field__input[aria-invalid="true"] { border-color: var(--dngr); }

.field__status {
  position: absolute;
  top: 50%;
  right: 14px;
  transform: translateY(-50%);
  display: flex;
  pointer-events: none;
}
.field__status-icon { display: none; }
.field__status[data-state="loading"] .field__status-icon--loading {
  display: block;
  color: var(--acc);
  animation: field-status-spin .8s linear infinite;
}
.field__status[data-state="ok"] .field__status-icon--ok { display: block; color: var(--save); }
.field__status[data-state="error"] .field__status-icon--error { display: block; color: var(--dngr); }

@keyframes field-status-spin { to { transform: rotate(360deg); } }
.field__hint {
  font-size: 12.5px;
  color: var(--mut3);
  margin-top: 8px;
  line-height: 1.5;
}
.field__error {
  font-size: 12.5px;
  color: var(--dngr);
  margin-top: 6px;
  line-height: 1.5;
  min-height: 1em;
}
.field__error:empty { display: none; }

.google { margin-top: 22px; }
.google__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  padding: 14px 20px;
  border: 1.5px solid var(--line2);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink);
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s, background .15s, opacity .15s;
}
.google__btn:hover { border-color: var(--mut3); background: var(--tint); }
.google__btn:disabled { opacity: .55; cursor: progress; }

:root[data-theme="dark"] .google__btn {
  background: #FFFFFF;
  border-color: #FFFFFF;
  color: #1F1F1F;
}
:root[data-theme="dark"] .google__btn:hover {
  background: #F2F2F2;
  border-color: #F2F2F2;
}
.google__logo { flex: none; }
.google__or {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  font-size: 12.5px;
  color: var(--mut3);
}
.google__or::before,
.google__or::after {
  content: '';
  flex: 1;
  height: 1px;
  background: var(--line);
}

.google-chosen {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;
  padding: 13px 15px;
  border: 1.5px solid var(--saveBd);
  border-radius: 12px;
  background: var(--saveBg);
}
.google-chosen:focus { outline: none; }
.google-chosen:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
.google-chosen__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.google-chosen__label {
  font-size: 11.5px;
  font-weight: 600;
  color: var(--save);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.google-chosen__email {
  font-size: 14.5px;
  font-weight: 600;
  color: var(--ink);
  overflow-wrap: anywhere;
}
.google-chosen__change {
  margin-left: auto;
  flex: none;
  border: none;
  background: none;
  padding: 0;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--oaccT);
  cursor: pointer;
}
.google-chosen__change:hover { text-decoration: underline; }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: none;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 700;
  padding: 15px 20px;
  cursor: pointer;
  transition: background .15s, opacity .15s, border-color .15s, color .15s;
  box-sizing: border-box;
}
.btn--block { width: 100%; margin-top: 24px; }
.btn--primary {
  background: var(--acc);
  color: #FFFFFF;
  box-shadow: 0 10px 26px var(--accS);
}
.btn--primary:hover { background: var(--acch); }
.btn--primary:disabled,
.btn--primary[aria-disabled="true"] {
  opacity: .45;
  cursor: not-allowed;
  box-shadow: none;
}
.btn--ghost {
  background: transparent;
  border: 1.5px solid var(--line2);
  color: var(--mut);
}
.btn--ghost:hover { border-color: var(--ink); color: var(--ink); }
.btn--dark {
  background: var(--ink);
  color: var(--bg);
}

.screen--step1 {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.screen__hero {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
  padding: 36px 20px 54px;
  overflow: hidden;
}
.screen__hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(var(--dot) 1.3px, transparent 1.3px);
  background-size: 24px 24px;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%);
  mask-image: radial-gradient(ellipse 70% 60% at 50% 0%, #000 20%, transparent 75%);
  pointer-events: none;
}
.screen__hero::after {
  content: '';
  position: absolute;
  top: -70px; left: 50%;
  transform: translateX(-50%);
  width: min(760px, 100%);
  height: 320px;
  background: radial-gradient(ellipse at center top, var(--accT), transparent 70%);
  filter: blur(30px);
  pointer-events: none;
}
.screen__hero-inner {
  position: relative;
  width: 100%;
  max-width: 520px;
}

.steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  font-size: 12.5px;
  font-weight: 600;
  margin-bottom: 22px;
}
.steps__item { display: inline-flex; align-items: center; gap: 7px; color: var(--mut3); }
.steps__item--active { color: var(--ink); }
.steps__num {
  width: 23px; height: 23px;
  border-radius: 50%;
  border: 1.5px solid var(--line2);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11.5px;
  box-sizing: border-box;
  flex: none;
}
.steps__item--active .steps__num {
  background: var(--acc);
  color: #FFFFFF;
  border: none;
  font-weight: 700;
}
.steps__sep { width: 28px; height: 1.5px; background: var(--line2); }

.plan-box {
  background: var(--tint);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 16px 18px;
  margin-top: 22px;
}
.plan-box__row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.plan-box__label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--mut3);
}
.plan-box__spacer { flex: 1; }
.plan-box__change {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--oaccT);
}
.plan-box__price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: nowrap;
  margin-top: 10px;
}
.plan-box__name { font-size: 15px; font-weight: 700; flex: 0 1 auto; min-width: 0; }
.plan-box__term { flex: none; }
.plan-box__price { flex: none; margin-left: auto; }
.plan-box__term {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--oaccT);
  background: var(--accT);
  border: 1px solid var(--accB);
  border-radius: 999px;
  padding: 3px 9px;
}
.plan-box__price {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 20px;
  letter-spacing: -.02em;
}
.plan-box__renewal {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 11px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--mut);
  background: rgba(127,127,150,.10);
  border: 1px solid var(--onPanelLine);
  border-radius: 999px;
  padding: 5px 12px;
}
.plan-box__renewal svg { color: var(--mut3); flex: none; }
.plan-box__gift {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 11px;
  font-size: 12.5px;
  font-weight: 700;
  color: var(--save);
  background: var(--saveBg);
  border: 1px solid var(--saveBd);
  border-radius: 999px;
  padding: 5px 12px;
}

.trust {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.trust__item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  color: var(--mut2);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 7px 13px;
}
.trust__item svg { color: var(--save); }

.screen--step2 {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.screen--step2 .screen__body {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.pane {
  box-sizing: border-box;
  padding: 34px 44px 30px;
}
.pane--summary {
  flex: 1 1 380px;
  background: var(--panel);
  color: var(--onPanel);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow-x: clip;
}
.pane--summary__sticky {
  position: sticky;
  top: calc(68px + 34px);
}
.pane--summary__sticky::before {
  content: '';
  position: absolute;
  top: -34px; right: -44px;
  width: min(420px, 100%); height: 420px;
  background: radial-gradient(circle at 78% -12%, rgba(255,90,31,.16), transparent 62%);
  pointer-events: none;
}
.pane--summary__content {
  position: relative; 
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  max-height: calc(100vh - 68px - 34px - 30px);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}
.pane--checkout {
  flex: 1.25 1 460px;
  display: flex;
  justify-content: center;
  padding: 38px 44px 48px;
  background: var(--bg);
}
.pane--checkout__inner { width: 100%; max-width: 460px; }

.pane__back {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--onPanel2);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}
.pane__back:hover { color: var(--onPanel); }

.pane__kicker {
  margin-top: 30px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--acc);
}
.pane__plan-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 13px;
}
.pane__plan-name {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 21px;
  line-height: 1.25;
  letter-spacing: -.01em;
}
.pane__plan-term {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .09em;
  text-transform: uppercase;
  background: var(--acc);
  color: #FFFFFF;
  padding: 4px 10px;
  border-radius: 999px;
}
.pane__price-row {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.pane__old-price { font-size: 17px; text-decoration: line-through; color: var(--onPanel2); }
.pane__price {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 38px;
  letter-spacing: -.025em;
  line-height: 1;
}
.pane__renewal {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--onPanelLine);
  color: var(--onPanel2);
  font-size: 12.5px;
  font-weight: 600;
  border-radius: 999px;
  padding: 6px 13px;
}
.pane__renewal svg { flex: none; opacity: .8; }
.pane__gift {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  background: rgba(52,211,153,.10);
  border: 1px solid rgba(52,211,153,.32);
  color: var(--saveOn);
  font-size: 12.5px;
  font-weight: 700;
  padding: 6px 13px;
  border-radius: 999px;
}

.summary {
  margin-top: 28px;
  display: flex;
  flex-direction: column;
  gap: 11px;
  max-width: 400px;
}
.summary__row { display: flex; justify-content: space-between; gap: 14px; font-size: 14px; }
.summary__row-label { color: var(--onPanel2); }
.summary__row-value { font-weight: 600; }
.summary__row-value--highlight { color: var(--saveOn); }
.summary__divider { height: 1px; background: var(--onPanelLine); margin: 4px 0; }
.summary__total { display: flex; justify-content: space-between; gap: 14px; align-items: baseline; }
.summary__total-label { font-size: 14.5px; font-weight: 600; }
.summary__total-value {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 21px;
  letter-spacing: -.02em;
}
.summary__facts { display: flex; flex-direction: column; gap: 9px; margin-top: 3px; }
.summary__note { font-size: 12.5px; color: var(--onPanel2); line-height: 1.55; text-wrap: pretty; }

.access-box {
  margin-top: 24px;
  max-width: 400px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--onPanelLine);
  border-radius: 15px;
  padding: 15px 17px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.access-box__row { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; }
.access-box__row-label { color: var(--onPanel2); }
.access-box__row-value { font-weight: 600; }
.access-box__cabinet-value { color: var(--acc); word-break: break-all; text-align: right; }
.access-box__cabinet {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  min-width: 0;
}
.access-box__note {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11.5px;
  color: var(--onPanel2);
  text-align: right;
}

.pane__legal {
  position: relative;
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--onPanel2);
  margin-top: 22px;
  flex-wrap: wrap;
  opacity: .8;
}
.pane__legal a { color: var(--onPanel2); }

.payment-step__title { font-size: 16px; font-weight: 700; }

.method-list { display: flex; gap: 10px; margin-top: 14px; }
.method {
  flex: 1;
  border-radius: 14px;
  padding: 15.5px 16.5px;
  cursor: pointer;
  box-sizing: border-box;
  border: 1.5px solid var(--line2);
  background: var(--surface);
  transition: border-color .15s, background .15s;
  text-align: left;
  font-family: inherit;
  color: inherit;
}
.method--selected { border: 2px solid #26A17B; background: var(--tint); padding: 15px 16px; }
.method__title { font-size: 14px; font-weight: 700; }
.method__meta { display: flex; gap: 6px; margin-top: 9px; align-items: center; }
.method__icon-usdt {
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #26A17B;
  color: #FFFFFF;
  font-size: 10px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.method__note { font-size: 11px; color: var(--mut3); }

.method--disabled {
  cursor: default;
  border: 1.5px solid var(--line2);
  background: var(--surface);
  opacity: .55;
}
.method--disabled .method__meta { gap: 5px; }
.method__mark {
  border: 1px solid var(--line2);
  border-radius: 4px;
  font-size: 8.5px;
  font-weight: 800;
  font-style: italic;
  padding: 3px 5px;
  color: #1A1F71;
  background: #FFFFFF;
}
.method__mark-mc {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--line2);
  border-radius: 4px;
  padding: 3px 5px;
  background: #FFFFFF;
}
.method__mark-mc span:first-child { width: 10px; height: 10px; border-radius: 50%; background: #EB001B; }
.method__mark-mc span:last-child { width: 10px; height: 10px; border-radius: 50%; background: #F79E1B; margin-left: -4px; }
.method__badge {
  background: var(--chip);
  color: var(--mut3);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  flex: none;
}

.crypto-panel { margin-top: 26px; animation: omFadeA .25s ease; }
.crypto-summary {
  border: 1.5px solid var(--line2);
  border-radius: 15px;
  padding: 15px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
  background: var(--surface);
}
.crypto-summary__icon {
  flex: none;
  width: 38px; height: 38px;
  border-radius: 50%;
  background: #26A17B;
  color: #FFFFFF;
  font-size: 19px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
}
.crypto-summary__title { font-size: 14px; font-weight: 700; }
.crypto-summary__subtitle { font-size: 12.5px; color: var(--mut3); margin-top: 2px; }

.crypto-amount-box {
  margin-top: 12px;
  border: 1.5px solid var(--line2);
  border-radius: 15px;
  padding: 16px;
  box-sizing: border-box;
  background: var(--surface);
}
.crypto-amount-box__label { font-size: 12px; color: var(--mut3); }
.crypto-amount-box__value {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: 5px;
  flex-wrap: wrap;
}
.crypto-amount-box__value-amount {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 23px;
  letter-spacing: -.02em;
}
.crypto-amount-box__value-currency { font-size: 13px; color: var(--mut3); }
.crypto-amount-box__rate-note { font-size: 12px; color: var(--mut3); margin-top: 6px; }

.warning-box {
  margin-top: 12px;
  background: var(--warnBg);
  border: 1px solid var(--warnBd);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 12.5px;
  color: var(--warn);
  line-height: 1.55;
}
.warning-box--info {
  background: var(--tint);
  border-color: var(--line);
  color: var(--mut2);
}
.warning-box--warning {
  background: var(--warnBg);
  border-color: var(--warnBd);
  color: var(--warn);
}
.warning-box--danger {
  background: var(--dngrBg);
  border-color: var(--dngrBd);
  color: var(--dngr);
}

.crypto-panel__hint { text-align: center; font-size: 12px; color: var(--mut3); margin-top: 12px; }

.invoice { animation: omFadeA .25s ease; }
.invoice__head { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.invoice__head-main { flex: 1; min-width: 200px; }
.invoice__title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 21px;
  letter-spacing: -.01em;
}
.invoice__subtitle { font-size: 13px; color: var(--mut3); margin-top: 7px; }
.invoice__number {
  background: var(--tint);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--mut);
  padding: 7px 14px;
  white-space: nowrap;
}

.timer {
  margin-top: 18px;
  background: var(--accT);
  border: 1px solid var(--accB);
  border-radius: 15px;
  padding: 14px 16px;
  box-sizing: border-box;
}
.timer__row { display: flex; align-items: center; gap: 10px; }
.timer__icon {
  flex: none;
  width: 32px; height: 32px;
  border-radius: 9px;
  background: var(--surface);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--oaccT);
}
.timer__label {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--oaccT);
}
.timer__spacer { flex: 1; }
.timer__value {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 15px;
  color: var(--ink);
}
.timer__track {
  height: 6px;
  background: var(--chip2);
  border-radius: 99px;
  margin-top: 12px;
  overflow: hidden;
}
.timer__bar {
  height: 100%;
  background: var(--acc);
  border-radius: 99px;
  transition: width 1s linear;
  width: 100%;
}
.timer--warning .timer__label,
.timer--warning .timer__icon { color: var(--warn); }
.timer--warning .timer__bar { background: var(--warn); }
.timer--danger { background: var(--dngrBg); border-color: var(--dngrBd); }
.timer--danger .timer__label,
.timer--danger .timer__icon { color: var(--dngr); }
.timer--danger .timer__bar { background: var(--dngr); }

.invoice__amount-box {
  margin-top: 14px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 22px;
  text-align: center;
  box-sizing: border-box;
}
.invoice__amount-label {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--mut3);
}
.invoice__amount-value {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  margin-top: 9px;
  flex-wrap: wrap;
}
.invoice__amount-number {
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  font-size: 33px;
  letter-spacing: -.025em;
}
.invoice__amount-currency { font-size: 14px; font-weight: 700; color: var(--oaccT); }

.invoice__qr {
  display: inline-block;
  margin-top: 18px;
  background: #FFFFFF;
  color: #111111;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 12px 32px rgba(10,10,20,.14);
  line-height: 0;
}
.invoice__qr svg { width: 168px; height: 168px; display: block; }
.invoice__qr-hint { font-size: 12px; color: var(--mut3); margin-top: 11px; }

.wallet-field { display: flex; gap: 8px; margin-top: 16px; }
.wallet-field__input {
  flex: 1;
  min-width: 0;
  box-sizing: border-box;
  border: 1.5px solid var(--line2);
  border-radius: 10px;
  padding: 12px 13px;
  font-size: 16px;
  background: var(--tint);
  color: var(--ink2);
  font-family: ui-monospace, monospace;
}
.wallet-field__copy {
  flex: none;
  background: var(--ink);
  color: var(--bg);
  border: none;
  font-size: 13px;
  font-weight: 700;
  padding: 0 16px;
  border-radius: 10px;
  cursor: pointer;
}

.howto {
  margin-top: 16px;
  border: 1px solid var(--line);
  background: var(--tint);
  border-radius: 15px;
  padding: 16px 18px;
  box-sizing: border-box;
}
.howto__title { font-size: 14px; font-weight: 700; }
.howto__list { display: flex; flex-direction: column; gap: 11px; margin-top: 13px; }
.howto__item { display: flex; gap: 10px; font-size: 13.5px; line-height: 1.55; color: var(--mut); }
.howto__item-num {
  flex: none;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--chip2);
  color: var(--ink2);
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}
.howto__item b { color: var(--ink); }

.invoice__actions { display: flex; gap: 10px; margin-top: 20px; }
.invoice__actions .btn--ghost { flex: none; padding: 13px 22px; }
.invoice__actions .btn--primary { flex: 1; padding: 14px; margin-top: 0; }

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(8,8,14,.62);
  backdrop-filter: blur(6px);
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  box-sizing: border-box;
}
.modal {
  width: 100%;
  max-width: 470px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 28px;
  box-sizing: border-box;
  box-shadow: 0 34px 90px rgba(0,0,0,.45);
  animation: omPop .3s ease;
  color: var(--ink);
}
.modal--shake { animation: omShakeA .4s ease; }
.modal__title { font-family: 'Unbounded', sans-serif; font-weight: 600; font-size: 19px; }
.modal__warning {
  margin-top: 16px;
  background: var(--warnBg);
  border: 1px solid var(--warnBd);
  border-radius: 15px;
  padding: 20px;
  text-align: center;
}
.modal__warning svg { color: var(--warn); margin: 0 auto; }
.modal__warning-title {
  font-size: 14.5px;
  font-weight: 600;
  line-height: 1.55;
  margin-top: 10px;
  color: var(--ink2);
  text-wrap: pretty;
}
.modal__warning-note {
  font-size: 13px;
  color: var(--mut2);
  line-height: 1.55;
  margin-top: 8px;
  text-wrap: pretty;
}
.modal__checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  font-size: 14px;
  color: var(--ink2);
  cursor: pointer;
}
.modal__checkbox-row input {
  width: 18px; height: 18px;
  accent-color: var(--acc);
  cursor: pointer;
  margin: 0;
  flex: none;
}
.modal__actions { display: flex; gap: 10px; margin-top: 20px; }
.modal__actions .btn--ghost { flex: none; padding: 13px 20px; }
.modal__actions .btn--primary { flex: 1; padding: 14px; margin-top: 0; }

.screen--creating {
  min-height: 100vh;
  background: var(--panel);
  color: var(--onPanel);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 34px 20px;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  animation: omFadeA .3s ease;
}
.screen--creating::before {
  content: '';
  position: absolute;
  top: -180px; left: 50%;
  transform: translateX(-50%);
  width: 620px; height: 620px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,90,31,.16), transparent 70%);
  pointer-events: none;
}
.screen--creating::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.05) 1.3px, transparent 1.3px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(ellipse 60% 60% at 50% 40%, #000 10%, transparent 75%);
  mask-image: radial-gradient(ellipse 60% 60% at 50% 40%, #000 10%, transparent 75%);
  pointer-events: none;
}

.confetti { position: absolute; inset: 0; pointer-events: none; z-index: 5; }
.confetti__piece { position: absolute; top: -26px; animation: omConf 2.6s linear forwards; }

.creating {
  width: 100%;
  max-width: 470px;
  text-align: center;
  position: relative;
}
.creating__logo { height: 40px; margin: 0 auto; }

.creating__spinner {
  width: 62px; height: 62px;
  border-radius: 50%;
  border: 4px solid rgba(255,255,255,.10);
  border-top-color: var(--acc);
  margin: 34px auto 0;
  animation: omSpin .9s linear infinite;
  box-sizing: border-box;
}
.creating__title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 24px;
  line-height: 1.25;
  margin-top: 24px;
  letter-spacing: -.015em;
}
.creating__lead { font-size: 14px; color: var(--onPanel2); margin-top: 10px; }

.creating__done-icon {
  width: 76px; height: 76px;
  border-radius: 50%;
  background: var(--acc);
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 32px auto 0;
  box-shadow: 0 16px 46px var(--accS);
  animation: omPop .4s ease;
}
.creating__done-title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 700;
  font-size: 34px;
  margin-top: 20px;
  letter-spacing: -.02em;
  animation: omPop .45s ease;
}
.creating__done-subtitle { font-size: 16px; font-weight: 600; margin-top: 10px; }
.creating__done-redirect { font-size: 13.5px; color: var(--onPanel2); margin-top: 6px; }
.creating__go-now {
  display: inline-block;
  margin-top: 14px;
  font-size: 13.5px;
  font-weight: 700;
  color: var(--acc);
}
.creating__go-now:hover,
.creating__go-now:focus-visible { text-decoration: underline; }

.creating__rows {
  margin-top: 28px;
  background: rgba(255,255,255,.04);
  border: 1px solid var(--onPanelLine);
  border-radius: 18px;
  padding: 6px 18px;
  text-align: left;
}
.creating__row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--onPanelLine);
}
.creating__row:last-child { border-bottom: none; }
.creating__row-icon {
  flex: none;
  width: 22px; height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  box-sizing: border-box;
  border: 2px solid rgba(255,255,255,.12);
}
.creating__row-text { font-size: 14px; color: var(--onPanel2); opacity: .6; }
.creating__row--active .creating__row-icon {
  border: 2.5px solid rgba(255,255,255,.12);
  border-top-color: var(--acc);
  animation: omSpin .8s linear infinite;
}
.creating__row--active .creating__row-text { color: var(--onPanel); opacity: 1; font-weight: 500; }
.creating__row--done .creating__row-icon { background: var(--acc); color: #FFFFFF; border: none; }
.creating__row--done .creating__row-text { color: var(--onPanel); opacity: 1; font-weight: 500; }

.creating__progress-track {
  height: 6px;
  background: rgba(255,255,255,.08);
  border-radius: 99px;
  margin-top: 22px;
  overflow: hidden;
}
.creating__progress-bar {
  height: 100%;
  background: linear-gradient(90deg, #FF8A50, var(--acc));
  border-radius: 99px;
  transition: width .6s ease;
  width: 0%;
}
.creating__progress-text { font-size: 12px; color: var(--onPanel2); margin-top: 10px; }

.creating__failed { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.creating__failed .creating__title { margin-top: 4px; font-size: 21px; }
.creating__failed .creating__lead { margin-top: 0; max-width: 30em; }
.creating__failed-icon {
  width: 58px; height: 58px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: var(--warn);
  background: var(--warnBg);
  border: 1px solid var(--warnBd);
}
.creating__failed-order {
  font-size: 12.5px;
  color: var(--onPanel2);
  background: rgba(255,255,255,.05);
  border: 1px solid var(--onPanelLine);
  border-radius: 999px;
  padding: 5px 13px;
  font-variant-numeric: tabular-nums;
}

.creating__failed-link {
  text-decoration: none;
}
.creating__failed-hint {
  font-size: 12.5px;
  color: var(--onPanel2);
  line-height: 1.5;
  max-width: 340px;
  text-wrap: pretty;
}
.creating__failed .btn { min-width: 220px; }

.screen--error {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 36px 20px;
}
.error-card {
  width: 100%;
  max-width: 460px;
  text-align: center;
}
.error-card__icon {
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--warnBg);
  border: 1px solid var(--warnBd);
  color: var(--warn);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}
.error-card__title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -.015em;
}
.error-card__body {
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--mut);
  margin-top: 12px;
  text-wrap: pretty;
}

.footer {
  border-top: 1px solid var(--line);
  background: var(--tint);
}
.footer__inner {
  padding: 20px 40px;
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
.footer__brand {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.footer__copyright { font-size: 12.5px; color: var(--mut3); white-space: nowrap; }
.footer__contact {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--mut2);
}
.footer__contact:hover { color: var(--ink); }
.footer__spacer { flex: 1; }
.footer__links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px 20px;
  flex-wrap: wrap;
  margin-left: auto;
}
.footer__legal { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.footer__legal a { font-size: 12.5px; color: var(--mut2); }
.footer__legal a:hover { color: var(--ink); }
.footer__socials { display: flex; align-items: center; gap: 8px; }
.footer__social {
  width: 34px; height: 34px;
  border-radius: 11px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--mut2);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  transition: all .18s;
}
.footer__social:hover { color: var(--acc); border-color: var(--accB); background: var(--accT); }
.footer__social--hidden { display: none; }

@media (max-width: 900px) {
  .hdr__inner, .footer__inner { padding: 0 18px !important; gap: 12px !important; }
  .footer__inner { padding: 20px 18px !important; }
  .hide-mobile { display: none !important; }
  .pane { padding: 26px 20px 34px !important; }
  .steps { gap: 5px !important; font-size: 11.5px !important; }
  .card__title, .error-card__title { font-size: 23px !important; }

  .screen--step2 .screen__body { flex-direction: column; }
  .pane--summary, .pane--checkout { flex: 1 1 auto; }

  .pane--summary__sticky { position: static; }
  .pane--summary__content {
    max-height: none;
    overflow-y: visible;
  }
}

@media (max-width: 480px) {
  .card { padding-left: 16px; padding-right: 16px; }

  .plan-box__price-row { flex-wrap: wrap; row-gap: 10px; }
  .plan-box__name { flex: 1 0 100%; }

  .wallet-field { flex-direction: column; }
  .wallet-field__copy { padding: 13px 16px; }

  .method-list { flex-direction: column; }
  .invoice__actions,
  .modal__actions { flex-direction: column; }
  .invoice__actions .btn--ghost,
  .modal__actions .btn--ghost { order: 2; }
}

@media (max-width: 380px) {
  .plan-box { padding: 16px 14px; }
  .plan-box__price-row { column-gap: 8px; }
  .plan-box__term { font-size: 10.5px; padding: 3px 8px; }
  .plan-box__spacer { display: none; }
  .plan-box__change { margin-left: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .confetti { display: none; }
}