/* Deliberate two-row touch header. Keep desktop composition and theme tokens. */
@media (max-width: 900px), (max-height: 500px) and (pointer: coarse) {
  .site-header {
    display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"brand menu" "theme language";
    height:auto;min-height:0;gap:6px 10px;
    padding:8px max(16px,env(safe-area-inset-right)) 8px max(16px,env(safe-area-inset-left));
  }
  .site-header .brand {grid-area:brand;margin:0;min-height:44px;display:flex;align-items:center;font-size:17px}
  .site-header #menu-toggle {grid-area:menu;display:block;min-width:64px;min-height:44px;padding:8px 0;text-align:right;justify-self:end}
  .site-header .language-picker {grid-area:language;justify-self:end}
  .site-header .language-picker #language-toggle {min-height:44px;padding:8px 10px;font-size:12px}
  .site-header .xt-theme-picker {grid-area:theme;margin:0;min-width:0;justify-self:start;max-width:100%}
  .site-header .xt-theme-trigger {max-width:100%;min-height:44px;gap:7px;padding:8px;font-size:12px}
  .site-header .xt-theme-current {max-width:none;white-space:normal;text-align:left;line-height:1.2}
  .site-header .xt-theme-swatch {width:24px;min-width:24px;height:16px}
  .site-header nav {grid-column:1 / -1;grid-row:3;display:none;margin:0;flex-direction:column;gap:0;max-height:calc(100dvh - 130px);overflow:auto}
  .site-header nav.open {display:flex}
  .site-header nav a {min-height:44px;display:flex;align-items:center}
  .site-header .download {display:none}
  .site-header .mobile-download {display:flex}
}
@media (max-width: 620px) {
  html {scroll-padding-top:126px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  .hero.wrap {width:auto;margin-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));padding-top:28px}
  .hero .eyebrow {font-size:10px;letter-spacing:.11em;line-height:1.6;margin:0 0 16px;max-width:31em}
  .hero h1 {font-size:clamp(28px,7.45vw,32px);line-height:1.13;letter-spacing:-.04em;font-weight:500;max-width:100%;text-wrap:balance}
  .hero-heading {margin-bottom:24px}
  .hero-intro {max-width:none;margin-top:20px}
  .hero-intro p {font-size:14px;line-height:1.65;margin:0 0 12px}
  .hero-intro a {display:inline-flex;align-items:center;gap:24px;min-height:44px;font-size:13px}
  .hero .caption {display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-top:10px;font-size:11px;line-height:1.5}
  .hero .caption>span {max-width:34em}
  .hero .caption #original {font-size:11px;min-height:44px;min-width:44px;text-align:left;padding:4px 0;white-space:nowrap}
  .hero .mobile-entry:empty {display:none}
  .nx-exchanges {margin-inline:16px;max-width:calc(100% - 32px)}
  .nx-exchanges-rail {width:100%;-webkit-overflow-scrolling:touch}
  .nx-exchanges-rail ul {display:flex;flex-flow:row nowrap;width:max-content;max-width:none}
}
@media (max-height:500px) and (pointer:coarse) {.site-header{position:relative}}