@font-face {
 font-family: 'MTS Wide';
 font-style: normal;
 font-weight: 500;
 src: url('https://static.kion.ru/kds/fonts/mtsfonts/MTSWide-Medium.woff2') format('woff2');
 font-display: swap;
}

@font-face {
 font-family: 'MTS Compact';
 font-style: normal;
 font-weight: 400;
 src: url('https://static.kion.ru/kds/fonts/mtsfonts/MTSCompact-Regular.woff2') format('woff2');
 font-display: swap;
}

@font-face {
 font-family: 'MTS Compact';
 font-style: normal;
 font-weight: 500;
 src: url('https://static.kion.ru/kds/fonts/mtsfonts/MTSCompact-Medium.woff2') format('woff2');
 font-display: swap;
}

*,
*::before,
*::after {
 box-sizing: border-box;
}

.skip-link {
 position: absolute;
 top: -50px;
 left: 0;
 background: #000;
 color: #fff;
 padding: 8px 16px;
 text-decoration: none;
 z-index: 10002;
 border: 2px solid #fff;
}

.skip-link:focus {
 top: 0;
}

body {
 margin: 0;
 min-height: 100vh;
 font-family: 'MTS Compact', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
 line-height: 1.6;
 color: #fff;
 background-color: #000;
 -webkit-font-smoothing: antialiased;
 padding-top: 120px;
 overflow-x: hidden;
 text-wrap: balance;
}

.splash-screen {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: #000;
 display: flex;
 align-items: center;
 justify-content: center;
 z-index: 10000;
 opacity: 1;
 visibility: visible;
 transition: opacity 0.5s ease-out, visibility 0.5s ease-out;
}

.splash-screen.hidden {
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
}

.splash-content {
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
}

.splash-spinner {
 width: 50px;
 height: 50px;
 border: 3px solid #ffffff19;
 border-top-color: #fff;
 border-radius: 50%;
 animation: spin 1s linear infinite;
}

@keyframes spin {
 to {
 transform: rotate(360deg);
 }
}

body.splash-active header,
body.splash-active .Content_Area,
body.splash-active footer {
 opacity: 0;
 transition: opacity 0.5s ease-in;
}

body.splash-active.splash-complete header,
body.splash-active.splash-complete .Content_Area,
body.splash-active.splash-complete footer {
 opacity: 1;
}

button {
 font: inherit;
 color: inherit;
 border: none;
 background: none;
 cursor: pointer;
}

a {
 color: #eaf7ff;
 text-decoration: underline;
 text-underline-offset: 2px;
 text-wrap: balance;
}

a:hover {
 text-decoration-thickness: 2px;
}

.Logo_header {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 width: 100%;
 height: 120px;
 background-color: transparent;
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding: 0;
 z-index: 1000;
}

.Logo_header .progressive-blur-container {
 position: absolute;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 width: 100%;
 height: 100%;
 pointer-events: none;
 overflow: hidden;
 z-index: 1;
}

.Logo_header .progressive-blur-container::before {
 content: '';
 position: absolute;
 inset: 0;
 background: linear-gradient(
 to bottom,
 #000000c6 0%,
 #0000008c 25%,
 #0000003f 60%,
 #00000000 100%
 );
 backdrop-filter: blur(40px);
 -webkit-backdrop-filter: blur(40px);
 transform: translateZ(0);
 mask-image: linear-gradient(
 to bottom,
 #000 0%,
 #000000f2 35%,
 #00000072 80%,
 #00000000 100%
 );
 -webkit-mask-image: linear-gradient(
 to bottom,
 #000 0%,
 #000000f2 35%,
 #00000072 80%,
 #00000000 100%
 );
 opacity: 0.95;
}

.Logo_header .MAIN_LOGO {
 display: flex;
 align-items: center;
 padding-left: 85px;
 position: relative;
 z-index: 12;
}

.Logo_header .MAIN_LOGO .header_logo {
 height: auto;
 width: auto;
 max-height: 28px;
}

