/* Generated by scripts/gen-style-bundle.sh. Edit the source CSS modules. */

/* css/theme.css */
:root {
  --color-bg-page: #f2f2f7;
  --color-bg-panel: #ffffff;
  --color-bg-panel-alt: #f9f9fb;
  --color-bg-elevated: #f3f4f6;
  --color-bg-muted: #f5f5f5;
  --color-bg-subtle: #f7f7f7;

  --black: #222222;
  --black-light: #525252;
  --gray-light: var(--color-border-soft);

  --color-border-soft: #e6e6e6;
  --color-border-muted: #9d9f9f;
  --color-border: #d1d1d6;
  --color-border-strong: #ccd6dd;
  --color-border-input: #dcdcdc;

  --color-overlay-strong: rgba(255, 255, 255, 0.66);

  --color-text-primary: #1c1c1e;
  --color-text-secondary: #3c3c43;
  --color-text-tertiary: #6e6e73;
  --color-text-muted: #949494;
  --color-text-inverse: #ffffff;

  --color-primary-50: #e5f1ff;
  --color-primary-100: #eaf3ff;
  --color-primary-200: #63a6ff;
  --color-primary-300: #3e8ef7;
  --color-primary-400: #3a84fe;
  --color-primary-500: #007aff;
  --color-primary-600: #005ecb;
  --color-primary-700: #004a99;
  --color-primary-800: #036ba6;
  --color-primary-900: #0056b3;
  --color-primary-contrast: #ffffff;

  --color-primary-disabled: #3c7fd7;
  --color-primary-transparent: rgba(62, 142, 247, 0.05);
  --color-primary-soft: rgba(62, 142, 247, 0.1);

  --color-input-disabled: #f6f5f6;

  --color-success: #13c296;
  --color-success-soft: rgba(19, 194, 150, 0.1);

  --color-error: #e10e0e;
  --color-error-hover: #f12020;
  --color-error-soft: #feebeb;

  --color-warning: #ff6a5f;

  --primary: var(--color-primary-300);
  --primary-disabled: var(--color-primary-disabled);
  --primary-transparent: var(--color-primary-transparent);
  --primary-bg-hover: var(--color-bg-muted);
  --primary-active: var(--color-primary-400);
  --primary-hover: var(--color-primary-100);
  --text-primary: var(--color-primary-400);
  --text-gray: var(--color-text-muted);
  --option-bg-hover: var(--color-bg-muted);
  --white: var(--color-bg-panel);
  --border: var(--color-border);
  --bg-table-wrapper: var(--color-bg-panel-alt);
  --table-title: var(--color-text-tertiary);
  --apple-gray-light: var(--color-bg-page);
  --apple-border: var(--color-border);
  --apple-text: var(--color-text-primary);
  --apple-blue: var(--color-primary-500);
  --apple-blue-light: var(--color-primary-100);
  --apple-blue-hover: var(--color-primary-600);
  --error: var(--color-error);
  --error-hover: var(--color-error-hover);
  --error-transparent: var(--color-error-soft);
  --selected-option: var(--color-primary-soft);
  --input-disabled: var(--color-input-disabled);
  --success: var(--color-success);
  --success-transparent: var(--color-success-soft);
}


