/**
 * Mobile layout fixes — loaded after home.css.
 * Restores JustLend mobile behavior: marquee bands + vertical stacks where needed.
 */

@media screen and (max-width: 1024px) {
  html,
  body {
    overflow-x: hidden;
    max-width: 100vw;
  }

  body {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  #root,
  #root .main,
  #root .homepage {
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  #root .main {
    overflow-x: clip;
  }

  #root .footer-v3 .links-part-wrapper .links-part {
    min-width: 0 !important;
  }
}

@media screen and (max-width: 768px) {
  /* ── Global ── */
  body.mobile-menu-open {
    overflow: hidden;
    position: fixed;
    width: 100%;
  }

  #root {
    touch-action: manipulation;
    overflow-x: hidden;
  }

  #root .homepage {
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    padding-right: max(16px, env(safe-area-inset-right, 0px));
    overflow-x: hidden;
  }

  #root .homepage * {
    box-sizing: border-box;
  }

  #root .homepage section {
    max-width: 100%;
    overflow-x: hidden;
  }

  #root .adaptive {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* ── Header / mobile menu ── */
  #root .homepage > header.header-v3.adaptive {
    --header-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --header-pad-r: max(16px, env(safe-area-inset-right, 0px));
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin-left: calc(-1 * var(--header-pad-l)) !important;
    margin-right: calc(-1 * var(--header-pad-r)) !important;
    padding-left: var(--header-pad-l) !important;
    padding-right: var(--header-pad-r) !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  #root header.header-v3 .header-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 20px 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    justify-content: flex-start !important;
    gap: 12px;
    overflow: visible !important;
  }

  #root header.header-v3 .header-content > .navi-v3.desktop-navi,
  #root header.header-v3 .header-content > .launch-item {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
  }

  #root header.header-v3 .header-content > .app-logo {
    flex: 0 1 auto;
    min-width: 0;
    max-width: calc(100% - 48px);
  }

  #root header.header-v3 .header-content > .app-logo img {
    max-width: 100%;
    height: auto;
  }

  #root header.header-v3 .header-content > .header-burger-btn {
    display: block !important;
    flex: 0 0 18px;
    width: 18px !important;
    height: 18px !important;
    position: fixed !important;
    top: max(24px, calc(env(safe-area-inset-top, 0px) + 12px)) !important;
    right: max(16px, env(safe-area-inset-right, 0px)) !important;
    left: auto !important;
    margin: 0 !important;
    z-index: 10002;
  }

  #root header.header-v3 .mobile-navi {
    position: fixed;
    inset: 0;
    z-index: 10001;
    display: none !important;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
  }

  #root header.header-v3.menu-open .mobile-navi {
    display: block !important;
    opacity: 1;
    pointer-events: auto;
  }

  #root header.header-v3 .mobile-navi .mobile-navi-content {
    -webkit-overflow-scrolling: touch;
  }

  #root header.header-v3 .mobile-navi .mobile-navi-header .header-burger-btn {
    display: none !important;
  }

  #root header.header-v3 .mobile-navi .mobile-navi-header {
    justify-content: flex-start !important;
  }

  #root header.header-v3 .mobile-navi .mobile-navi-footer {
    display: none !important;
  }

  /* ── Hero ── */
  #root .homepage > section.just-lending.adaptive {
    --hero-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --hero-pad-r: max(16px, env(safe-area-inset-right, 0px));
    width: calc(100% + var(--hero-pad-l) + var(--hero-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--hero-pad-l));
    margin-right: calc(-1 * var(--hero-pad-r));
  }

  #root .just-lending {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100svh;
    height: 100dvh;
    min-height: 100svh;
    min-height: 100dvh;
  }

  #root .just-lending .video-wrap {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0;
    pointer-events: none;
  }

  #root .just-lending .video-wrap .bg_video {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  #root .just-lending .banner-bg {
    position: absolute !important;
    inset: 0 !important;
    z-index: 3;
    display: flex !important; /* overrides home.css inline-block */
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    box-sizing: border-box;
    padding: max(72px, calc(env(safe-area-inset-top, 0px) + 56px)) 20px max(72px, env(safe-area-inset-bottom, 0px)) !important;
    text-align: center !important;
    background-position: center center !important;
    background-size: cover !important;
  }

  #root .just-lending .banner-bg .banner-title,
  #root .just-lending .banner-bg .banner-title2 {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    font-size: 36px !important;
    line-height: 1.15 !important;
    text-align: center !important;
    align-self: center !important;
    background: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    -webkit-text-fill-color: #fff !important;
    color: #fff !important;
  }

  #root .just-lending .banner-bg .banner-desc {
    width: 100% !important;
    max-width: min(22em, 100%) !important;
    margin: 0 auto !important;
    padding: 16px 0 0 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    text-align: center !important;
    align-self: center !important;
    color: #9aa3bc !important;
  }

  #root .just-lending .mt-30.banner-tab,
  #root .just-lending .banner-bg .launch-app-btn {
    margin-top: 30px !important;
    margin-bottom: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    align-self: center !important;
  }

  #root .just-lending .hide-mobile {
    display: none !important;
  }

  /* Data cards: hidden on mobile; kill desktop spacer */
  #root .just-lending .banner-bg .data-cards {
    display: none !important;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    margin: 0 !important;
    flex-wrap: nowrap !important;
  }

  #root .just-lending .banner-bg .data-cards .data-cards-a,
  #root .just-lending .banner-bg .data-cards .data-cards-b {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    width: max-content;
    animation-play-state: running !important;
  }

  #root .just-lending .banner-bg .data-cards .data-card {
    flex-shrink: 0;
    min-width: 200px;
  }

  /* ── Section titles ── */
  #root .growing-ecosystem .section-title,
  #root .growing-ecosystem #title-desc,
  #root .autonomous-community .section-title,
  #root .autonomous-community > .title-desc,
  #root .partners .section-title,
  #root .partners .title-desc {
    text-align: center;
  }

  /* ── Growing Ecosystem: vertical card column on mobile ── */
  #root .homepage > section.growing-ecosystem.adaptive {
    --eco-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --eco-pad-r: max(16px, env(safe-area-inset-right, 0px));
    width: calc(100% + var(--eco-pad-l) + var(--eco-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--eco-pad-l));
    margin-right: calc(-1 * var(--eco-pad-r));
    margin-top: 80px !important;
    padding: 0 20px 48px !important;
    box-sizing: border-box;
    overflow: hidden;
    background: #0b0e1a;
  }

  #root .growing-ecosystem .vertical-growing-line-warper {
    display: none !important;
  }

  #root .growing-ecosystem > .animate__animated {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #root .growing-ecosystem .section-title {
    font-size: 24px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
    padding: 0 8px !important;
  }

  #root .growing-ecosystem .section-title .section-number,
  #root .growing-ecosystem .section-title .white-circle-1 {
    display: none !important;
  }

  #root .growing-ecosystem .title-desc#title-desc {
    margin: 12px auto 0 !important;
    padding: 0 12px !important;
    max-width: 22em;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    color: #9aa3bc !important;
  }

  #root .growing-ecosystem .eco-cards {
    transform: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 32px !important;
    padding: 0 !important;
    overflow: visible !important;
    list-style: none;
  }

  #root .growing-ecosystem .eco-cards-a {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 20px !important;
    width: 100% !important;
    transform: none !important;
    animation: none !important;
  }

  #root .growing-ecosystem .eco-cards-b {
    display: none !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card {
    width: 100% !important;
    max-width: 316px !important;
    min-height: 394px !important;
    margin: 0 !important;
    padding: 32px 20px 88px !important;
    box-sizing: border-box;
    text-align: left !important;
    position: relative;
    flex-shrink: 0;
  }

  #root .growing-ecosystem .eco-cards .eco-card:last-child {
    display: none !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card:not(:has(.eco-card-btn)) {
    padding-bottom: 32px !important;
    min-height: auto !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card:has(.eco-card-btn2) {
    padding-bottom: 120px !important;
  }

  #root .growing-ecosystem .eco-cards .eco-icons {
    width: 100% !important;
    max-width: 268px !important;
    height: 128px !important;
    margin: 0 auto !important;
    border-radius: 24px !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-title {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    padding-top: 24px !important;
    font-size: 18px !important;
    line-height: 1.5 !important;
    text-align: left !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-title.center {
    justify-content: center !important;
    text-align: center !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-desc,
  #root .growing-ecosystem .eco-cards .eco-card-desc2 {
    max-width: 100% !important;
    text-align: left !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-desc2 {
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin-top: 8px !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card .partner-text {
    top: 16px !important;
    left: 20px !important;
    right: auto !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: absolute !important;
    bottom: 24px !important;
    left: 20px !important;
    right: auto !important;
    min-width: 140px !important;
    height: 36px !important;
    font-size: 14px !important;
    margin: 0 !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card:has(.eco-card-btn2) .eco-card-btn {
    bottom: 64px !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card-btn2 {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: absolute !important;
    bottom: 24px !important;
    left: 20px !important;
    right: auto !important;
    margin: 0 !important;
    font-size: 12px !important;
    white-space: nowrap;
  }

  #root .growing-ecosystem .pointer-down {
    display: none !important;
  }

  /* ── JST ── */
  #root .homepage > section.jst.adaptive {
    --jst-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --jst-pad-r: max(16px, env(safe-area-inset-right, 0px));
    width: calc(100% + var(--jst-pad-l) + var(--jst-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--jst-pad-l));
    margin-right: calc(-1 * var(--jst-pad-r));
    margin-top: 50px !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
  }

  #root .jst .jst-bg-token-1,
  #root .jst .jst-bg-token-3 {
    display: none !important;
  }

  #root .jst .jst-bg-token-2 {
    width: 110px !important;
    height: 115px !important;
    right: -10px !important;
    top: 8% !important;
    left: auto !important;
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
  }

  #root .jst .left-right-container2 {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 28px !important;
    padding: 36px 20px 48px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    background: none !important;
    position: relative;
    z-index: 1;
    box-sizing: border-box;
  }

  #root .jst .left-part,
  #root .jst .right-part {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    text-align: left !important;
  }

  #root .jst .title-line {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    text-align: left !important;
  }

  #root .jst .title-line .title-icon {
    width: 32px !important;
    height: 33px !important;
    margin-right: 0 !important;
    flex-shrink: 0;
    background-image: url(res/r0047.svg) !important;
    background-size: contain !important;
  }

  #root .jst .title-line .title {
    font-size: 26px !important;
    line-height: 1.2 !important;
    text-align: left !important;
  }

  #root .jst .title-line .title2 {
    font-size: 14px !important;
    line-height: 1.4 !important;
    margin-top: 4px;
    text-align: left !important;
    color: #9aa3bc !important;
  }

  #root .jst .desc {
    margin-top: 16px !important;
    margin-bottom: 20px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: left !important;
    color: #9aa3bc !important;
  }

  #root .jst .ant-divider {
    margin: 20px 0 !important;
    width: 100% !important;
  }

  #root .jst .flex.flex-wrap {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 12px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  #root .jst .stats-container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    text-align: left !important;
    min-width: 0 !important;
  }

  #root .jst .val-container {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px 8px !important;
    margin-bottom: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #root .jst .val-container .val {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  #root .jst .val-container .pct {
    font-size: 12px !important;
    line-height: 1 !important;
    padding: 4px 8px !important;
    flex-shrink: 0;
  }

  #root .jst .stats-container .text {
    font-size: 12px !important;
    line-height: 1.3 !important;
    color: #9aa3bc !important;
  }

  #root .jst .jst-btns {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 16px !important;
    margin-top: 24px !important;
  }

  #root .jst .jst-btns .link {
    font-size: 14px !important;
    white-space: nowrap;
  }

  #root .jst .right-part {
    display: flex !important;
    width: 100% !important;
  }

  #root .jst-blocks {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #root .jst-block {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding: 16px 20px !important;
    box-sizing: border-box;
    text-align: left !important;
  }

  #root .jst-block .jst-title {
    font-size: 14px !important;
    line-height: 1.4 !important;
    padding-right: 28px;
  }

  #root .jst-block .jst-desc {
    font-size: 12px !important;
    line-height: 1.5 !important;
    margin-top: 8px !important;
  }

  #root .jst-block .white-arrow {
    right: 0 !important;
    top: 5px !important;
  }

  /* ── Community ── */
  #root .homepage > section.autonomous-community.adaptive {
    --comm-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --comm-pad-r: max(16px, env(safe-area-inset-right, 0px));
    width: calc(100% + var(--comm-pad-l) + var(--comm-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--comm-pad-l));
    margin-right: calc(-1 * var(--comm-pad-r));
    margin-top: 80px !important;
    padding: 0 20px 48px !important;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
  }

  #root .autonomous-community .vertical-growing-line-warper {
    display: none !important;
  }

  #root .autonomous-community .section-title {
    font-size: 24px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
    padding: 0 8px !important;
  }

  #root .autonomous-community .section-title .section-number,
  #root .autonomous-community .section-title .white-circle-2 {
    display: none !important;
  }

  #root .autonomous-community .title-desc {
    text-align: center !important;
    padding: 0 12px !important;
    margin: 12px auto 0 !important;
    max-width: 22em;
    font-size: 14px !important;
    line-height: 1.5 !important;
    color: #9aa3bc !important;
  }

  #root .autonomous-community .title-desc .launch-app-btn {
    margin: 16px auto 0 !important;
  }

  #root .autonomous-community .dynamic-bg,
  #root .autonomous-community .video-wrap.dynamic-bg {
    display: none !important;
  }

  #root .autonomous-community .static-bg {
    display: block !important;
    width: 100% !important;
    overflow: hidden !important;
    margin: 24px 0 0 !important;
  }

  #root .autonomous-community .static-bg .bg {
    width: 100% !important;
    min-height: 200px !important;
    max-height: none !important;
    margin-bottom: 0 !important;
    overflow: hidden !important;
    background-size: contain !important;
    background-position: center top !important;
  }

  #root .autonomous-community .bg .bg-circle-wrapper {
    position: relative !important;
    height: 90px !important;
    min-height: 90px !important;
    bottom: 0 !important;
    margin: 0 auto !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  #root .autonomous-community .bg .bg-circle-wrapper .bg-circle {
    width: 65px !important;
    height: 65px !important;
    left: calc(50% - 33px) !important;
    bottom: 0 !important;
    position: absolute !important;
  }

  #root .autonomous-community .bg .bg-circle-wrapper .bg-logo {
    top: 22px !important;
    left: calc(50% - 14px) !important;
    bottom: auto !important;
  }

  #root .autonomous-community ul.community-cards {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 28px 0 0 !important;
    padding: 0 !important;
    gap: 16px !important;
    list-style: none;
    z-index: 2;
  }

  #root .autonomous-community .community-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 24px 18px !important;
    box-sizing: border-box;
    text-align: left !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    gap: 0;
  }

  #root .autonomous-community .community-card .animate__animated {
    opacity: 1 !important;
  }

  #root .autonomous-community .community-card .title {
    font-size: 18px !important;
    line-height: 1.4 !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }

  #root .autonomous-community .community-card .desc {
    margin-top: 10px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: left !important;
    min-height: 0 !important;
    color: #9aa3bc !important;
  }

  #root .autonomous-community .community-card .divider-line {
    margin: 18px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background-size: 100% 1px !important;
  }

  #root .autonomous-community .community-card .val-line {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px 10px !important;
    width: 100% !important;
    text-align: left !important;
    opacity: 1 !important;
  }

  #root .autonomous-community .community-card .val-line.grants-line {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 10px !important;
  }

  #root .autonomous-community .community-card .val-line .val {
    font-size: 16px !important;
    line-height: 1.2 !important;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  #root .autonomous-community .community-card .val-line .tag {
    font-size: 12px !important;
    line-height: 1.3 !important;
    margin-left: 0 !important;
    white-space: normal !important;
  }

  #root .autonomous-community .community-card .val-line .link {
    display: block !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    text-align: left !important;
    white-space: normal !important;
  }

  #root .autonomous-community .community-card .buyback-tip {
    margin-top: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* ── Security: hidden on mobile ── */
  #root .homepage > section.security.adaptive {
    display: none !important;
  }

  /* ── Partners ── */
  #root .homepage > section.partners.adaptive {
    --partners-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --partners-pad-r: max(16px, env(safe-area-inset-right, 0px));
    width: calc(100% + var(--partners-pad-l) + var(--partners-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--partners-pad-l));
    margin-right: calc(-1 * var(--partners-pad-r));
    margin-top: 60px !important;
    margin-bottom: 40px !important;
    padding: 0 20px 48px !important;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
  }

  #root .partners .vertical-growing-line-warper {
    display: none !important;
  }

  #root .partners .section-title {
    font-size: 24px !important;
    line-height: 1.35 !important;
    text-align: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    white-space: normal !important;
    padding: 0 8px !important;
  }

  #root .partners .section-title .section-number,
  #root .partners .section-title .white-circle-4 {
    display: none !important;
  }

  #root .partners .title-desc {
    text-align: center !important;
    margin-bottom: 28px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    padding: 0 8px !important;
    color: #9aa3bc !important;
  }

  #root .partners .partner-cards {
    display: none !important;
  }

  #root .partners .partner-cards-mobile {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
  }

  #root .partners .partner-cards-mobile .partner-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 108px !important;
    padding: 18px 16px !important;
    box-sizing: border-box;
    text-align: center !important;
    background-size: 100% 100% !important;
    gap: 10px;
  }

  #root .partners .partner-cards-mobile .partner-card > [class*="icon-"],
  #root .partners .partner-cards-mobile .partner-card > .partner-icon2 {
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    background-size: 100% !important;
    background-position: center !important;
  }

  #root .partners .partner-cards-mobile .partner-card .text-field {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    text-align: center !important;
    gap: 4px;
  }

  #root .partners .partner-cards-mobile .partner-card .title {
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    text-align: center !important;
    width: 100%;
    color: #fff !important;
  }

  #root .partners .partner-cards-mobile .partner-card .desc {
    font-size: 12px !important;
    line-height: 1.45 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    color: #9aa3bc !important;
  }

  #root .partners .partner-cards-mobile .partner-card.apenft .desc,
  #root .partners .partner-cards-mobile .partner-card.mexc .desc,
  #root .partners .partner-cards-mobile .partner-card.wbtc .desc,
  #root .partners .partner-cards-mobile .partner-card.wlfi .desc {
    width: 100% !important;
    min-height: 0 !important;
  }

  /* ── Community footer ── */
  #root .community-footer .contact-icons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }

  #root .community-footer .base-icon-wrapper {
    justify-content: center;
  }

  /* ── Footer ── */
  #root .main > .footer-bg {
    z-index: 0 !important;
    max-height: 360px !important;
    pointer-events: none;
  }

  #root .homepage > footer.footer-v3.adaptive {
    --footer-pad-l: max(16px, env(safe-area-inset-left, 0px));
    --footer-pad-r: max(16px, env(safe-area-inset-right, 0px));
    position: relative !important;
    z-index: 2 !important;
    width: calc(100% + var(--footer-pad-l) + var(--footer-pad-r));
    max-width: 100vw;
    margin-left: calc(-1 * var(--footer-pad-l));
    margin-right: calc(-1 * var(--footer-pad-r));
    padding: 0 20px !important;
    box-sizing: border-box;
    overflow: visible !important;
    background: transparent;
  }

  #root .footer-v3 .footer-content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 48px 0 64px !important;
    position: relative;
    z-index: 1;
    overflow: visible !important;
  }

  #root .footer-v3 .footer-content .title-lang-part {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 16px !important;
    margin-bottom: 32px !important;
    overflow: visible !important;
  }

  #root .footer-v3 .footer-content .title-lang-part::before,
  #root .footer-v3 .footer-content .title-lang-part::after {
    display: none !important;
  }

  #root .footer-v3 .footer-brand-title {
    align-items: center !important;
    width: 100%;
  }

  #root .footer-v3 .footer-brand-title .title-text {
    font-size: 28px !important;
    line-height: 1.2 !important;
    text-align: center !important;
    color: #e4f1f1 !important;
  }

  #root .footer-v3 .footer-brand-title .all-rights-reserved-text {
    margin-top: 8px !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    color: #9aa3bc !important;
  }

  #root .footer-v3 .language-selector {
    margin: 0 !important;
    justify-content: center !important;
  }

  #root .footer-v3 .links-part-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    padding-bottom: 0 !important;
    overflow: visible !important;
  }

  #root .footer-v3 .links-part {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-top: 0 !important;
    overflow: visible !important;
  }

  #root .footer-v3 .links-lists {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 28px 20px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #root .footer-v3 .link-list {
    flex-basis: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  #root .footer-v3 .link-list:nth-child(5) {
    grid-column: 1 / -1;
    max-width: 240px;
    margin: 0 auto !important;
  }

  #root .footer-v3 .list-title {
    font-size: 14px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    color: #e4f1f1 !important;
    width: 100%;
  }

  #root .footer-v3 .footer-text-link {
    margin-top: 12px !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    text-align: center !important;
    align-self: center !important;
    color: #9aa3bc !important;
    word-break: break-word;
    max-width: 100%;
  }

  #root .footer-v3 .social-media-links {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px 20px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 32px !important;
    padding-top: 24px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
  }

  #root .footer-v3 .social-media-links .footer-social-media-link {
    width: auto !important;
    min-width: 44px !important;
    height: 36px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* ── Media ── */
  #root .bg_video,
  #root .icon-video,
  #root .video-wrap video {
    max-width: 100%;
  }
}

@media screen and (max-width: 480px) {
  #root .homepage {
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
  }

  #root .jst .left-right-container2 {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  #root .jst .flex.flex-wrap {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px 10px !important;
  }

  #root .jst .val-container .val {
    font-size: 13px !important;
  }

  #root .jst .title-line .title {
    font-size: 24px !important;
  }

  #root .growing-ecosystem .eco-cards .eco-card {
    max-width: 100%;
  }

  #root .footer-v3 .links-lists {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  #root .footer-v3 .link-list:nth-child(5) {
    max-width: 100%;
  }
}