/* Localized display copy keeps the same condensed visual rhythm. */
@font-face {
  font-family: 'Oswald';
  src: url('/assets/fonts/oswald.woff2') format('woff2');
  font-style: normal;
  font-weight: 200 700;
  font-display: swap;
}

:root {
  --display: 'Barlow Condensed', 'Oswald', 'Arial Narrow', Impact, sans-serif;
}

.lang-ru, .lang-uk {
  --display: 'Oswald', 'Onest', Arial, sans-serif;
}

.lang-ru .hero-title, .lang-uk .hero-title {
  font-size: clamp(56px, 5.6vw, 82px);
  line-height: 1.04;
  letter-spacing: -1.3px;
}

.language-picker {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 72px;
  width: 72px;
  min-height: 44px;
  margin: 0;
}

.language-picker select {
  width: 100%;
  height: 44px;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: var(--navy);
  background-color: var(--white);
  padding: 8px 7px;
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}

.language-picker select:hover {
  border-color: #a9b8d0;
  background-color: #f8faff;
}

.language-picker > svg {
  position: absolute;
  left: 9px;
  width: 14px;
  height: 14px;
  pointer-events: none;
}

.language-picker:has(> svg) select { padding-left: 28px; }

/* Translations wrap within their existing cards and controls. */
.btn { white-space: normal; overflow-wrap: anywhere; }
.header-actions .btn { max-width: 190px; }
.hero-title, .page-top h1, .section-heading h2,
.promo-copy h2, .pricing-card h2, .detail-info h1,
.success-state h1, .seller-hero h2 { overflow-wrap: break-word; }
.nav a, .mobile-nav a, .mobile-drawer a,
.account-nav a, .feature-list li { overflow-wrap: anywhere; }
.section-heading > a { max-width: 40%; }
.pill { max-width: 100%; white-space: normal; }

@media (min-width: 768px) and (max-width: 1439px) {
  .header-inner { flex-wrap: wrap; gap: 4px 18px; padding-block: 10px; }
  .nav { order: 3; width: 100%; margin: 0; justify-content: center; gap: 25px; }
  .nav a { text-align: center; overflow-wrap: normal; }
  .nav a.active::after { bottom: 0; }
}

@media (max-width: 767px) {
  .header-inner { gap: 8px; }
  .header-actions { gap: 4px; }
  .header-actions > a.icon-btn { display: none; }
  .language-picker { flex-basis: 72px; width: 72px; }
  .language-picker select { font-size: 16px; }
  .lang-ru .hero-title, .lang-uk .hero-title {
    font-size: clamp(45px, 11.5vw, 75px);
    letter-spacing: -1px;
  }
  .section-heading { flex-wrap: wrap; align-items: start; }
  .section-heading > a { max-width: 100%; }
  .mobile-nav a { font-size: 10px; line-height: 1.25; text-align: center; padding-inline: 4px; overflow-wrap: normal; }
  .inline-actions .btn, .modal-actions .btn { flex: 1 1 130px; }
  .modal-actions { flex-wrap: wrap; }
}

@media (max-width: 479px) {
  .header-actions { gap: 2px; }
  .header-actions > .mobile-menu { display: inline-flex; margin-left: 0; }
  .lang-ru .hero-title, .lang-uk .hero-title {
    font-size: clamp(40px, 11.5vw, 55px);
  }
}