/* Orca Systems - shared layer for the Vietnamese, Indonesian, Malay and Chinese pages (/vi /id /ms /zh).
   Linked after /css/styles.css. It only adds what the translated pages need that the English pages do not:
   room for longer button and badge labels, a footer note, and wrapping that never overflows at 320px.
   The language switcher itself is styled in styles.css (.lang-switch). */

body { overflow-wrap: break-word; }

.footer-tagline { margin-top: var(--space-3); max-width: 32ch; }
.footer-note { margin: var(--space-3) 0 0; font-size: 0.85rem; }

/* Labels are often longer than the English ones: let them wrap to two lines instead of being clipped. */
.btn { padding-top: 10px; padding-bottom: 10px; text-align: center; line-height: 1.35; }
/* The header buttons stay on one line; their labels are kept short in the markup. */
.nav-actions .btn { white-space: nowrap; }

.hero-badge { line-height: 1.4; }
@media (max-width: 480px) {
  .hero-badge { border-radius: var(--radius-md); }
}

/* Long price headline: let it use the column instead of the English 14ch measure. */
.price-lead h1 { max-width: none; font-size: clamp(1.4rem, 2.6vw, 2rem); line-height: 1.25; }
.page-lead h1 { max-width: 24ch; }
.page-lead--wide h1 { max-width: 22ch; }

/* Between the point where the full nav appears and a wide desktop, tighten the header so longer labels fit. */
@media (min-width: 1041px) and (max-width: 1200px) {
  .site-header .container { gap: var(--space-3); }
  .nav-links { gap: var(--space-3); }
  .nav-links a { font-size: 0.9rem; }
  .nav-actions { gap: var(--space-2); }
}