/* css/header.css */
body {
  font-family: Arial, sans-serif;
  background-color: var(--color-bg-elevated);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.logo-link {
  color: var(--color-primary-500);
  justify-content: center;
  align-items: center;
  position: relative;
  display: inline-block;
  width: 69px;
  height: 64px;
  transform: scale(0.8);
  transform-origin: left center;
}

@keyframes gradientShift {
  0% {
    background-position: 0% 100%;
  }
  100% {
    background-position: 100% 0%;
  }
}

.logo-link::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    45deg,
    var(--color-primary-500) 0%,
    var(--color-primary-500) 10%,
    var(--color-primary-500) 20%,
    var(--color-primary-500) 30%,
    red 55%,
    orange 60%,
    yellow 65%,
    green 70%,
    cyan 75%,
    blue 80%,
    magenta 85%,
    red 90%,
    var(--color-primary-500) 100%
  );
  background-size: 300% 300%;
  background-position: 0% 100%;
  animation: gradientShift 3s ease-in-out infinite alternate paused;
  animation-fill-mode: backwards;
  clip-path: path(
    'M41.5073 45.9937L40.0181 47.3707L35.5093 42.2496V55.4996H33.4907V42.2496L28.9673 47.3707L27.4927 45.9937L34.4927 38.2135L41.5073 45.9937ZM14.6733 37.5592C16.2322 37.5592 17.4985 38.8255 17.4985 40.3844C17.4984 41.9431 16.2321 43.2096 14.6733 43.2096H3.78955C2.23087 43.2095 0.964464 41.943 0.964355 40.3844C0.964355 38.8256 2.23081 37.5592 3.78955 37.5592H14.6733ZM65.2104 37.5592C66.7693 37.5592 68.0356 38.8255 68.0356 40.3844C68.0355 41.9431 66.7692 43.2095 65.2104 43.2096H54.3267C52.7679 43.2096 51.5016 41.9431 51.5015 40.3844C51.5015 38.8255 52.7678 37.5592 54.3267 37.5592H65.2104ZM24.8481 34.607C28.1607 30.5571 33.9091 29.0123 38.8081 30.8355C43.6793 32.6449 46.9636 37.3634 47.0054 42.5826L47.019 43.2086H44.6392V42.5963C44.5974 37.7808 41.174 33.5917 36.4839 32.6451C32.3781 31.81 27.9793 33.7444 25.8081 37.3492C24.8756 38.908 24.3745 40.7176 24.3745 42.5826V43.2086H21.9946V42.5826C22.0085 39.6737 23.0249 36.8339 24.8481 34.607ZM3.78955 39.4791C3.28858 39.4792 2.88525 39.8834 2.88525 40.3844C2.88536 40.8853 3.28864 41.2886 3.78955 41.2887H14.6733C15.1743 41.2887 15.5785 40.8853 15.5786 40.3844C15.5786 39.8833 15.1744 39.4791 14.6733 39.4791H3.78955ZM54.3267 39.4791C53.8256 39.4791 53.4224 39.8833 53.4224 40.3844C53.4225 40.8853 53.8257 41.2887 54.3267 41.2887H65.2104C65.7114 41.2887 66.1146 40.8853 66.1147 40.3844C66.1147 39.8833 65.7115 39.4791 65.2104 39.4791H54.3267ZM13.0591 16.7935C13.8107 16.7935 14.5212 17.0859 15.064 17.6148L22.7603 25.3111C23.2891 25.84 23.5815 26.5496 23.5815 27.315C23.5815 28.0804 23.289 28.7762 22.7603 29.3189C22.2176 29.8477 21.508 30.1401 20.7427 30.1402C19.9911 30.1402 19.2806 29.8478 18.7378 29.3189L11.0552 21.6226C10.5264 21.0938 10.2339 20.3841 10.2339 19.6187C10.2339 18.8673 10.5265 18.1576 11.0552 17.6148C11.584 17.086 12.2937 16.7936 13.0591 16.7935ZM53.937 16.9039C55.0365 15.8045 56.8317 15.8045 57.9312 16.9039C59.0306 18.0034 59.0305 19.7985 57.9312 20.898L50.2349 28.5953C49.72 29.1241 49.01 29.4302 48.2446 29.4303C47.4931 29.4303 46.7825 29.1378 46.2397 28.609C45.711 28.0802 45.4195 27.3704 45.4194 26.6051C45.4194 25.8535 45.7109 25.143 46.2397 24.6002L53.937 16.9039ZM13.0591 18.7281C12.8228 18.7282 12.5863 18.825 12.4194 18.9918C12.2524 19.1588 12.1548 19.3819 12.1548 19.6324C12.1548 19.869 12.2524 20.106 12.4194 20.273L20.1157 27.9693C20.2827 28.1363 20.5058 28.234 20.7563 28.234C20.9928 28.2339 21.229 28.1362 21.396 27.9693C21.563 27.8023 21.6606 27.5792 21.6606 27.3287C21.6605 27.0922 21.5629 26.856 21.396 26.689L13.686 18.9918C13.519 18.8248 13.2956 18.7281 13.0591 18.7281ZM55.9409 18.0035C55.7043 18.0035 55.4812 18.0872 55.3003 18.2681L47.604 25.9644C47.2561 26.3124 47.2561 26.8831 47.604 27.231C47.771 27.3981 47.9941 27.4957 48.2446 27.4957C48.4811 27.4956 48.7173 27.3979 48.8843 27.231L56.5815 19.5347C56.9294 19.1869 56.9292 18.6161 56.5815 18.2681C56.4006 18.0872 56.1775 18.0035 55.9409 18.0035ZM29.314 8.60408C29.6715 8.31549 30.16 8.67812 30.0854 9.13143L30.0327 9.49373C29.9875 9.85832 29.9644 10.2302 29.9644 10.607L29.9761 11.0699C30.2094 15.6719 33.8994 19.3621 38.5015 19.5953L38.9644 19.607C40.1649 19.607 41.3101 19.3711 42.3569 18.9439C42.7825 18.7703 43.2442 19.1654 43.0415 19.5777L42.8989 19.8541C41.3822 22.6827 38.3987 24.607 34.9644 24.607L34.5015 24.5953C29.8995 24.3621 26.2094 20.6719 25.9761 16.0699L25.9644 15.607C25.9645 12.7773 27.2715 10.2534 29.314 8.60408ZM28.3921 12.5474C28.0147 13.356 27.7812 14.2448 27.7271 15.1822L27.7144 15.607C27.7145 19.6109 30.9604 22.857 34.9644 22.857C36.6314 22.857 38.1667 22.2927 39.3921 21.3453C39.2501 21.3509 39.1076 21.357 38.9644 21.357C33.6901 21.357 29.3059 17.5579 28.3921 12.5474ZM38.4888 8.96443C38.6384 8.50378 39.2903 8.50378 39.4399 8.96443L39.7505 9.91854C39.8092 10.0987 39.9632 10.229 40.146 10.2584L40.2261 10.2642H41.23C41.714 10.2644 41.9152 10.8837 41.5239 11.1685L40.7114 11.7594C40.5364 11.8867 40.463 12.1121 40.5298 12.3179L40.8403 13.273C40.9803 13.7048 40.5252 14.0686 40.145 13.8775L40.0708 13.8326L39.2583 13.2418C39.0831 13.1145 38.8456 13.1145 38.6704 13.2418L37.8579 13.8326L37.7837 13.8775C37.4035 14.0686 36.9484 13.7048 37.0884 13.273L37.3989 12.3179C37.4574 12.1377 37.4084 11.9424 37.2778 11.8111L37.2173 11.7594L36.4048 11.1685C36.0379 10.9014 36.192 10.34 36.6118 10.2711L36.6987 10.2642H37.7026L37.7827 10.2584C37.9395 10.2331 38.0754 10.134 38.1479 9.99275L38.1782 9.91854L38.4888 8.96443ZM38.939 10.1666C38.7647 10.7018 38.2656 11.064 37.7026 11.064H37.6226L37.688 11.1119L37.77 11.1773C38.1654 11.5165 38.3226 12.0631 38.1597 12.565L38.1343 12.6422L38.2007 12.5943L38.2876 12.5367C38.7028 12.2833 39.2259 12.2833 39.6411 12.5367L39.728 12.5943L39.7935 12.6422L39.769 12.565C39.5952 12.0296 39.7854 11.4429 40.2407 11.1119L40.3062 11.064H40.2261C39.6981 11.064 39.2262 10.7454 39.0259 10.2642L38.9897 10.1666L38.9644 10.0885L38.939 10.1666Z'
  );
}

