/* ui1 (owner 2026-10-21: "the website need to be improved and UI/UX fix"), from the live audit of every page at 1366,
   1280 and 390 px: the menu wrapped onto two lines on every desktop and laptop page, and stand-alone text links were
   too small to tap on phones. Loaded after the other stylesheets. */

/* The menu: one line each; below 1240 px it folds into "Menu" (experience.js uses the same width) */
.site-header nav a,.site-header nav button{white-space:nowrap}
@media(min-width:1241px){
  .site-header{max-width:1320px;padding-left:24px;padding-right:24px;gap:18px}
  .site-header nav{gap:16px}
}
@media(min-width:1241px) and (max-width:1365px){
  .site-header nav{gap:12px;font-size:13.5px}
  .site-header nav .nav-trial{padding:10px 13px}
}
@media(min-width:1021px) and (max-width:1240px){
  .site-header{padding:20px 28px;flex-wrap:wrap;min-height:80px}
  .site-header .nav-toggle:not([hidden]){display:inline-flex}
  .site-header nav{width:100%;flex-direction:column;align-items:stretch;gap:2px;padding-top:13px;border-top:1px solid var(--line)}
  .site-header nav[hidden]{display:none}
  .site-header nav a,.site-header nav button{min-height:44px;padding:9px 6px}
  .site-header nav form{margin:0}
  .site-header nav .nav-trial{justify-content:center;text-align:center;margin-top:6px}
}

/* Phones: a link standing on its own gets a finger-sized target (WCAG 2.2 target size) */
@media(max-width:760px){
  .text-link,.obiz-legal a,.show-all,.shop-crumbs a{display:inline-flex;align-items:center;min-height:44px}
  .text-link{margin-top:4px;margin-bottom:4px}
  .obiz-legal{display:flex;flex-wrap:wrap;column-gap:18px}
}
