:root {--breakpoint-md: 992px; --breakpoint-sm: 768px; --breakpoint-xs: 576px;}

@media (max-width: 1200px) {
.container, .container-small {padding: 0 20px;}
.trading__two-columns {flex-direction: column;}
.trading__trade {width: 100%;}
.trading__orderbook {order: 2; padding: 30px 24px 40px;}
.trading__orderbook-table thead tr,
.trading__orderbook-table .s-table__tr:not(.s-table__tr-center) {grid-template-columns: minmax(0, 1fr) 11ch 11ch;}
.trading__orderbook-table thead th {padding: 8px 10px; font-size: 13px;}
.trading__orderbook-table tbody td {padding: 2px 10px; font-size: 12px;}
.trading__orderbook-table tbody .s-table__tr-center td {padding: 8px; font-size: 16px;}
.hero {flex-direction: column; text-align: center;}
.hero__feat-list {align-items: center; width: 100%;}
.hero__feat-item {width: 100%; max-width: 280px;}
.why__grid {grid-template-columns: 1fr; gap: 20px;}
.why__item--img {display: none;}
.why__item:nth-child(1), .why__item:nth-child(2), .why__item:nth-child(4), .why__item:nth-child(5) {grid-column: 1 / 2; grid-row: auto;}
.instruments__grid {grid-template-columns: 1fr;}
.instruments__item--img {display: none;}
.instruments__item {grid-column: 1 / 2 !important; grid-row: auto !important;}
.tech__wrap {flex-direction: column;}
.join__wrap {flex-direction: column; border-radius: 30px; text-align: center;}
.steps__wrap {flex-direction: column;}
.steps__main {width: 100%; text-align: center; padding: 40px 20px;}
.steps__main .icon-logo {position: static; margin-top: 20px;}
.steps__grid {grid-template-columns: 1fr;}
.trust2__grid {grid-template-columns: repeat(2, 1fr);}
.footer__row {flex-wrap: wrap; gap: 40px;}
.footer__col:first-child {max-width: 100%;}
.tickets__wrap {flex-direction: column;}
.tickets__wrap > .col-menu {max-width: 100%; margin-bottom: 20px;}
.tickets__active {padding: 20px;}
.currencies__head, .currencies__table {padding: 24px 20px;}
.currencies__head h1 {font-size: 32px;}
.currencies__head p {font-size: 16px;}
.currencies__table .custom-table thead th {padding: 0 8px; font-size: 15px;}
.currencies__table .custom-table thead th:first-child {border-radius: 20px 0 0 20px;}
.currencies__table .custom-table thead th:last-child {border-radius: 0 20px 20px 0;}
.currencies__table .custom-table tbody td {padding: 0 8px; font-size: 14px;}
.currencies__table-logo {width: 28px; height: 28px;}
}

@media (max-width: 992px) {
body {font-size: 14px;}
h1 {font-size: 32px;}
h2 {font-size: 24px;}
.section {padding: 30px 0;}
.section-title h2 {font-size: 32px;}
.section-top {padding: 30px;}
.header__row {gap: 10px;}
.header__title img {height: 28px;}
.header__profile {width: auto; padding: 5px 10px;}
.header__profile.active .header__profile-img {width: 30px; height: 30px;}
.col-menu {max-width: 100%; margin-bottom: 20px;}
.sProfile__wrap {flex-direction: column;}
.sAuth__wrap {flex-direction: column;}
.sAuth__bg, .sAuth__main {max-width: 100%;}
.sAuth__bg {padding: 40px !important; background-position: center;}
.hero__info-title h1 {font-size: 40px;}
.hero__info-subtitle {font-size: 18px;}
.trust__wrap {flex-direction: column;}
.trust__info {width: 100%;}
.faq-home__wrap {flex-direction: column;}
.faq-home__info {width: 100%; text-align: center;}
.faq-home:before {width: 100%; left: 0; top: 0; opacity: 0.3;}
.team-slide {padding: 20px;}
.currencies__head, .currencies__table {padding: 20px 16px;}
.currencies__table .custom-table thead th {padding: 0 6px; font-size: 13px;}
.currencies__table .custom-table tbody td {padding: 0 6px; font-size: 13px;}
.currencies__table-logo {width: 26px; height: 26px;}
.docs__content, .help__top, .api__head {padding: 30px 20px;}
.commisions {flex-direction: column;}
.main-menu__wrap {min-width: 300px; padding: 100px 20px 40px 30px;}
.trading__pair-current {grid-template-columns: 1fr; gap: 15px;}
.trading__pair-values {flex-wrap: wrap; gap: 15px;}
.trading__pairs-dropdown-inner {max-height: 300px;}
.referrals-page__box {padding: 30px 20px;}
.referrals-box__balance {grid-template-columns: 1fr;}
.referrals-box__invite {flex-direction: column; align-items: stretch;}
.settings-box {padding: 25px;}
}

