/* Tablet and small desktop adaptations */
@media (max-width: 1360px) and (min-width: 1101px) {
  .hero-banner {
    padding-right: 40px;
    padding-bottom: 188px;
  }

  .hero-banner__visual {
    right: 58px;
    width: 540px;
  }

  .hero-banner__image {
    width: 410px;
  }

  .hero-banner__chip {
    right: 36px;
  }

  .hero-features {
    right: 132px;
    width: min(700px, calc(100% - 250px));
  }

  .hero-scene {
    inset: 46px 40px 188px 40px;
  }

  .hero-orbit--insurance {
    bottom: 108px;
    left: 6px;
  }

  .hero-orbit--specialization {
    right: 56px;
    bottom: 92px;
  }
}

@media (max-width: 1100px) {
  .top-bar__inner {
    grid-template-columns: 1fr;
    row-gap: 8px;
    padding: 8px 0;
  }

  .top-bar__list,
  .top-bar__actions {
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px 14px;
  }

  .main-header__inner {
    grid-template-columns: 1fr;
    row-gap: 16px;
    padding: 20px 0;
    justify-items: center;
  }

  .main-header__list,
  .main-header__tools {
    flex-wrap: wrap;
    justify-content: center;
  }

  .menu-dropdown {
    top: calc(100% + 10px);
    left: 50%;
    transform: translate(-50%, 10px);
  }

  .menu-item--has-dropdown:hover > .menu-dropdown,
  .menu-item--has-dropdown:focus-within > .menu-dropdown,
  .menu-item--has-dropdown.is-open > .menu-dropdown {
    transform: translate(-50%, 0);
  }

  .hero-banner {
    height: auto;
    min-height: auto;
    padding: 40px 32px 32px;
  }

  .hero-banner__content {
    max-width: 100%;
  }

  .hero-banner__content.is-hidden,
  .hero-banner__stats.is-hidden,
  .hero-features.is-hidden {
    display: none;
  }

  .hero-brand {
    margin-bottom: 34px;
  }

  .hero-banner__visual,
  .hero-banner__stats,
  .hero-features {
    position: relative;
    inset: auto;
    right: auto;
    left: auto;
    bottom: auto;
    top: auto;
    width: 100%;
    max-width: 100%;
  }

  .hero-banner__visual {
    height: auto;
    margin-top: 28px;
  }

  .hero-orbits {
    position: relative;
    height: 0;
  }

  .hero-orbit {
    width: 54px;
    height: 54px;
  }

  .hero-orbit--stability {
    top: -286px;
    left: 28px;
  }

  .hero-orbit--ved {
    top: -286px;
    right: 28px;
  }

  .hero-orbit--insurance {
    bottom: 188px;
    left: 18px;
  }

  .hero-orbit--specialization {
    right: 22px;
    bottom: 188px;
  }

  .hero-banner__image {
    position: relative;
    top: auto;
    right: auto;
    display: block;
    width: min(100%, 532px);
    margin: 0 auto;
  }

  .hero-banner__3d {
    position: relative;
    min-height: 320px;
  }

  .hero-banner__chip {
    top: auto;
    right: auto;
    bottom: 28px;
    width: 84px;
  }

  .hero-banner__stats {
    gap: 32px;
    margin-top: 32px;
  }

  .hero-features {
    grid-template-columns: repeat(2, 1fr);
    margin-top: 32px;
    border-radius: 22px;
  }

  .hero-features.is-hidden {
    display: none;
  }

  .hero-scenes {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: 100%;
    margin-top: 32px;
    padding: 0;
    min-height: 0;
  }

  .hero-scenes:not(.is-active) {
    display: none;
  }

  .hero-scene {
    position: relative;
    inset: auto;
  }

  .hero-scene__content {
    max-width: 100%;
  }

  .hero-scene__content h2 {
    font-size: 30px;
  }

  .hero-scene__content p {
    max-width: 100%;
  }

  .hero-scene__actions {
    gap: 10px;
  }

  .hero-feature:nth-child(2) {
    border-right: 0;
  }

  .hero-feature:nth-child(-n + 2) {
    border-bottom: 1px solid #dddddd;
  }

  .quick-links__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px 14px;
  }

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

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

  .services__content {
    gap: 20px;
  }

  .services-promo {
    min-height: 360px;
  }

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

  .application-visual,
  .application-form-card {
    min-height: auto;
  }

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

  .site-footer__top {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .site-footer__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .currency-calculator,
  .currency-board {
    grid-template-columns: 1fr;
  }

  .currency-calculator__divider {
    display: none;
  }

  .currency-board {
    gap: 18px;
  }

  .currency-calculator__rates {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile layout */
@media (max-width: 768px) {
  :root {
    --container-padding: 16px;
  }

  .top-bar {
    min-height: auto;
  }

  .top-bar__nav a,
  .top-bar__link,
  .top-bar__icon-button,
  .top-bar__lang {
    font-size: 10px;
  }

  .top-bar__list {
    gap: 18px;
  }

  .top-bar__separator {
    display: none;
  }

  .main-header__list {
    gap: 16px 22px;
    justify-content: center;
  }

  .main-header__nav a {
    font-size: 13px;
  }

  .top-bar__list,
  .main-header__list {
    width: 100%;
  }

  .top-bar__list > li,
  .main-header__list > li {
    width: 100%;
    text-align: center;
  }

  .menu-item--has-dropdown > a {
    justify-content: center;
  }

  .menu-dropdown,
  .menu-dropdown--wide {
    position: static;
    width: 100%;
    min-width: 0;
    margin-top: 10px;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    display: none;
    box-shadow: none;
  }

  .menu-subdropdown {
    position: static;
    width: 100%;
    margin-top: 8px;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    display: none;
    box-shadow: none;
  }

  .menu-dropdown::before,
  .menu-dropdown::after,
  .menu-subdropdown::before {
    display: none;
  }

  .menu-item--has-dropdown:hover > .menu-dropdown,
  .menu-item--has-dropdown:focus-within > .menu-dropdown,
  .menu-item--has-dropdown.is-open > .menu-dropdown {
    display: grid;
    transform: none;
  }

  .menu-dropdown__item--has-children:hover > .menu-subdropdown,
  .menu-dropdown__item--has-children:focus-within > .menu-subdropdown,
  .menu-dropdown__item--has-children.is-open > .menu-subdropdown {
    display: grid;
  }

  .main-header__tools {
    width: 100%;
    flex-direction: column;
  }

  .main-header__search,
  .main-header__button {
    width: 100%;
  }

  .hero-stage {
    padding-top: 16px;
  }

  .hero-banner {
    padding: 28px 20px 20px;
    border-radius: 18px;
  }

  .hero-brand {
    margin-bottom: 24px;
  }

  .hero-brand img {
    width: 208px;
    height: auto;
  }

  .hero-banner__text h1 {
    font-size: 42px;
  }

  .hero-banner__text p {
    font-size: 15px;
    line-height: 1.55;
  }

  .hero-button {
    min-width: 0;
    width: 100%;
  }

  .hero-banner__actions {
    display: grid;
  }

  .hero-banner__stats {
    flex-direction: column;
    gap: 18px;
  }

  .hero-features {
    grid-template-columns: 1fr;
    padding: 10px 0;
  }

  .hero-feature {
    padding: 16px 18px;
  }

  .hero-feature:not(:last-child),
  .hero-feature:nth-child(2),
  .hero-feature:nth-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid #dddddd;
  }

  .quick-links {
    padding-top: 40px;
  }

  .quick-links__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 48px 12px;
  }

  .services {
    padding-top: 40px;
  }

  .application {
    padding-top: 40px;
  }

  .currency-section {
    padding-top: 40px;
  }

  .updates {
    padding-top: 40px;
  }

  .branches {
    padding-top: 40px;
  }

  .investment-coins {
    margin-top: 40px;
  }

  .services__header {
    align-items: flex-start;
    flex-direction: column;
    margin-bottom: 16px;
  }

  .services__header h2 {
    font-size: 32px;
  }

  .service-card {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .service-card__image {
    justify-self: center;
  }

  .services__more-button {
    width: 100%;
  }

  .application-form-card {
    padding: 18px 16px;
  }

  .application-form-card__tabs {
    margin-bottom: 22px;
  }

  .application-form h2 {
    font-size: 22px;
  }

  .currency-calculator {
    gap: 20px;
    padding: 18px 16px;
  }

  .currency-calculator__rates {
    grid-template-columns: 1fr;
  }

  .currency-board__main,
  .currency-benefits {
    padding: 18px 16px;
  }

  .app-promo {
    grid-template-columns: 1fr;
    padding: 22px 18px 0;
  }

  .app-promo__stores {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-promo__visual {
    position: relative;
    right: auto;
    bottom: auto;
    width: min(100%, 220px);
    margin: 20px auto 0;
  }

  .news-card {
    padding: 22px 18px;
  }

  .news-card__header {
    flex-direction: column;
    margin-bottom: 20px;
  }

  .branches__surface {
    min-height: auto;
  }

  .branches__panel {
    grid-template-columns: 1fr;
    padding: 22px 18px 0;
  }

  .branches__menu {
    padding-top: 0;
  }

  .branches__map {
    position: relative;
    inset: auto;
    height: 300px;
    margin-top: 22px;
    border-radius: 0 0 28px 28px;
  }

  .investment-coins__header {
    flex-direction: column;
    align-items: flex-start;
    padding-left: 0;
  }

  .investment-coins__slider {
    grid-template-columns: 1fr;
  }

  .investment-coins__arrow {
    display: none;
  }

  .investment-coins__track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .site-footer {
    padding-top: 34px;
  }

  .floating-actions {
    right: 16px;
    bottom: 16px;
  }

  .floating-actions__top {
    left: 16px;
    bottom: 16px;
  }

  .floating-chat {
    width: min(300px, calc(100vw - 32px));
  }

  .floating-chat__card {
    width: min(300px, calc(100vw - 32px));
    height: 420px;
  }

  .account-modal {
    padding: 16px;
  }

  .account-modal__dialog {
    grid-template-columns: 1fr;
    width: min(720px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
  }

  .account-modal__side {
    padding: 24px 20px 0;
  }

  .account-modal__side-title,
  .account-modal__side-note,
  .account-modal__download {
    max-width: none;
  }

  .account-modal__side-image {
    width: min(100%, 240px);
    margin: 12px auto -8px;
  }

  .account-modal__content {
    padding: 24px 20px;
  }

  .account-modal__title {
    font-size: 28px;
  }

  .currency-board__tabs {
    gap: 8px;
  }

  .currency-table__head,
  .currency-table__row {
    grid-template-columns: minmax(0, 1.2fr) 0.9fr 0.9fr;
  }
}

/* Narrow mobile screens */
@media (max-width: 480px) {
  .top-bar__inner {
    row-gap: 6px;
    padding: 6px 0;
  }

  .top-bar__list,
  .top-bar__actions {
    gap: 8px 12px;
  }

  .quick-links__grid {
    grid-template-columns: 1fr;
  }

  .app-promo__stores {
    grid-template-columns: 1fr;
  }

  .investment-coins__track,
  .site-footer__nav {
    grid-template-columns: 1fr;
  }

  .floating-actions__contact span:last-child {
    display: none;
  }

  .floating-actions__contact {
    width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 8px;
    justify-content: center;
  }

  .floating-chat {
    width: min(280px, calc(100vw - 32px));
  }

  .floating-chat__card {
    width: min(280px, calc(100vw - 32px));
    height: 400px;
  }

  .floating-chat__form {
    grid-template-columns: 1fr;
  }

  .account-modal__row {
    grid-template-columns: 1fr;
  }

  .account-modal__submit {
    width: 100%;
    min-width: 0;
  }

  .account-modal__consent {
    grid-template-columns: 16px 16px minmax(0, 1fr);
    gap: 8px;
  }

  .account-modal__upload {
    padding-right: 16px;
  }

  .account-modal__upload::after {
    display: none;
  }

  .account-modal__upload-text,
  .account-modal__consent span:last-child {
    width: 100%;
    white-space: normal;
  }
}