/*
 * QuickNord phone layout refinements — iPhone/Android 320-700px.
 * Loaded last; desktop/tablet and WooCommerce functionality are unchanged.
 * Compact touch navigation, horizontal header actions, accessible search.
 */
@media (max-width:700px) {
  /* The logo, account and cart share one tidy header row. */
  .qn-header--brand .qn-headrow{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    column-gap:8px;
    row-gap:8px;
    padding:10px 0 12px;
    min-width:0;
  }
  .qn-header--brand .qn-brand--image{
    grid-column:1;
    grid-row:1;
    justify-self:start;
    width:100%;
    max-width:min(200px,calc(100vw - 132px));
    min-width:0;
  }
  .qn-header--brand .qn-brand--image .qn-brand__image{
    display:block;
    max-width:100%;
    height:auto;
  }
  .qn-header--brand .qn-headlinks{
    grid-column:2;
    grid-row:1;
    display:flex;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end;
    justify-self:end;
    gap:6px!important;
    min-width:0;
    width:auto;
    white-space:nowrap;
    margin:0;
  }
  .qn-header--brand .qn-headlinks a.qn-headlink{
    flex:0 0 44px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:44px;
    width:44px;
    height:44px;
    min-height:44px!important;
    padding:5px!important;
    margin:0;
  }
  .qn-header--brand .qn-headlinks .qn-headlink__icon{
    display:grid;
    place-items:center;
    flex:0 0 31px;
    width:31px;
    height:31px;
  }
  .qn-header--brand .qn-headlinks .qn-headlink__label{
    display:none;
  }
  .qn-header--brand form.qn-search{
    grid-column:1 / -1;
    grid-row:2;
    display:flex;
    align-items:stretch;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:48px;
    margin:0;
  }
  .qn-header--brand .qn-search input[type="search"]{
    flex:1 1 0;
    min-width:0;
    width:100%;
    padding:10px 12px;
    font-size:16px!important;
  }
  .qn-header--brand .qn-search button[type="submit"]{
    flex:0 0 auto;
    min-height:48px;
    padding:0 15px!important;
    font-size:13px;
  }

  /* A one-column accordion is easier to navigate than two cramped photo
     tiles when the site has many three-level model menus. */
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%;
    gap:6px!important;
    padding:8px 0 16px!important;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li,
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li:last-child{
    display:block!important;
    grid-column:1/-1!important;
    width:100%;
    min-width:0;
    margin:0!important;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>a,
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li:not(:last-child)>a,
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li:last-child>a{
    display:flex!important;
    flex-direction:row!important;
    justify-content:flex-start!important;
    align-items:center!important;
    text-align:left!important;
    gap:12px!important;
    width:100%;
    min-height:65px!important;
    height:auto!important;
    padding:9px 55px 9px 12px!important;
    margin:0!important;
    font:800 13.5px/1.35 Manrope,"DM Sans",sans-serif!important;
    transform:none!important;
    border-radius:12px!important;
    box-shadow:0 2px 7px rgba(13,68,120,.05)!important;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li:last-child>a{
    padding-right:13px!important;
    min-height:65px!important;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>a>.qn-cat-symbol{
    display:grid;
    flex:0 0 42px;
    width:42px!important;
    height:42px!important;
    place-items:center;
    border-radius:11px;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>a>.qn-cat-symbol svg{
    display:block;
    width:25px;
    height:25px;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>.qn-submenu-toggle{
    top:10px;
    right:7px;
    width:44px;
    height:44px;
    border-radius:10px;
    background:#edf6ff;
    z-index:5;
    touch-action:manipulation;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li.is-expanded>.sub-menu{
    position:static;
    display:block;
    max-width:100%;
    width:100%;
    min-width:0;
    padding:8px 8px 12px 12px;
    border-radius:0 0 12px 12px;
    border-left:2px solid #c0ddff;
    box-shadow:none;
    overflow:visible;
  }
  /* The nested arrows work within the expanded full-width row. */
  .qn-nav.qn-nav--store .qn-menu-shell.is-open
    #qn-main-menu>li.is-expanded>.sub-menu a{
    overflow-wrap:anywhere;
  }

  /* Search inputs below 16px trigger unwanted auto-zoom in iOS Safari. */
  .qn-cover-hub input[type="search"],
  .qn-cover-hub--live input[type="search"],
  .qn-sp-page input[type="search"],
  .qn-tab-hub input[type="search"]{
    font-size:16px!important;
    max-width:100%;
  }
  .qn-cover-hub h1,
  .qn-sp-page h1,
  .qn-tab-hub h1,
  .qn-ma-hub h1,
  .qn-ch-hub h1{
    max-width:100%;
    overflow-wrap:break-word;
  }
  .qn-ma-hub .qn-ma-option-body small,
  .qn-ch-hub .qn-ch-category-copy small{
    color:#4a6483;
  }
}
@media (max-width:360px){
  .qn-header--brand .qn-brand--image{
    max-width:min(170px,calc(100vw - 124px));
  }
  .qn-header--brand .qn-headlinks{
    gap:4px!important;
  }
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>a,
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li:not(:last-child)>a{
    font-size:12.6px!important;
  }
}
@media (prefers-reduced-motion:reduce){
  .qn-nav.qn-nav--store .qn-menu-shell.is-open #qn-main-menu>li>a{
    transition:none!important;
  }
}