.logo-link:hover::before {
  animation-play-state: running;
}

header {
  position: relative;
  width: calc(100% - 60px);
  height: auto;
  background: var(--color-bg-panel);
  margin: 0 30px;
  border-radius: 24px;
  top: 10px;
  overflow: visible;
}

header .section_container {
  display: flex;
  width: 100%;
}

header .header-wrapper {
  width: 100%;
  padding: 0 20px;
}

.header-content-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  gap: 40px;
}

.header-links-container {
  display: flex;
  align-items: center;
  flex: 1;
}

.articles-btn_container {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-left: auto;
  z-index: 40;
  color: var(--color-text-primary);
  cursor: pointer;
  padding: 10px 12px 10px 10px;
  border-bottom: 1px solid transparent;
  border-radius: 12px;
  transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

.articles-btn_container:not(:has(.articles-dropdown:hover)):hover {
  border-bottom-color: transparent;
  background-color: rgba(15, 23, 42, 0.04);
  color: var(--color-text-primary);
}

.articles-btn_container:focus-visible {
  outline: 2px solid var(--color-primary-400, #5b7cff);
  outline-offset: 2px;
  border-radius: 10px;
}

.articles-btn_container[aria-expanded='true'] {
  border-bottom-color: transparent;
  background-color: rgba(43, 76, 254, 0.08);
  color: var(--color-primary-700, #1e3a8a);
  box-shadow: 0 0 0 1px rgba(43, 76, 254, 0.12);
}

.articles-btn {
  color: inherit;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.2;
  user-select: none;
}

.articles-btn_chevron {
  flex-shrink: 0;
  opacity: 0.45;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.articles-btn_container[aria-expanded='true'] .articles-btn_chevron {
  transform: rotate(180deg);
  opacity: 0.75;
}

.articles-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
  z-index: 1000;
  display: none;
  flex-direction: column;
  gap: 2px;
  min-width: 252px;
  padding: 8px;
  background-color: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 18px;
  box-shadow:
    0 4px 6px -1px rgba(15, 23, 42, 0.05),
    0 20px 50px -12px rgba(15, 23, 42, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset;
}

.articles-dropdown.visible {
  display: flex;
  animation: articlesDropdownIn 0.22s cubic-bezier(0.2, 0.85, 0.35, 1) forwards;
}

.dropdown-group-title {
  display: block;
  padding: 10px 12px 6px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-muted, #6e6e73);
  border-bottom: none;
  margin: 0;
}

.dropdown-group-title:first-child {
  padding-top: 6px;
}

.dropdown-link {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--color-text-primary, #1c1c1e);
  text-decoration: none;
  min-height: 42px;
  padding: 10px 14px;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.01em;
  text-align: left;
  transition: background-color 0.16s ease, color 0.16s ease;
  background: rgba(15, 23, 42, 0.02);
  border: none;
  border-radius: 12px;
}

.dropdown-link:hover {
  background-color: rgba(43, 76, 254, 0.09);
  color: var(--color-primary-700, #1e3a8a);
}

.dropdown-link:focus-visible {
  outline: 2px solid var(--color-primary-400, #5b7cff);
  outline-offset: 0;
}

.nav-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  overflow: visible;
}

.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.mobile-menu[hidden] {
  display: none;
}

.mobile-menu.is-open {
  pointer-events: auto;
  opacity: 1;
}

.mobile-menu_backdrop {
  position: absolute;
  inset: 0;
  background: rgba(12, 16, 24, 0.4);
}

.mobile-menu_panel {
  position: relative;
  margin-left: auto;
  width: min(320px, 85%);
  max-width: 360px;
  height: 100%;
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top-left-radius: 24px;
  border-bottom-left-radius: 24px;
  border-left: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: -12px 0 40px rgba(15, 23, 42, 0.12);
  padding: 24px 18px 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  transform: translateX(100%);
  transition: transform 0.32s cubic-bezier(0.25, 0.9, 0.35, 1);
  overflow-y: auto;
}

.mobile-menu.is-open .mobile-menu_panel {
  transform: translateX(0);
}

.mobile-menu_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.mobile-menu_title {
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text-primary);
}

.mobile-menu_close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 18px;
  background: transparent;
  color: var(--color-text-primary);
  cursor: pointer;
  transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.mobile-menu_close:hover,
.mobile-menu_close:focus-visible {
  background-color: var(--color-bg-panel-alt);
  box-shadow: 0 0 0 2px rgba(20, 24, 38, 0.08);
  outline: none;
}

.mobile-menu_links {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
  margin: 0;
}

.mobile-menu_link {
  display: block;
  padding: 13px 16px;
  border-radius: 14px;
  text-decoration: none;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--color-text-primary);
  background-color: rgba(15, 23, 42, 0.03);
  border: 1px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.mobile-menu_link:hover,
.mobile-menu_link:focus-visible {
  background-color: rgba(43, 76, 254, 0.08);
  border-color: rgba(43, 76, 254, 0.12);
  color: var(--color-primary-700);
  outline: none;
}

.mobile-menu_item--group {
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px solid var(--color-border-soft, rgba(0, 0, 0, 0.06));
}

.mobile-menu_item--group:first-child {
  margin-top: 0;
  padding-top: 0;
  border-top: none;
}

.mobile-menu_group-title {
  display: block;
  padding: 8px 14px 4px;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-muted, #6b7280);
}

@media (min-width: 769px) {
  .mobile-menu {
    display: none !important;
  }
}

body.mobile-menu-open {
  overflow: hidden;
}

/* Переключатель языка: только флаги, без обводки у кнопки */
.language-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.language-switcher_btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 12px;
  box-shadow: none;
  cursor: pointer;
  transition: background-color 0.2s ease, opacity 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

.language-switcher_btn:hover {
  background: rgba(15, 23, 42, 0.06);
}

.language-switcher_btn:focus-visible {
  outline: 2px solid var(--color-primary-400, #5b7cff);
  outline-offset: 2px;
}

.language-switcher_btn[aria-expanded='true'] {
  background: rgba(15, 23, 42, 0.08);
}

.logo-link_svg {
  display: block;
}

.language-switcher_flag {
  display: block;
  width: 28px;
  height: auto;
  border-radius: 3px;
}

.language-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  z-index: 1001;
  padding: 8px;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 16px;
  box-shadow:
    0 4px 6px -1px rgba(15, 23, 42, 0.05),
    0 20px 50px -12px rgba(15, 23, 42, 0.18),
    0 0 0 1px rgba(255, 255, 255, 0.6) inset;
  display: none;
  flex-direction: column;
}

.language-dropdown.language-dropdown--flags {
  flex-direction: row;
  align-items: center;
  gap: 4px;
  min-width: 0;
}

.language-dropdown.visible {
  display: flex;
  animation: articlesDropdownIn 0.2s cubic-bezier(0.2, 0.85, 0.35, 1) forwards;
}

.language-dropdown_item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  margin: 0;
  color: inherit;
  text-decoration: none;
  transition: background-color 0.16s ease, transform 0.16s ease;
  border: none;
  background: rgba(15, 23, 42, 0.03);
  border-radius: 12px;
  box-sizing: border-box;
  line-height: 0;
}

.language-dropdown_item:hover {
  background: rgba(43, 76, 254, 0.1);
  transform: scale(1.04);
}

.language-dropdown_item.is-active {
  background: rgba(43, 76, 254, 0.14);
  box-shadow: 0 0 0 1px rgba(43, 76, 254, 0.2);
}

.language-dropdown_flag {
  flex-shrink: 0;
  display: block;
  width: 28px;
  height: auto;
  border-radius: 3px;
}

@media (max-width: 768px) {
  .nav-controls {
    gap: 8px;
    margin-left: auto;
  }

  .mobile-menu_toggle {
    display: inline-flex;
  }
}

@keyframes articlesDropdownIn {
  from {
    opacity: 0;
    transform: translateY(-6px) scale(0.98);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.network-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  gap: 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-primary);
  text-decoration: none;
  border-radius: 12px;
  padding: 6px 10px;
  margin: -6px -10px;
  cursor: pointer;
  transition: color 0.2s ease;
}

.network-stats:hover {
  color: var(--color-primary-700, #1e3a8a);
}

.network-stats:focus-visible {
  outline: 2px solid var(--color-primary-400, #5b7cff);
  outline-offset: 2px;
}

.network-stats .stats-item {
  display: flex;
  align-items: center;
  gap: 4px;
}

.network-stats .icon {
  font-size: 14px;
}

.header-content-container {
  height: 68px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.non-auth-header {
  width: 100%;
  max-width: 900px;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: none;
  position: sticky;
  top: 0;
  z-index: 1000;
  margin: 20px auto 0 auto;
  overflow: visible;
}

@media (min-width: 769px) {
  .mobile-menu_toggle {
    display: none;
  }
}

@media (max-width: 768px) {
  .header-content-container {
    height: 50px;
  }

  header {
    margin: 0;
    width: 100%;
  }

  .mobile-menu_toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--color-text-primary);
  }

  .network-stats {
    font-size: 14px;
    justify-content: flex-start;
    flex: 0 0 auto;
    order: -1;
  }

  .header-content-container {
    padding: 0 16px;
    gap: 0;
    justify-content: space-between;
  }

  .logo-link {
    display: none;
  }

  .header-links-container,
  .articles-btn_container {
    display: none !important;
  }

  .non-auth-header .header-content-container {
    justify-content: space-between;
    position: relative;
  }

  .non-auth-header .header-content-container .mobile-menu_toggle {
    order: 1;
    flex: 0 0 auto;
  }

  .non-auth-header .header-content-container .logo-link {
    order: 2;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.8);
    transform-origin: center;
  }

  .non-auth-header .header-content-container .nav-controls {
    order: 3;
    margin-left: auto;
  }

  header .header-wrapper {
    padding: 0;
  }

  .non-auth-header {
    width: 100%;
    max-width: 100%;
    margin: 0;
    border-radius: 0;
  }
}


/* css/layout.css */
/* Page wrapper and shared content layout (static pages, main shell) */
.aboutUs-page_wrapper {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

#main-content {
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  width: 100%;
}

#main-content > main {
  width: 100%;
  display: flex;
  flex: 1 0 auto;
  flex-direction: column;
  align-items: center;
  min-height: auto;
  padding-bottom: 32px;
}

section {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.section_container {
  max-width: 900px;
  width: 100%;
  align-items: center;
  margin: 0;
  padding: 0 24px;
  position: relative;
  height: 100%;
}

.shell {
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  padding: 0 24px;
}

.app-footer {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: auto;
  padding-top: 10px;
  padding-bottom: 14px;
  color: var(--color-text-tertiary);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 12px;
  line-height: 1.4;
  text-align: center;
}

.app-footer .branding-line {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.35em;
}

.app-footer .branding-line b {
  color: var(--color-text-primary);
  font-weight: 700;
}

.content_section {
  padding: 20px 0;
  width: 100%;
}

.content_section article {
  display: flex;
  flex-direction: column;
  gap: 15px;
  width: 100%;
}

#about-us h1,
.content_section .section_container > h1 {
  font-weight: 600;
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  line-height: 1.3;
  margin-bottom: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  padding-bottom: 0.06em;
}

.content_section h2 {
  font-weight: 600;
  font-size: 18px;
  color: #2c2c2e;
  margin-top: 0px;
  margin-bottom: 5px;
}

.content_section h3 {
  font-weight: 700;
  font-size: 16px;
  color: var(--black);
  margin-top: 12px;
}

.content_section h4 {
  font-weight: 500;
  font-size: 16px;
  color: var(--color-text-secondary);
  margin-top: 12px;
}

.content_section p,
.content_section li {
  font-size: 15px;
  line-height: 1.6;
  color: var(--color-text-secondary);
}

.content_section ul {
  list-style: none;
  padding-left: 18px;
}

.content_section li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 10px;
}

.content_section li::before {
  content: '';
  position: absolute;
  top: 9px;
  left: 0;
  width: 6px;
  height: 6px;
  background: var(--apple-blue);
  border-radius: 50%;
}

.content_section p {
  font-weight: 400;
  font-size: 16px;
  color: var(--black);
}

.green-highlight {
  font-weight: 600;
  color: var(--color-success);
}

.content_section article ul {
  list-style: none;
  padding-left: 0px;
}

.content_section article li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  font-size: 16px;
  color: #2c2c2e;
  line-height: 1.4;
}

.content_section article li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  background-color: var(--color-primary-500);
  border-radius: 50%;
}