@media (max-width: 768px) {
.trading__pairs-dropdown {left: 50%; width: 100vw; min-width: unset; transform: translateX(-50%); border-radius: 0 0 var(--border-30) var(--border-30);}
.trading__pairs-dropdown-inner {overflow-x: auto; -webkit-overflow-scrolling: touch;}
.trading__pairs-table {width: max-content; min-width: 100%; table-layout: auto;}
.trading__pairs-table th:first-child,
.trading__pairs-cell {width: 1%; max-width: 38vw;}
.trading__pairs-info {min-width: 0; max-width: 100%;}
.trading__pairs-info span {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; flex: 1;}
.trading__pairs-table th:nth-child(2),
.trading__pairs-price {width: auto; white-space: nowrap; padding-right: 12px;}
.trading__pairs-table th:nth-child(3),
.trading__pairs-change {width: 1%; white-space: nowrap; text-align: right;}
.container, .container-small {padding: 0 15px;}
.header {padding: 15px 0;}
.header__title img {height: 20px;}
.header__actions {gap: 10px;}
.header__profile {width: 40px; height: 40px; padding: 0; justify-content: center;}
.header__profile.active {min-width: 40px;}
.header__profile .header__profile-img {width: 30px; height: 30px;}
.header__profile span:not(.header__profile-img) {display: none;}
.header__burger {width: 40px; height: 40px; min-width: 40px; min-height: 40px;}
.header__btn {width: 30px; height: 30px;}
.section-top {padding: 20px; border-radius: 20px;}
.btn {padding: 8px 16px; font-size: 14px;}
.modal--2fa {padding: 30px 20px;}
.g2fa-progress {gap: 20px;}
.g2fa-step__wrap {flex-direction: column; align-items: center;}
.g2fa-step__text {padding: 20px;}
.tickets__message-content {width: 100%;}
.tickets__closed-item {padding: 15px;}
.tickets__closed-info {flex-direction: column; align-items: flex-start; gap: 10px;}
.balance-menu {padding: 20px;}
.balance-menu__list {flex-wrap: wrap; gap: 20px;}
.balance-table {padding: 20px;}
.currencies__head, .currencies__table {padding: 16px 12px;}
.currencies__head h1 {font-size: 28px;}
.currencies__head p {font-size: 14px;}
.currencies__table .custom-table thead th {padding: 0 4px; font-size: 11px; border-radius: 0;}
.currencies__table .custom-table thead th:first-child {border-radius: 14px 0 0 14px;}
.currencies__table .custom-table thead th:last-child {border-radius: 0 14px 14px 0;}
.currencies__table .custom-table tbody td {padding: 0 4px; font-size: 11px;}
.currencies__table-logo {width: 24px; height: 24px;}
.custom-table thead th, .custom-table tbody td {padding: 12px 15px; font-size: 14px;}
.notifications__tabs {grid-template-columns: 1fr;}
.notification__tab {padding: 15px 0;}
.notifications-item {padding: 15px;}
.notification-item__bottom {flex-direction: column; gap: 10px;}
.hero--home {padding: 30px 0; margin-bottom: 30px;}
.hero__info-btn {padding: 12px 24px; font-size: 16px;}
.why__grid--2, .help__grid, .trust2__grid {grid-template-columns: 1fr;}
.steps__btn, .join__btn {width: 100%; justify-content: center;}
.join__bar {flex-wrap: wrap; justify-content: center; text-align: center;}
.footer {padding-top: 50px;}
.footer__row {flex-direction: column; gap: 30px; padding-bottom: 50px;}
.footer__col:first-child {max-width: 100%;}
}

@media (max-width: 576px) {
h1 {font-size: 28px;}
h2 {font-size: 22px;}
.section-title h2 {font-size: 28px;}
.header__actions {gap: 8px;}
.header__btns {gap: 6px;}
.header__title img {height: 18px;}
.header__profile {width: 36px; height: 36px;}
.hero__info-title h1 {font-size: 32px;}
.hero__feat-item {padding: 20px;}
.trust2-item__title {font-size: 48px;}
.modal__btns {flex-direction: column; align-items: center;}
#modal-create-ticket .modal__btns,
#modal-close-ticket .modal__btns {flex-direction: row; align-items: stretch; width: 100%;}
#modal-create-ticket .modal__btn,
#modal-close-ticket .modal__btn {flex: 1; min-width: 0;}
.form-group {flex-direction: column; align-items: stretch; gap: 10px;}
.trading__orderbook {padding: 20px;}
.trading__history {padding: 20px;}
.trading__history-table {padding-right: 0;}
.commisions__col {padding: 20px;}
.commisions__table-group {gap: 10px;}
.currencies__head, .currencies__table {padding: 12px 10px;}
.currencies__table .custom-table thead th {padding: 0 3px; font-size: 10px;}
.currencies__table .custom-table thead th:first-child {border-radius: 10px 0 0 10px;}
.currencies__table .custom-table thead th:last-child {border-radius: 0 10px 10px 0;}
.currencies__table .custom-table tbody td {padding: 0 3px; font-size: 10px;}
.currencies__table-logo {width: 22px; height: 22px;}
.table-buttons {flex-direction: column; gap: 10px;}
}

.currencies__table .custom-table th:nth-child(5),
.currencies__table .custom-table td:nth-child(5) {padding-right: 20px;}

@media (max-width: 450px) {
.currencies__table .custom-table thead th,
.currencies__table .custom-table thead th:nth-child(2),
.currencies__table .custom-table thead th:nth-child(5) {height: auto; min-height: 60px; padding-top: 23px; padding-bottom: 23px; white-space: normal; word-break: break-word; overflow: visible; text-overflow: unset;}
}

@media (max-width: 410px) {
.currencies__table .custom-table thead tr,
.currencies__table .custom-table tbody tr {height: 50px;}
.currencies__table .custom-table thead th,
.currencies__table .custom-table thead th:nth-child(2),
.currencies__table .custom-table thead th:nth-child(5) {height: auto; min-height: 50px; padding-top: 18px; padding-bottom: 18px;}
.currencies__table .custom-table tbody td {height: 50px; min-height: 50px;}
}