/* Accommodate translated copy without changing the site's established layout. */
.language-options {
  width: 168px;
  padding: 6px;
  border: 1px solid #e8e8e8;
  border-radius: 16px;
  background: #fff;
  color: #171717;
  box-shadow: 0 8px 28px rgb(0 0 0 / 7%);
  transform-origin: top right;
}
.language-options:not([hidden]) { animation: language-menu-in 160ms ease-out; }
.language-options > button {
  min-height: 44px;
  padding: 0 12px;
  gap: 20px;
  border-radius: 10px;
  font-family: var(--sans);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.3;
  transition: background 160ms ease;
}
.language-options > button + button { margin-top: 3px; }
.language-options button[aria-pressed="true"] {
  background: #f4f4f4;
  font-weight: 650;
  text-decoration: none;
}
.language-options > button::after {
  content: "";
  width: 5px;
  height: 9px;
  margin-right: 4px;
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-2px) rotate(45deg);
  opacity: 0;
}
.language-options button[aria-pressed="true"]::after { opacity: 1; }
.language-options > button:hover { background: #ededed; }
.language-options > button:focus-visible {
  outline: 1.5px solid #333;
  outline-offset: -2px;
  background: #f4f4f4;
}
.language-toggle[aria-expanded="true"] { background: rgb(128 128 128 / 8%); }
@keyframes language-menu-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .language-options:not([hidden]) { animation: none; }
  .language-options > button { transition: none; }
}
html[lang="en"] .about-split-copy h1,
html[lang="en"] .about-split-copy h2 { font-size: clamp(28px, 3.1vw, 54px); }
html[lang="en"] .about-split-copy p { text-wrap: pretty; }
html[lang="ko"] .product-card-title { word-break: keep-all; }
html[lang="ko"] .desktop-nav { gap: clamp(20px, 3vw, 48px); }
@media (max-width: 600px) {
  html[lang="en"] .news-heading h1 { font-size: clamp(30px, 8vw, 46px); }
  html[lang="en"] .about-flavors-heading h2 { font-size: 38px; }
  html[lang="en"] .dialog-product-nav { gap: 12px; }
  html[lang="en"] .dialog-product-nav span { overflow-wrap: anywhere; }
}
