/* Small localization adjustments layered after the original public styles.
   Comparison geometry, media sizing and interactive state stay unchanged. */
.locale-switch {
  display:inline-flex;
  align-items:center;
  flex:0 0 auto;
  gap:2px;
  width:max-content;
  max-width:100%;
  padding:2px;
  border:1px solid var(--line);
  border-radius:4px;
  background:#fff;
  font-size:12px;
  font-weight:500;
  line-height:1.3;
}
.locale-switch a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  min-width:34px;
  padding:5px 8px;
  border-radius:2px;
  white-space:nowrap;
  color:var(--muted);
}
.locale-switch a:hover {color:var(--blue);background:var(--paper)}
.locale-switch a[aria-current="page"],
.locale-switch a[aria-current="true"],
.locale-switch a.is-active {color:var(--blue);background:#edf5fc;font-weight:650}
.locale-switch a:focus-visible {outline-offset:2px}
.header nav .locale-switch {margin-left:0}

html[lang="en"] :is(.two-column,.three-column,.section-head,.footer-grid,.confidence-inner)>* {min-width:0}
html[lang="en"] :is(h1,h2,h3,h4) {overflow-wrap:break-word}
html[lang="en"] .page-intro h1 {max-width:24ch;line-height:1.2}
html[lang="en"] .hero h1 {line-height:1.16;letter-spacing:-.035em}
html[lang="en"] .hero-copy>p:not(.eyebrow) {line-height:1.7}
html[lang="en"] :is(.content-card,.guide-card,.article-body) {overflow-wrap:break-word}
html[lang="en"] .article-body :is(p,li) {line-height:1.8}
html[lang="en"] .article-body .content-card+.content-card {margin-top:16px}
html[lang="en"] .button {max-width:100%;text-align:center}
html[lang="en"] :is(.style-card-body,.commerce-card-body) h3 {line-height:1.3}
html[lang="en"] .style-card-meta {flex-wrap:wrap;gap:5px 16px}
html[lang="en"] .style-card-footer {flex-wrap:wrap}
html[lang="en"] .style-card-image .image-caption {max-width:calc(100% - 24px);line-height:1.4;text-align:right}
html[lang="en"] :is(.sku-stats,.hl-stats,.facts-grid) dt {line-height:1.45;overflow-wrap:break-word}
html[lang="en"] .product-current {flex-wrap:wrap;gap:7px 16px}
html[lang="en"] :is(.category-tabs,.tabs-line) {overflow-x:auto;min-width:0}
html[lang="en"] :is(.category-tabs,.tabs-line)>a {flex-shrink:0}
html[lang="en"] .rfq-line-controls label {max-width:100%;flex-wrap:wrap}
html[lang="en"] .rfq-line-controls select {width:auto;max-width:100%;min-width:120px}
html[lang="en"] :is(.form-grid label,.rfq-item-head h3) {min-width:0;overflow-wrap:break-word}
html[lang="en"] :is(.factory-video-caption,.footer-bottom) {overflow-wrap:break-word}
html[lang="en"] .gn-series-links {flex-wrap:wrap}
html[lang="en"] .hl-row-label h3 {line-height:1.4;overflow-wrap:break-word;letter-spacing:0}
html[lang="en"] .hl-height-state {white-space:normal;text-align:center;line-height:1.4}
html[lang="en"] .hl-height-footer {max-width:100%;overflow-wrap:break-word}
html[lang="en"] .hl-card-actions a.hl-detail {overflow-wrap:break-word}
html[lang="en"] .gn-page .hl-view-switch button {white-space:normal;line-height:1.3}

/* English navigation needs the existing collapsible menu a little earlier. */
@media (min-width:961px) and (max-width:1200px) {
  html[lang="en"] .header nav {
    display:none;
    position:absolute;
    top:100%;left:0;right:0;
    margin-left:0;
    padding:18px 24px;
    border-bottom:1px solid var(--line);
    background:#fff;
    box-shadow:0 12px 24px #102f4314;
    max-height:calc(100dvh - var(--header));
    overflow-y:auto;
  }
  html[lang="en"] .header nav.open {display:flex;flex-wrap:wrap;justify-content:flex-start;gap:18px 24px}
  html[lang="en"] .menu-toggle {display:grid;place-items:center;min-width:44px;min-height:44px;margin-left:auto}
}
@media (min-width:1201px) {
  html[lang="en"] .header-inner {gap:18px}
  html[lang="en"] .header nav {gap:18px}
}
@media (max-width:960px) {
  .header nav {top:100%}
  .header nav .locale-switch {margin-top:4px}
}
@media (max-width:680px) {
  html[lang="en"] .hero:after {background:linear-gradient(180deg,rgba(16,47,67,.95) 0%,rgba(16,47,67,.82) 52%,rgba(16,47,67,.58) 70%,rgba(16,47,67,.08) 100%)}
  html[lang="en"] .hero-support {color:#f2f7fa;text-shadow:0 1px 3px #102f43}
  .locale-switch a {min-height:40px;min-width:38px}
  html[lang="en"] .hero h1 {font-size:clamp(30px,8.2vw,36px);line-height:1.16}
  html[lang="en"] .hero-copy>p:not(.eyebrow) {max-width:38ch;line-height:1.65}
  html[lang="en"] .page-intro h1 {font-size:clamp(28px,7.4vw,33px)}
  html[lang="en"] .style-card-body h3 {font-size:19px}
  html[lang="en"] .style-card-image .image-caption {text-align:center}
  html[lang="en"] .series-selector h1 {font-size:28px;line-height:1.2}
  html[lang="en"] .view-tabs button {padding-inline:12px;font-size:12px}
  html[lang="en"] .footer-bottom {flex-wrap:wrap}
  html[lang="en"] .footer-bottom span:last-child {max-width:100%;text-align:left}
  html[lang="en"] .gn-page .hl-compare-bottom {flex-wrap:wrap}
  html[lang="en"] .gn-page #gn-parameters .section-head {flex-wrap:wrap}
  html[lang="en"] .gn-page .hl-view-switch button {padding-inline:6px}
  /* If the switch is outside the menu, give it a real row, not an overlay. */
  .header-inner:has(>.locale-switch) {flex-wrap:wrap;row-gap:0;padding-block:5px}
  .header-inner>.locale-switch {margin-left:auto;margin-top:2px;order:5}
  .header-inner:has(>.locale-switch)::after {content:"";order:4;flex-basis:100%;height:0}
  html:has(.header-inner>.locale-switch) {--header:114px}
  .header-inner>.locale-switch a {min-height:30px}
}
@media (max-width:600px) {
  html[lang="en"] .gn-page .hl-row {grid-template-columns:98px minmax(0,1fr)}
  html[lang="en"] .gn-page .hl-row-label {padding-inline:9px 6px}
  html[lang="en"] .gn-page .hl-row-label h3 {font-size:11px}
}
@media (pointer:coarse) {
  .header nav .locale-switch a {min-height:44px;min-width:44px}
}