.content_section .section_container {
  display: flex;
  flex-direction: column;
  gap: 20px;
  background: white;
  border-radius: 24px;
  padding: 30px;
  margin-bottom: 32px;
}

.text-highlight {
  border-left: 4px solid var(--color-primary-300);
  padding: 1rem;
  margin: 0;
  display: block;
}

@media (max-width: 850px) {
  .content_section article {
    padding: 24px;
  }

  .content_section {
    padding: 30px 10px 10px 10px;
  }

  .content_section article ul {
    padding-left: 8px;
  }
}

@media (max-width: 768px) {
  .section_container {
    padding: 0 16px;
  }

  .content_section .section_container {
    padding: 24px;
    border-radius: 20px;
    margin-bottom: 14px;
  }

  #about-us h1,
  .content_section .section_container > h1 {
    font-size: clamp(1.8rem, 6vw, 2.8rem);
  }

  .content_section h2 {
    font-size: 20px;
  }

  .content_section h3 {
    font-size: 16px;
  }

  .content_section p,
  .content_section li {
    font-size: 14px;
  }

  #main-content > main {
    padding-bottom: 30px;
  }

  .content_section article {
    padding: 16px;
  }
}

@media (max-width: 480px) {
  .content_section .section_container {
    padding: 10px;
  }

  #about-us h1,
  .content_section .section_container > h1 {
    font-size: 1.8rem;
  }

  .content_section h2 {
    font-size: 18px;
  }

  .content_section h3,
  .content_section h4 {
    font-size: 15px;
  }

  .content_section p,
  .content_section li {
    font-size: 15px;
  }

  .green-highlight {
    font-size: 13px;
    padding: 2px 4px;
  }

  #main-content > main {
    padding-bottom: 20px;
  }

  .content_section article {
    padding: 12px;
  }

  .content_section .section_container {
    margin-bottom: 20px;
  }
}