.Logo_header .KDS {
 height: 25px;
 width: auto;
 padding-right: 85px;
 position: relative;
 z-index: 12;
 transition: transform 0.3s ease-out, height 0.3s ease-out, width 0.3s ease-out;
 transform-origin: center;
}

.Logo_header .KDS.scrolled {
 height: 25px;
 width: auto;
 transform: scale(0.5);
 opacity: 0.1;
}

.burger-menu-button {
 position: relative;
 z-index: 12;
}

.Content_Area {
 display: flex;
 gap: 60px;
 max-width: 1728px;
 margin: 0 auto;
 padding: 0 85px;
}

.KION_BLOCK,
.KION_MUSIC_BLOCK,
.KION_STROKI_BLOCK,
.ON_MEDIA_BLOCK {
 border-radius: 18px;
 background: var(--Background-Bratsk, #252525);
 display: flex;
 padding: 40px;
 flex-direction: column;
 align-items: flex-start;
 gap: 40px;
 margin-bottom: 40px;
 filter: blur(100px);
 transition: filter 0.5s cubic-bezier(1, 0.249, 0.252, 0.695);
 transform: translateZ(0);
 contain: layout style paint;
}

.KION_BLOCK.blur-visible,
.KION_MUSIC_BLOCK.blur-visible,
.KION_STROKI_BLOCK.blur-visible,
.ON_MEDIA_BLOCK.blur-visible {
 filter: blur(0px);
 will-change: auto;
}

.Main_Menu_FIXED {
 position: sticky;
 top: 120px;
 align-self: flex-start;
 width: 220px;
 padding: 12px;
 background-color: #1a1a1a;
 border-radius: 16px;
}

.Main_Menu_FIXED > [role="menubar"] {
 display: flex;
 flex-direction: column;
 gap: 4px;
}

.Main_Menu_FIXED .Menu_Item {
 padding: 10px;
 border-radius: 10px;
 background-color: transparent;
 color: #fff;
 font-family: 'MTS Compact', sans-serif;
 font-size: 14px;
 font-weight: 400;
 cursor: pointer;
 transition: background-color 0.2s;
 user-select: none;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
}

.Main_Menu_FIXED .Menu_Item:hover {
 background-color: #ffffff0c;
}

.Main_Menu_FIXED .Menu_Item.active {
 background-color: #fff;
 color: #000;
 font-weight: 500;
}

.Main_Menu_FIXED .Menu_Item p,
.mobile-menu .Menu_Item p {
 margin: 0;
 padding: 0;
}

.burger-menu-button {
 display: none;
 flex-direction: column;
 justify-content: space-around;
 width: 28px;
 height: 28px;
 background: transparent;
 border: none;
 cursor: pointer;
 padding: 0;
 z-index: 1001;
 position: relative;
}

.burger-line {
 width: 100%;
 height: 2px;
 background-color: #fff;
 border-radius: 2px;
}

.mobile-menu-overlay {
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: #000000f2;
 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);
 z-index: 1000;
 opacity: 0;
 visibility: hidden;
 transition: opacity 0.3s ease, visibility 0.3s ease;
}

.mobile-menu-overlay.active {
 opacity: 1;
 visibility: visible;
}

.mobile-menu {
 display: flex;
 flex-direction: column;
 gap: 4px;
 padding: 100px 20px 20px;
 max-width: 100%;
}

.mobile-menu .Menu_Item {
 padding: 16px;
 border-radius: 12px;
 background-color: #ffffff0c;
 color: #fff;
 font-family: 'MTS Compact', sans-serif;
 font-size: 16px;
 font-weight: 400;
 cursor: pointer;
 transition: background-color 0.2s;
 user-select: none;
 -webkit-user-select: none;
 -moz-user-select: none;
 -ms-user-select: none;
}

.mobile-menu .Menu_Item:hover {
 background-color: #ffffff19;
}

.mobile-menu .Menu_Item.active {
 background-color: #fff;
 color: #000;
 font-weight: 500;
}

.Logos_Content_Area {
 flex: 1;
 padding-bottom: 80px;
}

.Title_BIG {
 margin-bottom: 40px;
}

