/* fangsheng Forklift child theme – layout tweaks (loaded last) */
.hh-logo { max-height: 64px; width: auto; height: auto; object-fit: contain; }
.footer_logo .hh-logo { max-height: 56px; }
.m-navlist-guanxiang .logo img.hh-logo { max-height: 48px; }
/* ---------------------------- Desktop header ----------------------------
   Measured slack after the 48px logo (1170px container, EN, 1280px+): 199px.
   The logo art is 177x46 (ratio 3.85), so height h costs 3.85*h of width.
   At 64px it measures 246px wide, leaving ~138px of headroom - the row stays
   on one line across the whole desktop range while the mark finally reads at
   a size that balances the menu and the quote button.
   The real webfont renders wider than the fallback, which is why the menu is
   kept tight: without that trim the row used to break onto a second line.

   WHY `max-width: none` IS LOAD-BEARING (do not drop it):
   the parent theme ships
     .header-height-guanxiang .head-logo a img { max-width: 60%; height: 64px;
                                                 object-fit: contain; }
   `max-width: 60%` resolves against the wrapping <a>, and that <a> is already
   as wide as the image's natural width at 64px (246px). So the image was
   capped at 148px wide while its box stayed 64px tall; `object-fit: contain`
   then letter-boxed it and the artwork was only ever *painted* at 148x38 -
   the "make the logo bigger" knob appeared to do nothing. Measured on the
   live site before this fix: box 148x64, painted 148x38.
   The <a> box is already 246px wide, so lifting the cap does NOT move the
   nav by a single pixel; it only lets the art fill the box it already owns.
   After the fix: painted 246x64 at >=1280px, 200x52 at 961-1279px. */
/* The section stylesheets are emitted inline in the <body>, i.e. after this
   file, so equal-specificity rules here would lose. Prefixing with `body`
   gives just enough weight to win without resorting to !important. */
@media (min-width: 961px) {
  body .header-height-guanxiang .head-logo a img {
    height: 64px; width: auto; max-width: none; object-fit: contain;
  }
  body .header-height-guanxiang .head-nav-guanxiang { width: auto; flex: 0 1 auto; }
  body .header-height-guanxiang .head-nav-guanxiang ul { white-space: nowrap; }
  body .header-height-guanxiang .head-nav-guanxiang li { padding: 0 8px; }
  body .header-height-guanxiang .href a { padding: 14px 22px; white-space: nowrap; }
}
/* Spanish labels ("Sobre Nosotros", "Solicitar Cotización") are the longest,
   so they get a little extra trim to keep pace with the English row. */
@media (min-width: 961px) {
  html[lang="es"] body .header-height-guanxiang .head-nav-guanxiang li { padding: 0 6px; }
  html[lang="es"] body .header-height-guanxiang .head-nav-guanxiang li a { font-size: 13.5px; }
  html[lang="es"] body .header-height-guanxiang .href a { padding: 14px 16px; font-size: 14px; }
}
/* Narrow desktop (961-1279px): the container shrinks to 960px and slack drops
   to 87px at the 48px logo, so the mark gets a smaller step up (52px = 200px
   wide) and the menu keeps its existing trim. Spanish needs the extra shave:
   its "Solicitar Cotización" button alone renders ~31px wider than "Get a
   Quote", which left only 2px of slack at 992px before this trim. */
@media (min-width: 961px) and (max-width: 1279px) {
  body .header-height-guanxiang .head-logo a img {
    height: 52px; width: auto; max-width: none; object-fit: contain;
  }
  /* The theme parks the logo at margin-top:10px, which was fine for a 31px
     mark but leaves a lopsided 10px/20px gap once the art actually fills its
     52px box. Re-centre it in the 82px bar. */
  body .header-height-guanxiang .head-logo { margin-top: 15px; }
  body .header-height-guanxiang .head-nav-guanxiang li { padding: 0 6px; }
  body .header-height-guanxiang .head-nav-guanxiang li a { font-size: 14px; }
  body .header-height-guanxiang .href a { padding: 12px 16px; font-size: 14px; }
  html[lang="es"] body .header-height-guanxiang .head-nav-guanxiang li { padding: 0 3px; }
  html[lang="es"] body .header-height-guanxiang .head-nav-guanxiang li a { font-size: 12.5px; }
  html[lang="es"] body .header-height-guanxiang .href a { padding: 12px 8px; font-size: 13px; }
}
/* product grid images */
#features .gallery .image img { width: 100%; height: auto; display: block; }
/* success / error toast for the inquiry form */
#hh-toast {
  position: fixed; left: 50%; bottom: 40px; transform: translate(-50%, 20px);
  background: #ff5e14; color: #fff; padding: 14px 26px; border-radius: 6px;
  font-size: 15px; line-height: 1.4; max-width: 90%; z-index: 99999;
  opacity: 0; transition: opacity .3s, transform .3s; box-shadow: 0 8px 24px rgba(0,0,0,.18);
}
#hh-toast.on { opacity: 1; transform: translate(-50%, 0); }
#hh-toast.err { background: #d93025; }