@media (max-width: 360px) {
  .section_container {
    padding: 0 12px;
  }

  .content_section .section_container {
    padding: 16px;
  }

  .content_section p,
  .content_section li {
    font-size: 13px;
  }
}

/* css/home.css */
/* Main page: hero, essence, next-steps */
.compact-main {
  gap: 80px;
}

.compact-main .hero {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.compact-main .hero h1 {
  font-weight: 600;
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  line-height: 1.3;
  margin: 0 0 16px 0;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  padding-bottom: 0.06em;
}

.compact-main .hero-media {
  width: 100%;
  border-radius: 16px;
  overflow: hidden;
  background: var(--color-bg-panel);
}

.compact-main .hero-media picture {
  display: block;
}

.compact-main .hero-media .pre-image {
  width: 100%;
  display: block;
  vertical-align: middle;
}

.compact-main .hero-lead {
  font-size: 17px;
  line-height: 1.65;
  color: var(--color-text-secondary);
  margin: 0;
}

.main-block {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.main-block > h2 {
  font-size: clamp(1.5rem, 3vw, 2.2rem);
  font-weight: 600;
  margin: 0;
  color: var(--color-text-primary);
}

.essence-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.essence-item {
  padding: 20px 0;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.essence-item:first-child {
  border-top: none;
  padding-top: 0;
}

.essence-item h3 {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 6px;
  color: var(--color-text-primary);
}

.essence-item p {
  font-size: 15px;
  line-height: 1.6;
  margin: 0;
  color: var(--color-text-secondary);
}

.next-steps-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
}

.next-step-link {
  display: block;
  padding: 20px;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: #fff;
  transition: background 0.15s ease;
}

.next-step-link:hover {
  background: rgba(0, 0, 0, 0.02);
}

.next-step-link h3 {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--color-text-primary);
}

.next-step-link p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  color: var(--color-text-secondary);
}