.Title_BIG_main {
 padding: 20px 20px 0 20px;
}

.Title_BIG h1,
.Title_BIG h2 {
 font-family: 'MTS Wide', sans-serif;
 font-size: 36px;
 font-weight: 500;
 line-height: 40px;
 margin: 0 0 12px;
 color: #fff;
 text-wrap: balance;
}

.Title_BIG p {
 font-family: 'MTS Compact', sans-serif;
 font-size: 18px;
 font-style: normal;
 font-weight: 400;
 line-height: normal;
 color: #B0B0B0;
 margin: 0;
 text-wrap: balance;
}

.Title_BIG .formats-list {
 margin: 8px 0 0 0;
 padding: 0;
 color: #ffffff99;
 font-family: 'MTS Compact', sans-serif;
 font-size: 18px;
 line-height: 1.6;
 list-style: none;
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 8px 20px;
 max-width: 350px;
}

.Title_BIG .formats-list li {
 margin: 0;
 padding-left: 20px;
 position: relative;
 display: flex;
 align-items: center;
}

.Title_BIG .formats-list li::before {
 content: '';
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 width: 16px;
 height: 16px;
 background-image: url('img/list-arrow.svg');
 background-size: contain;
 background-repeat: no-repeat;
 background-position: center;
}

.Title_Middle h2 {
 font-family: 'MTS Wide', sans-serif;
 font-size: 32px;
 font-style: normal;
 font-weight: 500;
 line-height: 36px;
 margin: 0 0 12px;
 color: #fff;
 font-feature-settings: 'liga' off, 'clig' off;
 text-wrap: balance;
}

.Title_Middle p {
 font-family: 'MTS Compact', sans-serif;
 font-size: 18px;
 font-style: normal;
 font-weight: 400;
 line-height: normal;
 color: #ffffff99;
 margin: 0;
 text-wrap: balance;
 display: inline-flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

.copy-text-btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 20px;
 height: 20px;
 padding: 0;
 margin: 0;
 margin-left: 4px;
 background: transparent;
 border: none;
 cursor: pointer;
 opacity: 0.6;
 transition: opacity 0.2s;
 vertical-align: middle;
}

.copy-text-btn:hover {
 opacity: 1;
}

.copy-text-btn:focus {
 outline: 2px solid #eaf7ff;
 outline-offset: 2px;
 border-radius: 2px;
}

.copy-text-btn img {
 display: block;
 width: 16px;
 height: 16px;
 filter: invert(1);
 opacity: 0.7;
 transition: opacity 0.2s;
}

.copy-text-btn:hover img {
 opacity: 1;
}

.Title_Small {
 display: flex;
 flex-direction: column;
 gap: 12px;
 align-items: flex-start;
 width: 100%;
}

.Title_Small h3 {
 font-family: 'MTS Wide', sans-serif;
 font-size: 24px;
 font-weight: 500;
 line-height: 28px;
 margin: 0;
 color: #fff;
 white-space: nowrap;
 text-wrap: balance;
}

.Title_Small .version {
 font-family: 'MTS Compact', sans-serif;
 font-size: 12px;
 color: #ffffffa5;
 margin: 0;
 text-wrap: balance;
}

.LOGOS,
.ICONS {
 display: flex;
 flex-direction: column;
 gap: 20px;
 align-items: flex-start;
 width: 100%;
}

.Main_logo_Block,
.Main_Icons_Block {
 display: grid;
 grid-template-columns: repeat(3, minmax(280px, 1fr));
 gap: 32px;
 max-width: 100%;
}

.Main_Icons_Block .Icons {
 display: grid;
 grid-template-columns: repeat(3, minmax(280px, 1fr));
 gap: 32px;
 max-width: 100%;
}

.Logo_Block {
 background-color: #1a1a1a;
 border-radius: 24px;
 padding: 24px;
 display: flex;
 flex-direction: column;
 gap: 16px;
}

.KION_LOGO_GRADIEN,
.KION_LOGO_White,
.KION_LOGO_Black,
.KION_Music_LOGO_Gradient,
.KION_Music_LOGO_White,
.KION_Music_LOGO_Black,
.KION_Stroki_LOGO_Gradient,
.KION_Stroki_LOGO_White,
.KION_Stroki_LOGO_Black,
.ON_Media_LOGO_Black,
.ON_Show_LOGO_Black,
.ON_Studio_LOGO_Black,
.ON_Label_LOGO_Black {
 border-radius: 14px;
 border: 1px solid var(--Gradient-Sochi, #ffffff19);
 display: flex;
 height: 140px;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 10px;
 align-self: stretch;
 padding: 0 40px;
 box-sizing: border-box;
}

.KION_LOGO_White,
.KION_Music_LOGO_White,
.KION_Stroki_LOGO_White {
 background-color: #1a1a1a;
}

.KION_LOGO_Black,
.KION_Music_LOGO_Black,
.KION_Stroki_LOGO_Black,
.ON_Media_LOGO_Black,
.ON_Show_LOGO_Black,
.ON_Studio_LOGO_Black,
.ON_Label_LOGO_Black {
 background-color: #fff;
}

.KION_LOGO_GRADIEN img,
.KION_LOGO_White img,
.KION_LOGO_Black img,
.KION_Music_LOGO_Gradient img,
.KION_Music_LOGO_White img,
.KION_Music_LOGO_Black img,
.KION_Stroki_LOGO_Gradient img,
.KION_Stroki_LOGO_White img,
.KION_Stroki_LOGO_Black img,
.ON_Media_LOGO_Black img,
.ON_Show_LOGO_Black img,
.ON_Studio_LOGO_Black img,
.ON_Label_LOGO_Black img {
 width: 224px;
 max-width: 100%;
 height: auto;
 aspect-ratio: 224 / 140;
 flex-shrink: 0;
 object-fit: contain;
}

.KION_Music_Ico_LOGO_Gradient,
.KION_Music_Ico_LOGO_White,
.KION_Music_Ico_LOGO_Black,
.KION_Stroki_Ico_LOGO_Gradient,
.KION_Stroki_Ico_LOGO_White,
.KION_Stroki_Ico_LOGO_Black {
 border-radius: 14px;
 border: 1px solid var(--Gradient-Sochi, #ffffff19);
 display: flex;
 height: 140px;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 10px;
 align-self: stretch;
}

.KION_Music_Ico_LOGO_White,
.KION_Stroki_Ico_LOGO_White {
 background-color: #1a1a1a;
}

.KION_Music_Ico_LOGO_Black,
.KION_Stroki_Ico_LOGO_Black {
 background-color: #fff;
}

.KION_App_Icon_Sq,
.KION_App_Icon_Rect,
.KION_Music_App_Icon,
.KION_Stroki_App_Icon {
 background-color: #1a1a1a;
 border-radius: 24px;
 padding: 24px;
 display: flex;
 flex-direction: column;
 gap: 24px;
 width: fit-content;
 align-self: flex-start;
 box-sizing: border-box;
}

.KION_App_Icon_Sq .KION_App_icon,
.KION_Music_App_Icon .KION_App_icon,
.KION_Stroki_App_Icon .KION_App_icon {
 width: 250px;
 height: 250px;
 border-radius: 14px;
 min-height: 250px;
 aspect-ratio: 1 / 1;
 object-fit: contain;
 flex-shrink: 0;
}

.KION_App_Icon_Rect .KION_App_icon {
 height: 250px !important;
 border-radius: 14px;
 width: 417px;
 object-fit: contain;
 flex-shrink: 0;
 display: block;
}

.Logo_Description {
 display: flex;
 flex-direction: column;
 align-items: flex-start;
 gap: 8px;
 align-self: stretch;
}

.lg_title {
 font-family: 'MTS Wide', sans-serif;
 font-size: 24px;
 font-style: normal;
 font-weight: 500;
 line-height: 28px;
 margin: 0;
 color: #fff;
 font-feature-settings: 'liga' off, 'clig' off;
 text-wrap: balance;
}

.lg_descr {
 font-family: 'MTS Compact', sans-serif;
 font-size: 18px;
 font-style: normal;
 font-weight: 400;
 line-height: normal;
 color: #ffffff99;
 margin: 0;
 text-wrap: balance;
}

.download_buttons {
 display: flex;
 align-items: center;
 gap: 8px;
 flex-wrap: wrap;
}

.KDS-Button {
 background-color: #ffffff26;
 border-radius: 12px;
 corner-shape: superellipse(1.35);
 padding: 6px 16px;
 font-family: 'MTS Compact', sans-serif;
 font-size: 17px;
 font-weight: 500;
 color: #fff;
 cursor: pointer;
 transition: background-color 0.2s;
 height: 32px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.KDS-Button:hover {
 background-color: #ffffff3f;
}

.KDS-Button.primary {
 background-color: #7b2cbf;
 padding: 14px 32px;
 height: auto;
 border-radius: 8px;
 font-size: 17px;
}

.KDS-Button.primary:hover {
 background-color: #6a1fa8;
}

.KDS-Button-155 {
 display: flex;
 height: 32px;
 min-height: 32px;
 max-height: 32px;
 padding: 6px 8px;
 justify-content: center;
 align-items: center;
 background-color: #ffffff26;
 border-radius: 12px;
 corner-shape: superellipse(1.35);
 border: none;
 cursor: pointer;
 transition: background-color 0.2s;
 font-family: 'MTS Compact', sans-serif;
 text-decoration: none !important;
 color: inherit;
}

.KDS-Button-155:hover {
 background-color: #ffffff3f;
 text-decoration: none !important;
}

.KDS-Button-155:hover .btn-text,
.KDS-Button-155 .btn-text {
 text-decoration: none !important;
}

.KDS-Button-155 .btn-icon {
 display: flex;
 justify-content: center;
 align-items: center;
 width: 16px;
 height: 16px;
 flex-shrink: 0;
}

.KDS-Button-155 .btn-icon img {
 width: 100%;
 height: 100%;
 object-fit: contain;
}

.KDS-Button-155 .btn-content {
 display: flex;
 padding: 2px 4px;
 align-items: flex-start;
}

.KDS-Button-155 .btn-text {
 overflow: hidden;
 color: var(--Text-Vladimir, #fff);
 text-align: center;
 font-feature-settings: 'liga' off, 'clig' off;
 text-overflow: ellipsis;
 font-family: "MTS Compact", sans-serif;
 font-size: 17px;
 font-style: normal;
 font-weight: 500;
 line-height: 20px;
 white-space: nowrap;
 text-wrap: balance;
}

.KDS-Button-15 {
 border-radius: 18px;
 corner-shape: superellipse(1.35);
 background: var(--Control-Rostov, #ffffff26);
 display: inline-flex;
 width: fit-content;
 height: 52px;
 min-height: 52px;
 max-height: 52px;
 padding: 14px 20px;
 justify-content: center;
 align-items: center;
 border: none;
 cursor: pointer;
 transition: background-color 0.2s;
 font-family: 'MTS Compact', sans-serif;
 text-decoration: none !important;
 color: inherit;
 margin: 0 6px 10px 0;
}

.KDS-Button-15:hover {
 background-color: #ffffff3f;
 text-decoration: none !important;
}

.KDS-Button-15:hover .btn-text,
.KDS-Button-15 .btn-text {
 text-decoration: none !important;
}

.KDS-Button-15 .btn-icon {
 display: flex;
 justify-content: center;
 align-items: center;
 width: 16px;
 height: 16px;
 flex-shrink: 0;
}

.KDS-Button-15 .btn-icon img {
 width: 100%;
 height: 100%;
 object-fit: contain;
}

.KDS-Button-15 .btn-content {
 display: flex;
 padding: 4px 8px;
 align-items: flex-start;
}

.KDS-Button-15 .btn-text {
 display: -webkit-box;
 min-width: 26px;
 max-width: 320px;
 -webkit-box-orient: vertical;
 -webkit-line-clamp: 1;
 line-clamp: 1;
 overflow: hidden;
 color: var(--Text-Vladimir, #fff);
 text-align: center;
 font-feature-settings: 'liga' off, 'clig' off;
 text-overflow: ellipsis;
 font-family: "MTS Compact", sans-serif;
 font-size: 17px;
 font-style: normal;
 font-weight: 500;
 line-height: 20px;
 text-wrap: balance;
}

.Icons_Grid {
 display: grid;
 grid-template-columns: repeat(3, minmax(280px, 1fr));
 gap: 32px;
 max-width: 100%;
}

.COMMON_BLOCK {
 margin-bottom: 40px;
 filter: blur(900px);
 transition: filter 0.6s ease-out;
 transform: translateZ(0);
 contain: layout style paint;
}

.COMMON_BLOCK.blur-visible {
 filter: blur(0px);
 will-change: auto;
}

.Download_all {
 background: var(--Background-Bratsk, #252525);
 border-radius: 18px;
 padding: 40px;
}

.Stickerpack {
 margin-bottom: 40px;
 background: var(--Background-Bratsk, #252525);
 border-radius: 18px;
 padding: 40px;
 filter: blur(900px);
 transition: filter 0.6s ease-out;
 transform: translateZ(0);
 contain: layout style paint;
}

.Stickerpack.blur-visible {
 filter: blur(0px);
 will-change: auto;
}

.Updates {
 margin-bottom: 40px;
 background: var(--Background-Bratsk, #252525);
 border-radius: 18px;
 padding: 40px;
 filter: blur(900px);
 transition: filter 0.6s ease-out;
 transform: translateZ(0);
 contain: layout style paint;
}

.Updates.blur-visible {
 filter: blur(0px);
 will-change: auto;
}

.Footer {
 text-align: center;
 padding: 40px 20px;
 color: #ffffff7f;
 font-family: 'MTS Compact', sans-serif;
 font-size: 14px;
 text-wrap: balance;
}

.Footer p {
 margin: 0;
 text-wrap: balance;
}

@media (max-width: 1440px) {
 .Logo_header .MAIN_LOGO {
 padding-left: 20px;
 }

 .Logo_header .KDS {
 padding-right: 20px;
 }

 .Content_Area {
 padding: 0 20px;
 }
}

@media (max-width: 1280px) {
 .Content_Area {
 gap: 20px;
 }
}

@media (max-width: 1100px) {
 .Logo_header .MAIN_LOGO {
 padding-left: 60px;
 }

 .Logo_header .KDS {
 padding-right: 60px;
 }

 .Content_Area {
 flex-direction: column;
 padding: 0 60px;
 }

 .Main_Menu_FIXED {
 position: static;
 width: 100%;
 flex-direction: row;
 flex-wrap: wrap;
 }

 .Main_Menu_FIXED .Menu_Item {
 flex: 1 1 auto;
 text-align: center;
 }

 .Main_logo_Block,
 .Main_Icons_Block {
 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 }

 .Main_Icons_Block .Icons {
 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 }

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

 .KION_App_Icon_Sq {
 width: 300px;
 max-width: 100%;
 }

 .KION_App_Icon_Rect {
 width: 463px;
 max-width: 100%;
 }

 .KION_Music_App_Icon {
 width: 300px;
 max-width: 100%;
 }

 .KION_Stroki_App_Icon {
 width: 300px;
 max-width: 100%;
 }

 .KION_App_Icon_Sq .KION_App_icon,
 .KION_Music_App_Icon .KION_App_icon,
 .KION_Stroki_App_Icon .KION_App_icon {
 max-width: min(250px, 100%);
 justify-content: center;
 }

 .KION_App_Icon_Rect .KION_App_icon {
 height: 250px;
 width: auto;
 max-width: 100%;
 border-radius: 14px;
 justify-content: center;
 }
}

@media (max-width: 768px) {
 body {
 padding-top: 100px;
 }

 .Logo_header {
 height: 100px;
 padding: 0;
 }

 .Logo_header .MAIN_LOGO {
 padding-left: 40px;
 }

 .Logo_header .KDS {
 padding-right: 40px;
 }

 .Content_Area {
 padding: 0 40px;
 }

 .Title_BIG h1,
 .Title_BIG h2 {
 font-size: 28px;
 line-height: 32px;
 }

 .Title_Middle h2 {
 font-size: 24px;
 line-height: 28px;
 }

 .Main_logo_Block,
 .Main_Icons_Block {
 grid-template-columns: 1fr;
 }

 .Main_Icons_Block .Icons {
 grid-template-columns: 1fr;
 }

 .Icons_Grid {
 grid-template-columns: 1fr;
 }

 .KION_App_Icon_Sq,
 .KION_App_Icon_Rect,
 .KION_Music_App_Icon,
 .KION_Stroki_App_Icon {
 width: 100%;
 max-width: 100%;
 padding: 16px;
 gap: 16px;
 }

 .KION_App_Icon_Sq .KION_App_icon,
 .KION_Music_App_Icon .KION_App_icon,
 .KION_Stroki_App_Icon .KION_App_icon {
 width: 100%;
 border-radius: 14px;
 justify-content: center;
 }

 .KION_App_Icon_Rect .KION_App_icon {
 width: 100%;
 max-width: 100%;
 height: auto;
 aspect-ratio: 416.667 / 250;
 border-radius: 14px;
 justify-content: center;
 }
}

@media (max-width: 480px) {
 body {
 padding-top: 80px;
 }

 .Logo_header {
 height: 80px;
 }

 .Logo_header .MAIN_LOGO {
 padding-left: 20px;
 }

 .Logo_header .KDS {
 display: none;
 }

 .burger-menu-button {
 display: flex;
 margin-right: 20px;
 }

 .mobile-menu-overlay {
 display: block;
 }

 .Main_Menu_FIXED {
 display: none;
 }

 .Content_Area {
 padding: 0 10px;
 }

 .Title_BIG h1,
 .Title_BIG h2 {
 font-size: 20px;
 line-height: 28px;
 }

 .Title_BIG p {
 font-size: 17px;
 line-height: 1.381;
 }

 .Title_Middle h2 {
 font-size: 20px;
 line-height: 24px;
 }

 .Title_Middle p {
 font-size: 17px;
 line-height: 1.381;
 }

 .Title_Small h3 {
 font-size: 20px;
 }

 .lg_title {
 font-size: 20px;
 }

 .lg_descr {
 font-size: 17px;
 line-height: 1.381;
 }

 .KION_BLOCK,
 .KION_MUSIC_BLOCK,
 .KION_STROKI_BLOCK,
 .ON_MEDIA_BLOCK {
 padding: 20px;
 gap: 20px;
 margin-bottom: 20px;
 }

 .Download_all,
 .Stickerpack,
 .Updates {
 padding: 20px;
 margin-bottom: 20px;
 }

 .KION_App_Icon_Sq {
 width: 275px;
 padding: 12px;
 gap: 12px;
 }

 .KION_Music_App_Icon,
 .KION_Stroki_App_Icon {
 width: 275px;
 padding: 12px;
 gap: 12px;
 }

 .KION_App_Icon_Rect {
 padding: 12px;
 gap: 12px;
 }

 .KION_App_Icon_Rect .KION_App_icon {
 height: auto !important;
 }

 .Logo_Block {
 padding: 16px;
 gap: 12px;
 }
}

.toast-notification {
 position: fixed;
 bottom: 40px;
 left: 50%;
 transform: translateX(-50%) translateY(100px);
 background-color: #fffffff2;
 color: #000;
 padding: 16px 24px;
 border-radius: 12px;
 font-family: 'MTS Compact', sans-serif;
 font-size: 16px;
 font-weight: 500;
 z-index: 10001;
 opacity: 0;
 transition: opacity 0.3s ease-out, transform 0.3s ease-out;
 box-shadow: 0 4px 16px #0000004c;
 pointer-events: none;
 white-space: nowrap;
}

.toast-notification.toast-show {
 opacity: 1;
 transform: translateX(-50%) translateY(0);
}

.toast-notification.toast-error {
 background-color: #e7012bf2;
 color: #fff;
}