@media (max-width: 900px) {
  .compact-main {
    gap: 56px;
  }

  .next-steps-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .compact-main {
    gap: 48px;
  }
}

@media (max-width: 480px) {
  .compact-main {
    gap: 40px;
  }

  .essence-item,
  .next-step-link {
    padding: 16px 0;
  }

  .next-step-link {
    padding: 16px;
  }
}

/* css/solutions.css */
.solutions-header {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}

.solutions-header h1 {
  font-size: clamp(2.25rem, 4vw, 3rem);
  margin-bottom: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.solutions-grid {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
}

.solution-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--color-bg-panel);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 18px 32px rgba(20, 27, 45, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.solution-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(20, 27, 45, 0.14);
}

.solution-card_media {
  position: relative;
  overflow: hidden;
}

.solution-card_media--placeholder {
  height: 272px;
  background: linear-gradient(135deg, #d8d8de 0%, #c4c4cc 100%);
}

.solution-card_media img {
  width: 100%;
  height: 272px;
  object-fit: cover;
  display: block;
}

.solution-card_status {
  position: absolute;
  top: 16px;
  left: 16px;
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--color-primary-500);
  color: var(--color-text-inverse);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.solution-card_tone-beta .solution-card_status {
  background: var(--color-primary-500);
}

.solution-card_tone-soon .solution-card_status {
  background: var(--color-text-tertiary);
  color: var(--color-text-inverse);
}

.solution-card_body {
  padding: 24px 24px 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-grow: 1;
}

.solution-card_body h2 {
  font-size: 1.5rem;
  margin: 0;
}

.solution-card_body p {
  margin: 0;
  color: var(--color-text-secondary);
  line-height: 1.6;
}

.solution-card_link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 24px 24px;
  padding: 12px 20px;
  border-radius: 999px;
  background: var(--color-primary-soft);
  color: var(--color-primary-700);
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

.solution-card_link:hover,
.solution-card_link:focus-visible {
  background: var(--color-primary-500);
  color: var(--color-text-inverse);
}

.solution-card_disabled {
  opacity: 0.92;
  border-color: var(--color-border);
  box-shadow: none;
}

.solution-card_disabled:hover {
  transform: none;
  box-shadow: none;
  border-color: var(--color-border);
}

.solution-card_disabled .solution-card_link {
  background: var(--color-bg-muted);
  color: var(--color-text-muted);
  pointer-events: none;
}

.solution-card_disabled .solution-card_link:hover,
.solution-card_disabled .solution-card_link:focus-visible {
  background: var(--color-bg-muted);
  color: var(--color-text-muted);
}

.solutions-note {
  margin-top: 48px;
  text-align: center;
  color: var(--color-text-secondary);
  line-height: 1.6;
}

@media (max-width: 768px) {
  .solutions-header {
    margin-bottom: 32px;
    text-align: left;
  }

  .solution-card_link {
    width: calc(100% - 48px);
  }
}

/* css/error.css */
.not-found-page {
  background:
    radial-gradient(circle at 18% 12%, rgba(0, 122, 255, 0.14), transparent 30rem),
    radial-gradient(circle at 84% 72%, rgba(19, 194, 150, 0.12), transparent 28rem),
    var(--color-bg-page);
}

.error-page {
  display: flex;
  flex: 1 0 auto;
  align-items: center;
  justify-content: center;
  padding: 42px 24px 28px;
}

.error-card {
  position: relative;
  width: min(100%, 760px);
  overflow: hidden;
  padding: clamp(32px, 7vw, 72px);
  border: 1px solid rgba(255, 255, 255, 0.82);
  border-radius: 32px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 24px 80px rgba(30, 64, 120, 0.13);
  text-align: center;
  backdrop-filter: blur(18px);
}

.error-card::before,
.error-card::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.error-card::before {
  width: 190px;
  height: 190px;
  top: -112px;
  right: -68px;
  border: 30px solid rgba(0, 122, 255, 0.09);
}

.error-card::after {
  width: 76px;
  height: 76px;
  bottom: -34px;
  left: 48px;
  background: rgba(19, 194, 150, 0.12);
}

.error-code {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  min-height: 48px;
  margin-bottom: 24px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--color-primary-500), #6558ff);
  box-shadow: 0 12px 28px rgba(0, 122, 255, 0.24);
  color: var(--color-text-inverse);
  font-size: 20px;
  font-weight: 800;
  letter-spacing: 0.16em;
}

.error-card h1 {
  margin: 0 auto;
  color: var(--color-text-primary);
  font-size: clamp(2rem, 6vw, 4rem);
  line-height: 1.05;
  letter-spacing: -0.04em;
}

.error-card p {
  max-width: 560px;
  margin: 20px auto 0;
  color: var(--color-text-secondary);
  font-size: clamp(1rem, 2vw, 1.15rem);
  line-height: 1.65;
}

.error-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 30px;
}

.error-action {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border: 1px solid var(--color-border-soft);
  border-radius: 14px;
  background: var(--color-bg-panel);
  color: var(--color-text-primary);
  font-weight: 700;
  text-decoration: none;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.error-action--primary {
  border-color: var(--color-primary-500);
  background: var(--color-primary-500);
  color: var(--color-text-inverse);
}

.error-action:hover,
.error-action:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(30, 64, 120, 0.14);
}

.error-action--primary:hover,
.error-action--primary:focus-visible {
  background: var(--color-primary-600);
}

@media (max-width: 560px) {
  .error-page {
    padding: 24px 16px 12px;
  }

  .error-card {
    border-radius: 24px;
  }

  .error-actions,
  .error-action {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .error-action {
    transition: none;
  }
}

/* css/styles.css */
/* ==============================================
   Общие стили
============================================== */

html,
body {
  height: 100%;
}

main {
  width: 100%;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

body {
  font-family: Arial, sans-serif;
  background: var(--apple-gray-light);
  margin: 0;
  padding: 0;
  color: var(--apple-text);
}

.skip-link {
  position: absolute;
  z-index: 2147483647;
  left: -9999px;
  padding: 0.75rem 1rem;
  background: var(--color-bg-panel, #fff);
  color: var(--apple-text, #000);
  border: 1px solid currentColor;
  text-decoration: none;
  font-weight: 600;
  border-radius: 4px;
}

.skip-link:focus {
  left: 0.5rem;
  top: 0.5rem;
}

* {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

button {
  border: none;
  background-color: transparent;
  outline: none;
  font-size: 14px;
  padding: 8px 10px;
}

.pre-image {
  max-width: 100%;
  height: auto;
  display: block;
  position: relative;
  margin: auto;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -webkit-user-drag: none;
}
