:root{--orange:#ff6a00;--blue:#12356b;--dark:#0f172a;--muted:#64748b;--bg:#f5f7fb}
*{box-sizing:border-box}body{margin:0;font-family:Inter,Arial,"Microsoft YaHei",sans-serif;background:var(--bg);color:#111827}
a{color:inherit;text-decoration:none}.container{max-width:1200px;margin:auto;padding:0 20px}
.topbar{background:#111827;color:#fff;font-size:13px}.topbar .container{display:flex;justify-content:space-between;gap:20px;padding-top:8px;padding-bottom:8px;flex-wrap:wrap}
.header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 1px 14px rgba(15,23,42,.08)}.header .container{max-width:1500px}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;gap:18px}.header-social-left{display:flex;align-items:center;gap:12px;min-width:120px}.header-social-btn{display:inline-flex;width:34px;height:34px;border-radius:0;background:transparent;border:0;align-items:center;justify-content:center;box-shadow:none;transition:.2s;padding:0}.header-social-btn:hover{transform:translateY(-2px);background:transparent}.header-social-btn img{width:30px;height:30px;object-fit:contain;display:block}.brand{display:flex;align-items:center;gap:0;min-width:360px}.brand img{display:none;width:0;height:0}.brand-text{display:flex;flex-direction:column;line-height:1.12}.brand-title{font-weight:900;font-size:22px}.brand-cn{font-size:18px;color:#334155;margin-top:4px;font-weight:700}.brand-sub{font-size:15px;color:var(--muted);margin-top:4px}
.search{flex:0 0 380px;max-width:380px;min-width:380px}.search input{width:100%;border:1px solid #e5e7eb;border-radius:999px;padding:14px 22px;font-size:15px}
.actions{display:flex;align-items:center;gap:10px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:999px;padding:11px 18px;font-weight:800;cursor:pointer;background:var(--orange);color:#fff}.btn.secondary{background:#fff;color:#111827;border:1px solid #e5e7eb}.btn.green{background:#20b15a}.btn.small{padding:8px 12px;font-size:12px}

/* Header icon motion */
.header-social-btn,
#waBtn{
  position:relative;
  overflow:visible;
  will-change:transform, box-shadow;
}

/* 20260603 professional content upgrade: clearer buyer path and quote preparation */
.buyer-path{
  background:#f8fbff;
  border-bottom:1px solid #e5eef8;
}
.buyer-path-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding-top:18px;
  padding-bottom:18px;
}
.buyer-path article{
  background:#fff;
  border:1px solid #dbeafe;
  border-radius:8px;
  padding:16px 18px;
  box-shadow:0 10px 28px rgba(15,23,42,.05);
}
.buyer-path b{
  display:block;
  color:#0f172a;
  font-size:16px;
  line-height:1.25;
  margin-bottom:7px;
}
.buyer-path span{
  display:block;
  color:#64748b;
  font-size:14px;
  line-height:1.55;
}
.contact-prep-list{
  display:grid;
  gap:8px;
  margin-top:20px;
  padding:16px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  background:#eff6ff;
}
.contact-prep-list b{
  color:#0f172a;
  font-size:15px;
}
.contact-prep-list span{
  position:relative;
  padding-left:18px;
  color:#334155;
  line-height:1.5;
}
.contact-prep-list span::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#0056D6;
}
@media(max-width:920px){
  .buyer-path-grid{
    grid-template-columns:1fr;
    gap:10px;
    padding:14px 18px;
  }
  .buyer-path article{
    padding:14px 16px;
  }
}

/* 20260607 v117: restore V109 dimensions for the initial header nav only.
   The scrolled sticky navigation clone is intentionally untouched. */
html:not(.nav-clone-active) body.home-page .header .main-nav,
html:not(.nav-clone-active) body.products-page-body .header .main-nav,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
html:not(.nav-clone-active) body.about-page-body .header .main-nav,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:56px !important;
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  padding:14px 0 2px !important;
  margin-top:4px !important;
  background:transparent !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  font-size:22px !important;
  font-weight:900 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  min-height:42px !important;
  padding:8px 14px !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#1A1A1A !important;
  background:transparent !important;
  border-radius:999px !important;
  box-shadow:none !important;
  font-size:inherit !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
  color:#0056D6 !important;
  background:#fff !important;
  box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  position:relative !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"]::before,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active::before{
  content:none !important;
}

body:not(.home-page).products-page-body .header .main-nav,
body:not(.home-page).projects-page-body .header .main-nav,
body:not(.home-page).about-page-body .header .main-nav,
body:not(.home-page).contact-page-body .header .main-nav{
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  justify-self:stretch !important;
  gap:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:14px 0 0 !important;
  border-top:1px solid rgba(15,23,42,.10) !important;
}

body:not(.home-page).products-page-body .header .main-nav a,
body:not(.home-page).projects-page-body .header .main-nav a,
body:not(.home-page).about-page-body .header .main-nav a,
body:not(.home-page).contact-page-body .header .main-nav a{
  flex:1 1 0 !important;
  min-height:42px !important;
  padding:0 12px !important;
}

@media(max-width:1200px){
  html.desktop-view-mode:not(.nav-clone-active) body.home-page .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    width:100% !important;
    max-width:100% !important;
    justify-content:space-between !important;
    gap:0 !important;
    min-height:0 !important;
    overflow:hidden !important;
    padding-left:8px !important;
    padding-right:8px !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html.desktop-view-mode:not(.nav-clone-active) body.home-page .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.contact-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-height:42px !important;
    padding-left:2px !important;
    padding-right:2px !important;
    font-size:13px !important;
  }
}

@media(max-width:920px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:0 !important;
    min-height:0 !important;
    overflow-x:hidden !important;
    overflow-y:hidden !important;
    padding:9px 6px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    flex:1 1 20% !important;
    min-width:0 !important;
    max-width:20% !important;
    width:20% !important;
    box-sizing:border-box !important;
    min-height:34px !important;
    padding:7px 2px !important;
    margin:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
    line-height:1 !important;
    font-weight:900 !important;
    overflow:hidden !important;
    text-overflow:clip !important;
    white-space:nowrap !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
    background:#fff !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }
}

@media(max-width:430px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    padding:8px 3px !important;
    font-size:12px !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    font-size:12px !important;
    letter-spacing:-.15px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* 20260607 v117 true EOF lock: V109 sizing wins for initial header nav only. */
@media(max-width:920px){
  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav{
    min-height:0 !important;
    padding:9px 6px !important;
    background:transparent !important;
    border-bottom:0 !important;
    box-shadow:none !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a{
    min-height:42px !important;
    padding:7px 2px !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a[href="#home"],
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active{
    color:#0056D6 !important;
    background:#fff !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a[href="#home"]::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active::before{
    content:none !important;
  }
}

/* 20260607 v117 specificity lock: beat v114/v115 phone selectors without touching sticky nav. */
@media(max-width:920px){
  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav{
    min-height:0 !important;
    padding:9px 6px !important;
    flex-wrap:nowrap !important;
    background:transparent !important;
    border-bottom:0 !important;
    box-shadow:none !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a{
    min-height:42px !important;
    padding:7px 2px !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a[href="#home"],
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active{
    color:#0056D6 !important;
    background:#fff !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a[href="#home"]::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active::before{
    content:none !important;
  }
}

/* 20260603 Facebook phone desktop homepage detail: fixed modal and direct Back close */
html.fb-browser .product-detail-modal,
html.fb-browser .product-detail-modal .product-detail-panel{
  transition:none !important;
  animation:none !important;
}
html.fb-browser .product-detail-modal:not(.hide){
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  max-width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-panel{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:auto !important;
  width:100vw !important;
  max-width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  max-height:100vh !important;
  max-height:100dvh !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-price-box{
  grid-template-columns:1fr 1fr !important;
}
.header-social-left .header-social-btn:nth-child(1){
  animation: headerIconFloat1 3.6s ease-in-out infinite;
}
.header-social-left .header-social-btn:nth-child(2){
  animation: headerIconFloat2 3.9s ease-in-out infinite .25s;
}
.header-social-left .header-social-btn::after{
  content:"";
  position:absolute;
  inset:-5px;
  border-radius:999px;
  opacity:.18;
  z-index:-1;
  transform:scale(.82);
}
.header-social-left .header-social-btn:nth-child(1)::after{
  background:radial-gradient(circle, rgba(59,130,246,.22) 0%, rgba(59,130,246,0) 72%);
  animation: headerIconAura 3.6s ease-in-out infinite;
}
.header-social-left .header-social-btn:nth-child(2)::after{
  background:radial-gradient(circle, rgba(236,72,153,.24) 0%, rgba(236,72,153,0) 72%);
  animation: headerIconAura 3.9s ease-in-out infinite .25s;
}
#waBtn{
  overflow:hidden;
  box-shadow:0 10px 24px rgba(32,177,90,.24);
  animation: whatsappBreath 3.4s ease-in-out infinite;
}
#waBtn::after{
  content:"";
  position:absolute;
  top:0;
  left:-120%;
  width:48%;
  height:100%;
  background:linear-gradient(115deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.42) 48%, rgba(255,255,255,0) 100%);
  transform:skewX(-22deg);
  animation: whatsappShine 4.2s ease-in-out infinite;
}
#waBtn:hover,
#waBtn:focus-visible,
.header-social-btn:hover,
.header-social-btn:focus-visible{
  animation-play-state:paused;
}
#waBtn:hover::after,
#waBtn:focus-visible::after,
.header-social-btn:hover::after,
.header-social-btn:focus-visible::after{
  animation-play-state:paused;
}
@keyframes headerIconFloat1{
  0%,100%{transform:translateY(0) scale(1);}
  30%{transform:translateY(-4px) scale(1.06);}
  60%{transform:translateY(1px) scale(.98);}
}
@keyframes headerIconFloat2{
  0%,100%{transform:translateY(0) scale(1);}
  35%{transform:translateY(-3px) scale(1.08) rotate(2deg);}
  65%{transform:translateY(1px) scale(.99) rotate(-1deg);}
}
@keyframes headerIconAura{
  0%,100%{opacity:.12;transform:scale(.84);}
  40%{opacity:.28;transform:scale(1.06);}
  70%{opacity:.16;transform:scale(.92);}
}
@keyframes whatsappBreath{
  0%,100%{transform:translateY(0) scale(1);box-shadow:0 10px 24px rgba(32,177,90,.24);}
  40%{transform:translateY(-2px) scale(1.03);box-shadow:0 16px 30px rgba(32,177,90,.33);}
  70%{transform:translateY(0) scale(.995);box-shadow:0 9px 18px rgba(32,177,90,.22);}
}
@keyframes whatsappShine{
  0%,18%{left:-120%;}
  35%{left:130%;}
  100%{left:130%;}
}
@media(max-width:900px){
  .header-social-left .header-social-btn:nth-child(1),
  .header-social-left .header-social-btn:nth-child(2){
    animation-duration:4.2s;
  }
  #waBtn{animation-duration:3.8s;}
}
@media (prefers-reduced-motion: reduce){
  .header-social-btn,
  .header-social-btn::after,
  #waBtn,
  #waBtn::after{
    animation:none !important;
  }
}
.hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#0f172a,#12356b);color:#fff}.hero .container{display:grid;grid-template-columns:1fr 1fr;gap:34px;align-items:center;padding-top:56px;padding-bottom:56px}
.badge{display:inline-flex;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:8px 14px;font-size:13px;margin-bottom:16px}.hero h1{font-size:52px;line-height:1.05;margin:0 0 18px;font-weight:900}.hero p{font-size:18px;line-height:1.7;color:#dbeafe;margin:0 0 24px}.hero-buttons{display:flex;gap:12px;flex-wrap:wrap}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}.stat{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.13);border-radius:20px;padding:16px}.stat b{display:block;color:#ffbf80;font-size:24px}
.hero-media{border-radius:30px;overflow:hidden;background:#000;box-shadow:0 20px 60px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.15)}.hero-media video,.hero-media img{width:100%;height:420px;object-fit:cover;display:block}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:28px 0}.feature{background:#fff;border-radius:22px;padding:22px;box-shadow:0 8px 24px rgba(15,23,42,.06)}.feature b{display:block;margin-bottom:6px}.feature span{font-size:14px;color:var(--muted)}
.layout{display:grid;grid-template-columns:250px 1fr;gap:28px;margin-bottom:50px}.sidebar{background:#fff;border-radius:24px;padding:20px;height:max-content;box-shadow:0 8px 24px rgba(15,23,42,.06)}.sidebar h3{margin:0 0 14px}.cat{display:flex;justify-content:space-between;width:100%;border:0;background:#f1f5f9;border-radius:16px;margin:8px 0;padding:13px 14px;cursor:pointer;text-align:left;font-weight:700}.cat.active,.cat:hover{background:var(--orange);color:#fff}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:16px}.section-head h2{font-size:32px;margin:0}.section-head p{color:var(--orange);font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin:0 0 4px;font-size:13px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.06);transition:.25s}.card:hover{transform:translateY(-4px);box-shadow:0 16px 36px rgba(15,23,42,.12)}
.media{height:240px;background:#e5e7eb;position:relative}.media img,.media video{width:100%;height:100%;object-fit:cover;display:block}.media.contain-media{background:#fff}.media.contain-media img{object-fit:contain;background:#fff;padding:10px}.thumbs{display:flex;gap:6px;padding:10px;overflow:auto;background:#fff}.thumb{width:54px;height:48px;border:2px solid transparent;border-radius:10px;overflow:hidden;cursor:pointer;flex:0 0 auto}.thumb.active{border-color:var(--orange)}.thumb img,.thumb video{width:100%;height:100%;object-fit:cover}
.card-body{padding:18px}.card h3{font-size:17px;margin:0 0 8px;line-height:1.35}.desc{font-size:14px;color:var(--muted);line-height:1.55;min-height:44px}.meta{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #eef2f7;margin-top:14px;padding-top:14px}.price{color:var(--orange);font-weight:900}.label{font-size:12px;color:#94a3b8}.edit-product{margin-top:14px;width:100%}
.about{background:#fff;padding:54px 0}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact-box{background:#f8fafc;border-radius:24px;padding:24px}.contact-box a{display:block;margin:12px 0;color:#334155}.footer{background:#0f172a;color:#fff;padding:28px 0}.footer .container{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.social a{display:inline-flex;width:46px;height:46px;border-radius:999px;background:rgba(255,255,255,.08);align-items:center;justify-content:center;margin-left:10px;overflow:hidden;transition:.2s}.social a:hover{transform:translateY(-2px);background:rgba(255,255,255,.14)}.social a img{width:34px;height:34px;object-fit:contain;display:block}
.editor{position:fixed;right:18px;top:88px;width:390px;max-height:calc(100vh - 110px);overflow:auto;background:rgba(255,255,255,.98);border:1px solid #e5e7eb;border-radius:26px;box-shadow:0 30px 80px rgba(15,23,42,.28);z-index:100;padding:18px}.editor h2{margin:0 0 12px}.panel{background:#f8fafc;border-radius:18px;padding:14px;margin-bottom:14px}.field{display:block;margin:10px 0}.field span{display:block;font-size:12px;color:#475569;font-weight:800;margin-bottom:5px}.field input,.field textarea,.field select{width:100%;border:1px solid #e2e8f0;border-radius:12px;padding:10px;font-size:14px;background:#fff}.field textarea{min-height:72px}.upload{display:block;border:2px dashed #cbd5e1;border-radius:16px;padding:14px;text-align:center;cursor:pointer;background:#fff;color:#475569}.upload input{display:none}.mini-media{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.mini{position:relative;height:60px;border-radius:10px;overflow:hidden;background:#e2e8f0}.mini img,.mini video{width:100%;height:100%;object-fit:cover}.mini button{position:absolute;right:2px;top:2px;border:0;border-radius:999px;background:#fff;cursor:pointer}.hide{display:none!important}
@media(max-width:900px){.hero .container,.layout,.about-grid{grid-template-columns:1fr}.grid,.features{grid-template-columns:repeat(2,1fr)}.search{display:none}.hero h1{font-size:38px}.editor{left:10px;right:10px;width:auto}.hero-media video,.hero-media img{height:300px}}
@media(max-width:560px){.grid,.features,.stats{grid-template-columns:1fr}.brand-sub{display:none}.brand-title{font-size:18px}.brand-cn{font-size:13px}.hero h1{font-size:32px}.topbar{display:none}.header-social-left{display:none}}

.price-link{display:inline-block;text-decoration:underline;text-underline-offset:3px}.price-link:hover{color:#16a34a}
.hero-video-gallery{background:#000}.hero-video-thumbs{display:flex;gap:8px;padding:10px;background:rgba(15,23,42,.92);overflow:auto}.hero-video-thumb{border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff;border-radius:999px;padding:7px 12px;font-weight:800;cursor:pointer;white-space:nowrap}.hero-video-thumb.active,.hero-video-thumb:hover{background:var(--orange);border-color:var(--orange)}
.header-trust{display:flex;flex-direction:column;gap:5px;min-width:330px;margin-left:8px;font-size:13px;line-height:1.15;align-self:center}.trust-badges,.trust-response{display:grid;grid-template-columns:155px 165px;column-gap:8px;align-items:center;white-space:nowrap}.trust-pill{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 10px;font-weight:800;background:#fff}.trust-pill.verified{border:1px solid #16a34a;color:#078126}.trust-pill.assurance{border:1px solid #60a5fa;color:#2563eb}.trust-response{color:#0f172a}.trust-response span{display:block;text-align:left}.trust-response b{font-weight:900}
@media(max-width:1100px){.header-trust{display:none}.header-inner{gap:12px}.search{flex:0 0 340px;max-width:340px;min-width:340px}.header-social-left{min-width:auto}}

/* Public version: hide editing controls */
#editToggle,#addProduct,.edit-product{display:none!important}
.lang-toggle{min-width:auto;padding:10px 18px;font-weight:900;color:#fff;white-space:nowrap;background:#12356b;border:1px solid #12356b;box-shadow:0 4px 12px rgba(18,53,107,.18)}
@media(max-width:560px){.lang-toggle{padding:8px 12px;min-width:auto;font-size:12px}.actions{gap:6px}}
.lang-toggle:hover{background:#0f2c59;border-color:#0f2c59;color:#fff}

/* Responsive layout fixes for laptop, tablet and mobile */
html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
img, video { max-width: 100%; }
.container { width: 100%; }
.header-inner { flex-wrap: wrap; }
.search { flex: 1 1 260px; min-width: 220px; max-width: 420px; }
.brand { flex: 1 1 300px; min-width: 260px; }
.header-social-left { flex: 0 0 auto; }
.actions { flex: 0 0 auto; }
.header-trust { flex: 0 1 330px; }

@media (max-width: 1280px) {
  .header .container { max-width: 1180px; }
  .header-inner { gap: 12px; padding: 12px 16px; }
  .brand { min-width: 280px; flex-basis: 310px; }
  .brand-title { font-size: 20px; }
  .brand-cn { font-size: 16px; }
  .brand-sub { font-size: 13px; }
  .search { flex: 1 1 260px; min-width: 220px; max-width: 360px; }
  .header-trust { min-width: 300px; font-size: 12px; }
  .trust-badges,.trust-response { grid-template-columns: 145px 155px; }
  .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1024px) {
  .topbar .container { justify-content: center; text-align: center; }
  .header-inner { justify-content: center; }
  .header-social-left { order: 1; }
  .brand { order: 2; flex: 1 1 360px; min-width: 300px; }
  .search { order: 4; flex: 1 1 100%; max-width: 100%; min-width: 0; }
  .actions { order: 3; }
  .header-trust { order: 5; display: flex; flex-basis: 100%; max-width: 420px; margin-left: 0; }
  .features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .layout { grid-template-columns: 220px 1fr; gap: 18px; }
  .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .media { height: 220px; }
}

@media (max-width: 768px) {
  .container { padding: 0 14px; }
  .topbar { display: none; }
  .header { position: sticky; }
  .header-inner { justify-content: flex-start; align-items: center; padding: 12px 14px; }
  .header-social-left { display: flex; order: 1; width: 100%; justify-content: center; }
  .brand { order: 2; width: 100%; flex-basis: 100%; min-width: 0; justify-content: center; text-align: center; }
  .brand-title { font-size: 22px; }
  .brand-cn { font-size: 17px; }
  .brand-sub { display: block; font-size: 13px; }
  .search { order: 3; display: block; flex-basis: 100%; min-width: 0; max-width: 100%; }
  .search input { padding: 12px 16px; font-size: 14px; }
  .actions { order: 4; width: 100%; justify-content: center; }
  .header-trust { order: 5; display: flex; width: 100%; max-width: 360px; min-width: 0; margin: 0 auto; }
  .trust-badges,.trust-response { grid-template-columns: 1fr 1fr; width: 100%; column-gap: 6px; }
  .trust-pill { padding: 4px 8px; font-size: 12px; }
  .trust-response { font-size: 12px; }
  .hero .container { grid-template-columns: 1fr; padding-top: 34px; padding-bottom: 34px; }
  .hero h1 { font-size: 36px; }
  .hero p { font-size: 16px; }
  .hero-media video,.hero-media img { height: 280px; }
  .features { grid-template-columns: 1fr; margin: 18px 0; }
  .layout { grid-template-columns: 1fr; }
  .sidebar { position: static; }
  .grid { grid-template-columns: 1fr; }
  .media { height: 260px; }
  .section-head { align-items: flex-start; }
  .section-head h2 { font-size: 28px; }
  .about-grid { grid-template-columns: 1fr; }
  .footer .container { text-align: center; justify-content: center; }
}

@media (max-width: 480px) {
  .container { padding: 0 12px; }
  .header-inner { gap: 10px; }
  .header-social-left { gap: 18px; }
  .header-social-btn { width: 32px; height: 32px; }
  .header-social-btn img { width: 28px; height: 28px; }
  .brand-title { font-size: 20px; }
  .brand-cn { font-size: 15px; }
  .brand-sub { font-size: 12px; }
  .btn { padding: 10px 14px; font-size: 14px; }
  .lang-toggle { padding: 10px 14px; }
  .hero h1 { font-size: 30px; }
  .hero-media video,.hero-media img { height: 220px; }
  .stats { grid-template-columns: 1fr; }
  .media { height: 230px; }
  .card-body { padding: 16px; }
  .meta { align-items: flex-start; }
  .thumbs { padding: 8px; }
}

/* Final mobile/tablet fix: prevent horizontal cut-off in Facebook/iPhone webviews */
@media (max-width: 920px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  body > *, .header, .hero, main, .about, .footer {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  .container, .header .container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
  .header-inner {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 12px 14px !important;
  }
  .header-social-left,
  .search,
  .header-trust {
    display: none !important;
  }
  .brand {
    grid-column: 1 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: 100% !important;
    flex: none !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }
  .brand-text {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .brand-title {
    font-size: 20px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
  }
  .brand-cn {
    font-size: 15px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
  }
  .brand-sub {
    display: none !important;
  }
  .actions {
    grid-column: 2 !important;
    width: auto !important;
    flex: none !important;
    justify-content: flex-end !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }
  .lang-toggle {
    padding: 8px 12px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }
  #waBtn {
    padding: 10px 14px !important;
    font-size: 15px !important;
    white-space: nowrap !important;
  }
  .hero .container {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    padding-top: 34px !important;
    padding-bottom: 34px !important;
  }
  .hero h1 {
    font-size: clamp(30px, 8vw, 42px) !important;
    line-height: 1.08 !important;
    max-width: 100% !important;
  }
  .hero p {
    font-size: 16px !important;
    line-height: 1.65 !important;
    max-width: 100% !important;
  }
  .hero-buttons {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
  }
  .hero-buttons .btn {
    flex: 0 1 auto !important;
  }
  .stats {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .stat {
    width: 100% !important;
  }
  .hero-media,
  .hero-video-gallery,
  .hero-media video,
  .hero-media img {
    width: 100% !important;
    max-width: 100% !important;
  }
  .hero-media video,
  .hero-media img {
    height: auto !important;
    min-height: 220px !important;
    max-height: 360px !important;
    object-fit: cover !important;
  }
  .features,
  .layout,
  .about-grid,
  .grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .sidebar,
  .card,
  .feature,
  .contact-box {
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 430px) {
  .header-inner {
    grid-template-columns: 1fr !important;
  }
  .actions {
    grid-column: 1 !important;
    width: 100% !important;
    justify-content: flex-start !important;
  }
  .brand-title { font-size: 19px !important; }
  .brand-cn { font-size: 14px !important; }
  #waBtn { font-size: 14px !important; padding: 9px 13px !important; }
  .lang-toggle { font-size: 12px !important; padding: 8px 11px !important; }
}

/* Facebook / Instagram in-app browser mobile fix */
@media (max-width: 920px) {
  .header-inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: start !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .brand {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .actions {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    overflow: hidden !important;
  }
  .actions .btn,
  .actions a,
  .actions button {
    flex: 0 0 auto !important;
    max-width: calc(50vw - 22px) !important;
  }
  .lang-toggle {
    max-width: 120px !important;
  }
  #waBtn {
    max-width: 150px !important;
  }
  .hero,
  .hero .container,
  .hero > .container > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
}

@media (max-width: 480px) {
  .header-inner {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .actions {
    gap: 8px !important;
  }
  .lang-toggle {
    font-size: 13px !important;
    padding: 8px 11px !important;
  }
  #waBtn {
    font-size: 14px !important;
    padding: 9px 13px !important;
  }
}


/* Strong final mobile header fix for Facebook / Instagram in-app browsers */
@media (max-width: 1200px) {
  html.mobile-safe-header, html.mobile-safe-header body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }
  html.mobile-safe-header body {
    position: relative !important;
  }
  html.mobile-safe-header .topbar,
  html.mobile-safe-header .header-social-left,
  html.mobile-safe-header .search,
  html.mobile-safe-header .header-trust {
    display: none !important;
  }
  html.mobile-safe-header .header,
  html.mobile-safe-header .header .container,
  html.mobile-safe-header .header-inner {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }
  html.mobile-safe-header .header-inner {
    display: block !important;
    padding: 16px 18px 12px 18px !important;
    box-sizing: border-box !important;
  }
  html.mobile-safe-header .brand {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
  }
  html.mobile-safe-header .brand-text {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  html.mobile-safe-header .brand-title {
    display: block !important;
    font-size: 20px !important;
    line-height: 1.14 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    max-width: 100% !important;
  }
  html.mobile-safe-header .brand-cn {
    display: block !important;
    font-size: 15px !important;
    line-height: 1.18 !important;
    margin-top: 4px !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    max-width: 100% !important;
  }
  html.mobile-safe-header .brand-sub {
    display: none !important;
  }
  html.mobile-safe-header .actions {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 12px 0 0 0 !important;
    padding: 0 !important;
    gap: 10px !important;
    overflow: visible !important;
    transform: none !important;
  }
  html.mobile-safe-header .actions .btn,
  html.mobile-safe-header .actions a,
  html.mobile-safe-header .actions button {
    position: static !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    transform: none !important;
  }
  html.mobile-safe-header .lang-toggle {
    font-size: 13px !important;
    line-height: 1 !important;
    padding: 9px 14px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
  html.mobile-safe-header #waBtn {
    font-size: 15px !important;
    line-height: 1 !important;
    padding: 11px 18px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }
  html.mobile-safe-header .hero,
  html.mobile-safe-header main,
  html.mobile-safe-header .about,
  html.mobile-safe-header .footer,
  html.mobile-safe-header .hero .container,
  html.mobile-safe-header main.container,
  html.mobile-safe-header .about .container,
  html.mobile-safe-header .footer .container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
  }
}

/* Emergency fix for Facebook / Instagram in-app browsers on iPhone/Android.
   Uses device-width and JS class so it works even when the in-app browser reports a strange viewport. */
@media screen and (max-device-width: 920px), screen and (max-width: 920px) {
  html, body {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }
  .topbar,
  .header-social-left,
  .search,
  .header-trust,
  .brand-sub {
    display: none !important;
  }
  .header,
  .header .container,
  .header-inner {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }
  .header-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 16px 18px 14px 18px !important;
  }
  .brand {
    display: block !important;
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    text-align: left !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .brand-text {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .brand-title {
    display: block !important;
    font-size: 20px !important;
    line-height: 1.16 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }
  .brand-cn {
    display: block !important;
    font-size: 15px !important;
    line-height: 1.16 !important;
    margin-top: 4px !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }
  .actions {
    position: static !important;
    order: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 10px !important;
    transform: none !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    overflow: visible !important;
  }
  .actions .btn,
  .actions a,
  .actions button,
  .lang-toggle,
  #waBtn {
    position: static !important;
    flex: 0 0 auto !important;
    transform: none !important;
    white-space: nowrap !important;
    max-width: calc(100vw - 36px) !important;
  }
  .lang-toggle {
    font-size: 13px !important;
    padding: 9px 14px !important;
    line-height: 1 !important;
  }
  #waBtn {
    font-size: 15px !important;
    padding: 11px 18px !important;
    line-height: 1 !important;
  }
  .hero,
  .hero .container,
  main,
  main.container,
  .about,
  .footer {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }
}

html.force-mobile-header,
html.force-mobile-header body {
  width: 100vw !important;
  max-width: 100vw !important;
  overflow-x: hidden !important;
}
html.force-mobile-header .topbar,
html.force-mobile-header .header-social-left,
html.force-mobile-header .search,
html.force-mobile-header .header-trust,
html.force-mobile-header .brand-sub {
  display: none !important;
}
html.force-mobile-header .header,
html.force-mobile-header .header .container,
html.force-mobile-header .header-inner {
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}
html.force-mobile-header .header-inner {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 16px 18px 14px 18px !important;
}
html.force-mobile-header .brand {
  display: block !important;
  order: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
  text-align: left !important;
}
html.force-mobile-header .actions {
  position: static !important;
  order: 2 !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 10px !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
}
html.force-mobile-header .lang-toggle {
  font-size: 13px !important;
  padding: 9px 14px !important;
}
html.force-mobile-header #waBtn {
  font-size: 15px !important;
  padding: 11px 18px !important;
}


/* Mobile in-app header: show Facebook/Instagram icons and trust badges safely */
@media screen and (max-device-width: 920px), screen and (max-width: 920px) {
  .header-social-left,
  html.mobile-safe-header .header-social-left,
  html.force-mobile-header .header-social-left {
    display: flex !important;
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 2px 0 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .header-social-btn,
  html.mobile-safe-header .header-social-btn,
  html.force-mobile-header .header-social-btn {
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    flex: 0 0 32px !important;
  }
  .header-social-btn img,
  html.mobile-safe-header .header-social-btn img,
  html.force-mobile-header .header-social-btn img {
    width: 30px !important;
    height: 30px !important;
    object-fit: contain !important;
  }
  .actions,
  html.mobile-safe-header .actions,
  html.force-mobile-header .actions {
    order: 3 !important;
  }
  .header-trust,
  html.mobile-safe-header .header-trust,
  html.force-mobile-header .header-trust {
    display: flex !important;
    order: 4 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    gap: 5px !important;
    overflow: hidden !important;
  }
  .trust-badges,
  .trust-response,
  html.mobile-safe-header .trust-badges,
  html.mobile-safe-header .trust-response,
  html.force-mobile-header .trust-badges,
  html.force-mobile-header .trust-response {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 6px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }
  .trust-pill,
  html.mobile-safe-header .trust-pill,
  html.force-mobile-header .trust-pill {
    width: 100% !important;
    max-width: 100% !important;
    padding: 3px 6px !important;
    font-size: 12px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    justify-content: center !important;
  }
  .trust-response span,
  html.mobile-safe-header .trust-response span,
  html.force-mobile-header .trust-response span {
    font-size: 11px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}


/* Fix mobile Facebook/Instagram white video thumbnails */
.media video { background:#000; }
.video-preview{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#111827;background-size:cover;background-position:center;position:relative;overflow:hidden;}
.video-preview::before{content:"";position:absolute;inset:0;background:rgba(15,23,42,.18);}
.video-play{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:999px;background:rgba(255,255,255,.92);color:#111827;font-size:13px;line-height:1;box-shadow:0 4px 12px rgba(0,0,0,.2);padding-left:2px;}
.media .main-video-preview .video-play{width:64px;height:64px;font-size:30px;}
.thumb .video-preview{border-radius:8px;background-color:#0f172a;}
.thumb .video-play{width:24px;height:24px;font-size:11px;}
@media (max-width: 768px){
  .thumb .video-preview{background-color:#111827!important;}
  .thumb .video-play{display:inline-flex!important;}
}


/* Product videos autoplay in product list */
.product-thumb-video{width:100%;height:100%;object-fit:cover;display:block;background:#000;border-radius:8px;}
.product-main-video{width:100%;height:100%;object-fit:cover;display:block;background:#000;}
.media.contain-media .product-main-video{object-fit:contain;background:#000;}
@media (max-width: 768px){
  .product-thumb-video{background:#000;}
}


/* Alibaba-style product detail modal */
.product-title-link{appearance:none;border:0;background:transparent;padding:0;margin:0;text-align:left;font:inherit;font-weight:900;color:#111827;cursor:pointer;line-height:1.35}.product-title-link:hover{color:var(--orange);text-decoration:underline;text-underline-offset:4px}.modal-open{overflow:hidden}.product-detail-modal{position:fixed;inset:0;z-index:9999}.product-detail-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(3px)}.product-detail-panel{position:relative;margin:28px auto;width:min(1180px,calc(100% - 28px));max-height:calc(100vh - 56px);overflow:auto;background:#fff;border-radius:24px;box-shadow:0 30px 90px rgba(0,0,0,.35);padding:24px}.product-detail-close{position:sticky;top:0;float:right;z-index:2;width:42px;height:42px;border:0;border-radius:50%;background:#0f172a;color:white;font-size:28px;line-height:1;cursor:pointer}.product-detail-grid{display:grid;grid-template-columns:minmax(300px,1.05fr) minmax(320px,.95fr);gap:24px;clear:both}.detail-gallery,.detail-info,.detail-section{background:#fff;border:1px solid #eef2f7;border-radius:22px;padding:18px}.detail-main{height:520px;background:#f8fafc;border-radius:18px;display:flex;align-items:center;justify-content:center;overflow:hidden}.detail-main img,.detail-main video{width:100%;height:100%;object-fit:contain;background:#fff}.detail-thumbs{display:flex;gap:10px;margin-top:14px;overflow:auto;padding-bottom:4px}.detail-thumb{position:relative;width:82px;height:72px;border:2px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;padding:0;cursor:pointer;flex:0 0 auto}.detail-thumb.active,.detail-thumb:hover{border-color:var(--orange)}.detail-thumb img,.detail-thumb video{width:100%;height:100%;object-fit:cover}.detail-thumb span{position:absolute;inset:auto 6px 6px auto;background:rgba(15,23,42,.78);color:#fff;border-radius:50%;font-size:11px;width:22px;height:22px;display:flex;align-items:center;justify-content:center}.detail-badges{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.detail-badges span{border:1px solid #fed7aa;background:#fff7ed;color:#c2410c;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900}.detail-info h1{font-size:30px;line-height:1.2;margin:0 0 14px}.detail-desc{color:#64748b;line-height:1.7}.detail-price-box{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#fff7ed;border:1px solid #fed7aa;border-radius:18px;padding:16px;margin:18px 0}.detail-price-box small{display:block;color:#9a3412;margin-bottom:6px}.detail-price-box b{font-size:22px;color:#ea580c}.detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:18px}.detail-supplier{display:grid;gap:8px;color:#475569;background:#f8fafc;border-radius:18px;padding:16px}.detail-supplier b{color:#0f172a}.detail-section{grid-column:1/-1}.detail-section h2{margin:0 0 12px;font-size:22px}.detail-section p{color:#475569;line-height:1.8}.detail-specs{width:100%;border-collapse:collapse}.detail-specs th,.detail-specs td{border:1px solid #e5e7eb;padding:12px;text-align:left}.detail-specs th{width:220px;background:#f8fafc;color:#334155}.detail-no-media{color:#94a3b8;padding:40px;text-align:center}
@media(max-width:800px){.product-detail-panel{width:calc(100% - 16px);margin:8px auto;max-height:calc(100vh - 16px);padding:14px;border-radius:18px}.product-detail-grid{grid-template-columns:1fr;gap:14px}.detail-main{height:360px}.detail-info h1{font-size:24px}.detail-section{grid-column:auto}.detail-price-box{grid-template-columns:1fr}.detail-specs th{width:42%}.product-detail-close{width:38px;height:38px;font-size:24px}}

/* Mobile optimization for product detail modal */
.product-detail-panel,
.product-detail-panel *{box-sizing:border-box;}
.product-detail-grid,
.detail-gallery,
.detail-info,
.detail-section{min-width:0;}
.detail-info h1,
.detail-desc,
.detail-section p,
.detail-supplier span{overflow-wrap:anywhere;word-break:break-word;}
.product-detail-modal{overflow:hidden;}
.product-detail-panel{-webkit-overflow-scrolling:touch;}

@media (max-width: 640px){
  .product-detail-modal{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;}
  .product-detail-backdrop{display:none;}
  .product-detail-panel{
    position:absolute;
    inset:0;
    width:100vw;
    max-width:100vw;
    height:100vh;
    height:100dvh;
    max-height:none;
    margin:0;
    border-radius:0;
    padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(18px + env(safe-area-inset-bottom, 0px));
    overflow-y:auto;
    overflow-x:hidden;
    box-shadow:none;
  }
  .product-detail-close{
    position:sticky;
    top:calc(8px + env(safe-area-inset-top, 0px));
    float:none;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-left:auto;
    margin-bottom:8px;
    width:40px;
    height:40px;
    min-width:40px;
    border-radius:999px;
    font-size:26px;
    line-height:1;
    z-index:20;
    box-shadow:0 8px 22px rgba(15,23,42,.22);
  }
  .product-detail-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    gap:12px;
    clear:none;
    width:100%;
  }
  .detail-gallery,
  .detail-info,
  .detail-section{
    width:100%;
    border-radius:16px;
    padding:12px;
  }
  .detail-main{
    height:min(64vh, 380px);
    min-height:260px;
    border-radius:14px;
  }
  .detail-main img,
  .detail-main video{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
  }
  .detail-thumbs{
    gap:8px;
    margin-top:10px;
    padding:0 0 8px;
    -webkit-overflow-scrolling:touch;
  }
  .detail-thumb{
    width:66px;
    height:58px;
    border-radius:10px;
    flex:0 0 66px;
  }
  .detail-badges{
    gap:6px;
    margin-bottom:10px;
  }
  .detail-badges span{
    font-size:11px;
    padding:5px 8px;
  }
  .detail-info h1{
    font-size:21px;
    line-height:1.25;
    margin-bottom:10px;
  }
  .detail-desc{
    font-size:14px;
    line-height:1.55;
    margin:0;
  }
  .detail-price-box{
    grid-template-columns:1fr 1fr;
    gap:8px;
    padding:12px;
    margin:12px 0;
    border-radius:14px;
  }
  .detail-price-box b{
    font-size:18px;
  }
  .detail-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    margin-bottom:12px;
  }
  .detail-actions .btn{
    width:100%;
    justify-content:center;
    text-align:center;
    min-height:44px;
  }
  .detail-supplier{
    padding:12px;
    border-radius:14px;
    font-size:14px;
  }
  .detail-section h2{
    font-size:18px;
    margin-bottom:10px;
  }
  .detail-section p{
    font-size:14px;
    line-height:1.65;
    margin:0;
  }
  .detail-specs,
  .detail-specs tbody,
  .detail-specs tr,
  .detail-specs th,
  .detail-specs td{
    display:block;
    width:100% !important;
  }
  .detail-specs tr{
    border:1px solid #e5e7eb;
    border-radius:12px;
    overflow:hidden;
    margin-bottom:8px;
  }
  .detail-specs th,
  .detail-specs td{
    border:0;
    padding:9px 10px;
  }
  .detail-specs th{
    background:#f8fafc;
    font-size:12px;
  }
  .detail-specs td{
    font-size:14px;
  }
}

@media (max-width: 380px){
  .detail-main{height:300px;min-height:230px;}
  .detail-price-box{grid-template-columns:1fr;}
}

/* Facebook / Instagram in-app browser product detail modal fix */
:root{
  --app-height:100vh;
  --app-width:100vw;
}
html.product-modal-open,
html.product-modal-open body{
  overscroll-behavior:none;
}
html.inapp-browser .product-detail-modal:not(.hide){
  position:fixed !important;
  top:0 !important;
  right:0 !important;
  bottom:auto !important;
  left:0 !important;
  width:var(--app-width, 100vw) !important;
  max-width:100% !important;
  height:var(--app-height, 100vh) !important;
  min-height:var(--app-height, 100vh) !important;
  overflow:hidden !important;
  z-index:2147483647 !important;
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  background:#fff;
}
html.inapp-browser .product-detail-modal:not(.hide) .product-detail-backdrop{
  display:none !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .product-detail-panel{
  position:absolute !important;
  top:0 !important;
  right:0 !important;
  bottom:auto !important;
  left:0 !important;
  width:100% !important;
  max-width:100% !important;
  height:var(--app-height, 100vh) !important;
  min-height:var(--app-height, 100vh) !important;
  max-height:var(--app-height, 100vh) !important;
  margin:0 !important;
  border-radius:0 !important;
  padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(20px + env(safe-area-inset-bottom, 0px)) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  box-shadow:none !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .product-detail-close{
  position:sticky !important;
  top:calc(8px + env(safe-area-inset-top, 0px)) !important;
  float:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-left:auto !important;
  margin-bottom:8px !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  border-radius:999px !important;
  z-index:30 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.22) !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .product-detail-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) !important;
  gap:12px !important;
  clear:none !important;
  width:100% !important;
  max-width:100% !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-gallery,
html.inapp-browser .product-detail-modal:not(.hide) .detail-info,
html.inapp-browser .product-detail-modal:not(.hide) .detail-section{
  width:100% !important;
  min-width:0 !important;
  border-radius:16px !important;
  padding:12px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-main{
  height:min(58vh, 360px) !important;
  min-height:230px !important;
  border-radius:14px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-main img,
html.inapp-browser .product-detail-modal:not(.hide) .detail-main video{
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-thumbs{
  gap:8px !important;
  margin-top:10px !important;
  padding-bottom:8px !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-thumb{
  width:66px !important;
  height:58px !important;
  flex:0 0 66px !important;
  border-radius:10px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-info h1{
  font-size:21px !important;
  line-height:1.25 !important;
  margin-bottom:10px !important;
  overflow-wrap:anywhere !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-desc,
html.inapp-browser .product-detail-modal:not(.hide) .detail-section p,
html.inapp-browser .product-detail-modal:not(.hide) .detail-supplier span{
  font-size:14px !important;
  line-height:1.6 !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-price-box{
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  padding:12px !important;
  margin:12px 0 !important;
  border-radius:14px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-price-box b{
  font-size:18px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-actions{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-actions .btn{
  width:100% !important;
  justify-content:center !important;
  text-align:center !important;
  min-height:44px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs,
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs tbody,
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs tr,
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs th,
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs td{
  display:block !important;
  width:100% !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs tr{
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  overflow:hidden !important;
  margin-bottom:8px !important;
}
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs th,
html.inapp-browser .product-detail-modal:not(.hide) .detail-specs td{
  border:0 !important;
  padding:9px 10px !important;
}
@media (max-width:380px){
  html.inapp-browser .product-detail-modal:not(.hide) .detail-price-box{grid-template-columns:1fr !important;}
  html.inapp-browser .product-detail-modal:not(.hide) .detail-main{height:300px !important;min-height:220px !important;}
}


/* Facebook in-app browser stronger modal compatibility patch */
html.fb-browser,
html.fb-browser body{
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}
html.fb-browser.product-modal-open,
html.fb-browser.product-modal-open body{
  overflow:hidden !important;
  overscroll-behavior:none !important;
  touch-action:none;
}
html.fb-browser .product-detail-modal:not(.hide){
  display:block !important;
  z-index:2147483647 !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:hidden !important;
  background:#fff !important;
  transform:none !important;
  -webkit-transform:none !important;
  contain:layout paint;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-panel{
  display:block !important;
  margin:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  overflow-x:hidden !important;
  overflow-y:scroll !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  padding:12px 12px 24px 12px !important;
  background:#fff !important;
  transform:none !important;
  -webkit-transform:none !important;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-close{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:8px !important;
  z-index:2147483647 !important;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-grid{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-gallery,
html.fb-browser .product-detail-modal:not(.hide) .detail-info,
html.fb-browser .product-detail-modal:not(.hide) .detail-section{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 0 12px 0 !important;
  box-sizing:border-box !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-main{
  width:100% !important;
  height:320px !important;
  min-height:220px !important;
  max-height:45vh !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-main img,
html.fb-browser .product-detail-modal:not(.hide) .detail-main video{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
@media (max-width:420px){
  html.fb-browser .product-detail-modal:not(.hide) .detail-main{height:285px !important;}
}

/* Facebook in-app browser emergency width clamp v2
   Fixes FB WebView reporting double/physical viewport width, which made the modal content wider than the phone. */
html.fb-browser .product-detail-modal:not(.hide),
html.fb-browser .product-detail-modal:not(.hide) *{
  max-width:100% !important;
  box-sizing:border-box !important;
}
html.fb-browser .product-detail-modal:not(.hide){
  width:var(--app-width, 100vw) !important;
  max-width:var(--app-width, 100vw) !important;
  min-width:0 !important;
  left:0 !important;
  right:auto !important;
  overflow:hidden !important;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-panel{
  width:var(--app-width, 100vw) !important;
  max-width:var(--app-width, 100vw) !important;
  min-width:0 !important;
  padding-left:12px !important;
  padding-right:12px !important;
  overflow-x:hidden !important;
}
html.fb-browser .product-detail-modal:not(.hide) #productDetailContent,
html.fb-browser .product-detail-modal:not(.hide) .product-detail-grid,
html.fb-browser .product-detail-modal:not(.hide) .detail-gallery,
html.fb-browser .product-detail-modal:not(.hide) .detail-info,
html.fb-browser .product-detail-modal:not(.hide) .detail-section,
html.fb-browser .product-detail-modal:not(.hide) .detail-price-box,
html.fb-browser .product-detail-modal:not(.hide) .detail-supplier{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:hidden !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-desc,
html.fb-browser .product-detail-modal:not(.hide) .detail-info h1,
html.fb-browser .product-detail-modal:not(.hide) .detail-section p,
html.fb-browser .product-detail-modal:not(.hide) .detail-supplier span,
html.fb-browser .product-detail-modal:not(.hide) .detail-price-box b,
html.fb-browser .product-detail-modal:not(.hide) .detail-price-box small{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  max-width:100% !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-thumbs{
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
}
@media (max-width:520px){
  html.fb-browser .product-detail-modal:not(.hide) .detail-price-box{
    grid-template-columns:1fr !important;
  }
  html.fb-browser .product-detail-modal:not(.hide) .detail-info h1{
    font-size:22px !important;
  }
}


/* Facebook in-app browser: use real product detail page instead of fixed modal */
html.product-page-mode,
html.product-page-mode body{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  overflow-x:hidden !important;
  background:#fff !important;
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}
.fb-product-page,
.fb-product-page *{
  box-sizing:border-box !important;
  max-width:100% !important;
}
.fb-product-page{
  width:100% !important;
  max-width:100vw !important;
  min-height:100vh !important;
  padding:12px 12px 28px !important;
  background:#fff !important;
  overflow-x:hidden !important;
}
.fb-product-page-top{
  position:sticky;
  top:0;
  z-index:50;
  display:flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:8px 0;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(8px);
  color:#64748b;
  font-size:13px;
}
.fb-product-page-back{
  border:1px solid #e5e7eb;
  background:#fff;
  border-radius:999px;
  padding:8px 14px;
  color:#0f172a;
  font-weight:900;
  font-size:15px;
}
.fb-product-page .product-detail-grid{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.fb-product-page .detail-gallery,
.fb-product-page .detail-info,
.fb-product-page .detail-section{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 0 14px !important;
  padding:14px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}
.fb-product-page .detail-main{
  width:100% !important;
  height:360px !important;
  min-height:260px !important;
  max-height:48vh !important;
}
.fb-product-page .detail-main img,
.fb-product-page .detail-main video{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
.fb-product-page .detail-thumbs{
  width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  padding-bottom:8px !important;
}
.fb-product-page .detail-thumb{
  flex:0 0 82px !important;
}
.fb-product-page .detail-badges{
  flex-wrap:wrap !important;
}
.fb-product-page .detail-info h1{
  font-size:24px !important;
  line-height:1.2 !important;
  overflow-wrap:anywhere !important;
}
.fb-product-page .detail-desc,
.fb-product-page .detail-section p,
.fb-product-page .detail-supplier span,
.fb-product-page .detail-price-box b,
.fb-product-page .detail-price-box small{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
.fb-product-page .detail-price-box{
  grid-template-columns:1fr 1fr !important;
  width:100% !important;
  overflow:hidden !important;
}
.fb-product-page .detail-actions{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}
.fb-product-page .detail-actions .btn{
  width:100% !important;
  justify-content:center !important;
  min-height:52px !important;
}
.fb-product-page .detail-specs,
.fb-product-page .detail-specs tbody,
.fb-product-page .detail-specs tr,
.fb-product-page .detail-specs th,
.fb-product-page .detail-specs td{
  display:block !important;
  width:100% !important;
}
.fb-product-page .detail-specs tr{
  margin:0 0 10px !important;
  border:1px solid #e5e7eb !important;
  border-radius:14px !important;
  overflow:hidden !important;
}
.fb-product-page .detail-specs th,
.fb-product-page .detail-specs td{
  border:0 !important;
  padding:10px 12px !important;
}
@media (max-width:430px){
  .fb-product-page{padding:10px 10px 24px !important;}
  .fb-product-page .detail-main{height:330px !important;}
  .fb-product-page .detail-info h1{font-size:22px !important;}
}
@media (max-width:380px){
  .fb-product-page .detail-price-box{grid-template-columns:1fr !important;}
  .fb-product-page .detail-main{height:300px !important;}
}


/* Facebook product detail page final safe-width patch
   FB in-app browser sometimes reports physical-pixel viewport width. This page uses --fb-page-width from JS. */
html.fb-browser.product-page-mode,
html.fb-browser.product-page-mode body{
  width:var(--fb-page-width, var(--app-width, 100%)) !important;
  max-width:var(--fb-page-width, var(--app-width, 100%)) !important;
  min-width:0 !important;
  overflow-x:hidden !important;
  position:static !important;
  margin:0 auto !important;
}
html.fb-browser.product-page-mode *{
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
html.fb-browser.product-page-mode .fb-product-page{
  width:var(--fb-page-width, var(--app-width, 100%)) !important;
  max-width:var(--fb-page-width, var(--app-width, 100%)) !important;
  min-width:0 !important;
  margin:0 auto !important;
  padding:10px 10px calc(28px + env(safe-area-inset-bottom, 0px)) !important;
  overflow-x:hidden !important;
  background:#fff !important;
}
html.fb-browser.product-page-mode .fb-product-page .product-detail-grid,
html.fb-browser.product-page-mode .fb-product-page .detail-gallery,
html.fb-browser.product-page-mode .fb-product-page .detail-info,
html.fb-browser.product-page-mode .fb-product-page .detail-section,
html.fb-browser.product-page-mode .fb-product-page .detail-supplier,
html.fb-browser.product-page-mode .fb-product-page .detail-price-box{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow-x:hidden !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-gallery,
html.fb-browser.product-page-mode .fb-product-page .detail-info,
html.fb-browser.product-page-mode .fb-product-page .detail-section{
  padding:12px !important;
  margin:0 0 12px !important;
  border-radius:16px !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-price-box{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
  padding:14px !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-actions{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-actions .btn{
  width:100% !important;
  max-width:100% !important;
  min-height:50px !important;
  justify-content:center !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-desc,
html.fb-browser.product-page-mode .fb-product-page .detail-section p,
html.fb-browser.product-page-mode .fb-product-page .detail-supplier span,
html.fb-browser.product-page-mode .fb-product-page h1,
html.fb-browser.product-page-mode .fb-product-page td,
html.fb-browser.product-page-mode .fb-product-page th,
html.fb-browser.product-page-mode .fb-product-page b,
html.fb-browser.product-page-mode .fb-product-page small{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
  overflow:hidden !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-main{
  width:100% !important;
  height:320px !important;
  min-height:240px !important;
  max-height:48vh !important;
  overflow:hidden !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-thumbs{
  display:flex !important;
  flex-wrap:nowrap !important;
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-thumb{
  flex:0 0 76px !important;
  width:76px !important;
  max-width:76px !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-specs,
html.fb-browser.product-page-mode .fb-product-page .detail-specs tbody,
html.fb-browser.product-page-mode .fb-product-page .detail-specs tr,
html.fb-browser.product-page-mode .fb-product-page .detail-specs th,
html.fb-browser.product-page-mode .fb-product-page .detail-specs td{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-badges{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:7px !important;
}
html.fb-browser.product-page-mode .fb-product-page .detail-badges span{
  max-width:100% !important;
  font-size:12px !important;
}

/* Visible back button for Facebook/Instagram in-app product detail page */
.fb-product-page-floating-back{
  position:fixed !important;
  left:12px !important;
  top:calc(76px + env(safe-area-inset-top, 0px)) !important;
  z-index:99999 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:6px !important;
  min-height:40px !important;
  padding:9px 14px !important;
  border:1px solid rgba(15,23,42,.12) !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.96) !important;
  color:#0f172a !important;
  font-size:15px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.14) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  backdrop-filter:blur(8px) !important;
  cursor:pointer !important;
  max-width:140px !important;
  white-space:nowrap !important;
}
.fb-product-page-top{
  padding-top:calc(8px + env(safe-area-inset-top, 0px)) !important;
}
html.fb-browser.product-page-mode .fb-product-page{
  padding-top:58px !important;
}
html.fb-browser.product-page-mode .fb-product-page-floating-back{
  top:calc(64px + env(safe-area-inset-top, 0px)) !important;
  left:12px !important;
}
@media (max-width:430px){
  .fb-product-page-floating-back{
    top:calc(60px + env(safe-area-inset-top, 0px)) !important;
    left:10px !important;
    min-height:38px !important;
    padding:8px 12px !important;
    font-size:14px !important;
  }
  html.fb-browser.product-page-mode .fb-product-page{padding-top:54px !important;}
}


/* Facebook in-app detail page: use the same round X return button style as Instagram modal */
html.fb-browser.product-page-mode .fb-product-page{
  position:relative !important;
  padding-top:calc(76px + env(safe-area-inset-top, 0px)) !important;
}
html.fb-browser.product-page-mode .fb-product-page-close{
  position:fixed !important;
  top:calc(74px + env(safe-area-inset-top, 0px)) !important;
  right:calc(16px + env(safe-area-inset-right, 0px)) !important;
  z-index:99999 !important;
  width:58px !important;
  height:58px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0f172a !important;
  color:#fff !important;
  font-size:42px !important;
  font-weight:300 !important;
  line-height:54px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 10px 30px rgba(15,23,42,.22) !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
}
html.fb-browser.product-page-mode .fb-product-page-top,
html.fb-browser.product-page-mode .fb-product-page-back,
html.fb-browser.product-page-mode .fb-product-page-floating-back{
  display:none !important;
}
@media (max-width:430px){
  html.fb-browser.product-page-mode .fb-product-page-close{
    width:56px !important;
    height:56px !important;
    font-size:40px !important;
    line-height:52px !important;
    right:calc(14px + env(safe-area-inset-right, 0px)) !important;
  }
}


/* FINAL: Facebook product detail page return button must match Instagram modal X exactly */
html.fb-browser.product-page-mode .fb-product-page{
  padding-top:calc(12px + env(safe-area-inset-top, 0px)) !important;
}
html.fb-browser.product-page-mode .fb-product-page-close,
html.fb-browser.product-page-mode .fb-product-page-close.product-detail-close{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:calc(8px + env(safe-area-inset-top, 0px)) !important;
  right:auto !important;
  left:auto !important;
  float:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin-left:auto !important;
  margin-right:0 !important;
  margin-top:0 !important;
  margin-bottom:8px !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  min-height:42px !important;
  max-height:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0f172a !important;
  color:#fff !important;
  font-size:28px !important;
  font-weight:400 !important;
  line-height:1 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.22) !important;
  z-index:2147483647 !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
  transform:none !important;
  -webkit-transform:none !important;
}
html.fb-browser.product-page-mode .fb-product-page-top,
html.fb-browser.product-page-mode .fb-product-page-back,
html.fb-browser.product-page-mode .fb-product-page-floating-back{
  display:none !important;
}
@media (max-width:430px){
  html.fb-browser.product-page-mode .fb-product-page-close,
  html.fb-browser.product-page-mode .fb-product-page-close.product-detail-close{
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    max-width:42px !important;
    min-height:42px !important;
    max-height:42px !important;
    font-size:28px !important;
    line-height:1 !important;
    top:calc(8px + env(safe-area-inset-top, 0px)) !important;
  }
}

.detail-spec-section th{background:#fff7ed!important;color:#9a3412!important;font-weight:900;text-transform:uppercase;letter-spacing:.03em;}
.detail-specs td{overflow-wrap:anywhere;word-break:break-word;}

/* Mobile product parameters visibility fix
   Keep the full desktop parameter table, and add a mobile-safe copy directly inside the product info card. */
.detail-mobile-spec-section{
  display:none;
}
.detail-mobile-spec-section h2{
  margin:0 0 12px;
  font-size:22px;
  color:#0f172a;
}
@media (max-width: 800px){
  .product-detail-modal:not(.hide) .detail-mobile-spec-section,
  .fb-product-page .detail-mobile-spec-section{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:14px 0 0 !important;
    padding:14px !important;
    border:1px solid #eef2f7 !important;
    border-radius:16px !important;
    background:#fff !important;
    overflow:visible !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section h2,
  .fb-product-page .detail-mobile-spec-section h2{
    display:block !important;
    margin:0 0 10px !important;
    font-size:18px !important;
    line-height:1.25 !important;
    color:#0f172a !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap,
  .fb-product-page .detail-spec-section-wrap{
    display:none !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs,
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs tbody,
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs tr,
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs th,
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs td,
  .fb-product-page .detail-mobile-spec-section .detail-specs,
  .fb-product-page .detail-mobile-spec-section .detail-specs tbody,
  .fb-product-page .detail-mobile-spec-section .detail-specs tr,
  .fb-product-page .detail-mobile-spec-section .detail-specs th,
  .fb-product-page .detail-mobile-spec-section .detail-specs td{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    overflow:visible !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs,
  .fb-product-page .detail-mobile-spec-section .detail-specs{
    border-collapse:separate !important;
    border-spacing:0 !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs tr,
  .fb-product-page .detail-mobile-spec-section .detail-specs tr{
    margin:0 0 8px !important;
    border:1px solid #e5e7eb !important;
    border-radius:12px !important;
    overflow:hidden !important;
    background:#fff !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs th,
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs td,
  .fb-product-page .detail-mobile-spec-section .detail-specs th,
  .fb-product-page .detail-mobile-spec-section .detail-specs td{
    border:0 !important;
    padding:9px 10px !important;
    text-align:left !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs th,
  .fb-product-page .detail-mobile-spec-section .detail-specs th{
    background:#f8fafc !important;
    color:#334155 !important;
    font-size:12px !important;
    font-weight:900 !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-specs td,
  .fb-product-page .detail-mobile-spec-section .detail-specs td{
    color:#0f172a !important;
    font-size:14px !important;
    line-height:1.55 !important;
  }
  .product-detail-modal:not(.hide) .detail-mobile-spec-section .detail-spec-section th,
  .fb-product-page .detail-mobile-spec-section .detail-spec-section th{
    background:#fff7ed !important;
    color:#c2410c !important;
    text-transform:uppercase !important;
    letter-spacing:.02em !important;
  }
}

/* Final fix: make mobile product parameters use the exact same desktop specification table.
   The earlier mobile duplicate section is hidden so desktop/mobile content cannot diverge. */
@media (max-width: 800px){
  .product-detail-modal:not(.hide) .detail-mobile-spec-section,
  .fb-product-page .detail-mobile-spec-section{
    display:none !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap,
  .fb-product-page .detail-spec-section-wrap{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:16px 0 0 !important;
    padding:14px !important;
    border:1px solid #e5e7eb !important;
    border-radius:16px !important;
    background:#fff !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap h2,
  .fb-product-page .detail-spec-section-wrap h2{
    display:block !important;
    margin:0 0 12px !important;
    font-size:18px !important;
    line-height:1.25 !important;
    color:#0f172a !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs,
  .fb-product-page .detail-spec-section-wrap .detail-specs{
    display:table !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    table-layout:fixed !important;
    border-collapse:collapse !important;
    border-spacing:0 !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs tbody,
  .fb-product-page .detail-spec-section-wrap .detail-specs tbody{
    display:table-row-group !important;
    width:100% !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs tr,
  .fb-product-page .detail-spec-section-wrap .detail-specs tr{
    display:table-row !important;
    width:100% !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs th,
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs td,
  .fb-product-page .detail-spec-section-wrap .detail-specs th,
  .fb-product-page .detail-spec-section-wrap .detail-specs td{
    display:table-cell !important;
    border:1px solid #e5e7eb !important;
    padding:9px 8px !important;
    vertical-align:top !important;
    text-align:left !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    box-sizing:border-box !important;
    line-height:1.45 !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs th,
  .fb-product-page .detail-spec-section-wrap .detail-specs th{
    width:42% !important;
    max-width:42% !important;
    background:#f8fafc !important;
    color:#334155 !important;
    font-size:12px !important;
    font-weight:900 !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs td,
  .fb-product-page .detail-spec-section-wrap .detail-specs td{
    width:58% !important;
    max-width:58% !important;
    color:#0f172a !important;
    font-size:13px !important;
  }
  .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs .detail-spec-section th,
  .fb-product-page .detail-spec-section-wrap .detail-specs .detail-spec-section th{
    display:table-cell !important;
    width:100% !important;
    max-width:100% !important;
    background:#fff7ed !important;
    color:#c2410c !important;
    font-size:12px !important;
    text-transform:uppercase !important;
    letter-spacing:.02em !important;
  }
}


/* Final parameter consistency fix: mobile/Facebook/Instagram use the same localized table as desktop. */
.detail-mobile-spec-section{display:none !important;}
@media (max-width:800px){
  .product-detail-modal:not(.hide) .detail-spec-section-wrap,
  .fb-product-page .detail-spec-section-wrap{display:block !important;}
}


/* Final in-app/Safari parameter consistency patch: show the exact same specification table structure as desktop. */
html.product-page-mode,
html.product-page-mode body{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  -webkit-text-size-adjust:100% !important;
}
.fb-product-page{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  padding-left:max(10px, env(safe-area-inset-left)) !important;
  padding-right:max(10px, env(safe-area-inset-right)) !important;
  padding-top:max(10px, env(safe-area-inset-top)) !important;
}
.fb-product-page .product-detail-grid{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
}
.fb-product-page .detail-gallery,
.fb-product-page .detail-info,
.fb-product-page .detail-section{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}
.fb-product-page .detail-spec-section-wrap{
  overflow-x:auto !important;
  overflow-y:visible !important;
  -webkit-overflow-scrolling:touch !important;
}
.fb-product-page .detail-specs{
  display:table !important;
  width:100% !important;
  min-width:620px !important;
  border-collapse:collapse !important;
  table-layout:auto !important;
}
.fb-product-page .detail-specs tbody{display:table-row-group !important; width:auto !important;}
.fb-product-page .detail-specs tr{display:table-row !important; width:auto !important; margin:0 !important; border:0 !important; border-radius:0 !important; overflow:visible !important;}
.fb-product-page .detail-specs th,
.fb-product-page .detail-specs td{
  display:table-cell !important;
  width:auto !important;
  border:1px solid #e5e7eb !important;
  padding:12px !important;
  text-align:left !important;
  vertical-align:top !important;
  white-space:normal !important;
  overflow-wrap:break-word !important;
  word-break:normal !important;
}
.fb-product-page .detail-specs th{width:220px !important; background:#f8fafc !important; color:#334155 !important;}
.fb-product-page .detail-specs .detail-spec-section th{width:auto !important; background:#fff7ed !important; color:#9a3412 !important; font-weight:900 !important;}
.fb-product-page .detail-price-box{grid-template-columns:1fr !important;}
.fb-product-page .detail-info h1,
.fb-product-page .detail-desc,
.fb-product-page .detail-section p,
.fb-product-page .detail-supplier,
.fb-product-page .detail-supplier span{
  max-width:100% !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
@supports (-webkit-touch-callout: none){
  .fb-product-page .detail-main{height:330px !important; max-height:48vh !important;}
  .fb-product-page .detail-gallery,
  .fb-product-page .detail-info,
  .fb-product-page .detail-section{border-radius:18px !important;}
  .fb-product-page .product-detail-close{position:fixed !important; top:max(10px, env(safe-area-inset-top)) !important; right:max(12px, env(safe-area-inset-right)) !important; z-index:99999 !important;}
}

/* FINAL FIX: Keep Facebook in-app product detail X return button visible while scrolling.
   The previous sticky version could scroll out/disappear in Facebook WebView. */
html.fb-browser.product-page-mode .fb-product-page-close,
html.fb-browser.product-page-mode .fb-product-page-close.product-detail-close{
  position:fixed !important;
  top:calc(10px + env(safe-area-inset-top, 0px)) !important;
  right:calc(12px + env(safe-area-inset-right, 0px)) !important;
  left:auto !important;
  bottom:auto !important;
  margin:0 !important;
  float:none !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  min-height:42px !important;
  max-height:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0f172a !important;
  color:#fff !important;
  font-size:28px !important;
  font-weight:400 !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:2147483647 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.22) !important;
  cursor:pointer !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  -webkit-transform:translateZ(0) !important;
  transform:translateZ(0) !important;
  -webkit-backface-visibility:hidden !important;
  backface-visibility:hidden !important;
  -webkit-tap-highlight-color:transparent !important;
}
html.fb-browser.product-page-mode .fb-product-page{
  padding-top:calc(12px + env(safe-area-inset-top, 0px)) !important;
}

/* REAL FINAL FIX 2026-05-23: Facebook in-app product detail X must stay visible while scrolling.
   The previous final rule changed it back to sticky, so Facebook could scroll it away.
   This rule is intentionally placed last and forces a viewport-fixed Instagram-style X. */
html.fb-browser.product-page-mode body > .fb-product-page > .fb-product-page-close,
html.fb-browser.product-page-mode .fb-product-page-close.product-detail-close,
html.fb-browser.product-page-mode .fb-product-page .fb-product-page-close{
  position:fixed !important;
  -webkit-position:fixed !important;
  top:calc(12px + env(safe-area-inset-top, 0px)) !important;
  right:calc(12px + env(safe-area-inset-right, 0px)) !important;
  left:auto !important;
  bottom:auto !important;
  float:none !important;
  margin:0 !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  min-height:42px !important;
  max-height:42px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0f172a !important;
  color:#fff !important;
  font-size:28px !important;
  font-weight:400 !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  z-index:2147483647 !important;
  box-shadow:0 8px 22px rgba(15,23,42,.22) !important;
  transform:translateZ(0) !important;
  -webkit-transform:translateZ(0) !important;
  will-change:transform !important;
  -webkit-tap-highlight-color:transparent !important;
}
html.fb-browser.product-page-mode .fb-product-page{
  padding-top:calc(12px + env(safe-area-inset-top, 0px)) !important;
}

/* Header background color updated to match the light blue Alibaba supplier header style */
.header{
  background: linear-gradient(105deg, #eaf6ff 0%, #d7ecff 42%, #bddcff 100%) !important;
  box-shadow: 0 1px 14px rgba(15,23,42,.08) !important;
}
.header .container,
.header-inner{
  background: transparent !important;
}


/* Mobile home header layout update: center and enlarge company name, hide response-rate row */
@media (max-width: 920px) {
  html.mobile-safe-header .header-inner,
  html.force-mobile-header .header-inner,
  .force-mobile-header .header-inner {
    align-items: center !important;
    text-align: center !important;
  }
  html.mobile-safe-header .brand,
  html.force-mobile-header .brand,
  .force-mobile-header .brand {
    width: 100% !important;
    justify-content: center !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  html.mobile-safe-header .brand-text,
  html.force-mobile-header .brand-text,
  .force-mobile-header .brand-text {
    width: 100% !important;
    align-items: center !important;
    text-align: center !important;
  }
  html.mobile-safe-header .brand-title,
  html.force-mobile-header .brand-title,
  .force-mobile-header .brand-title {
    font-size: clamp(28px, 7.2vw, 36px) !important;
    line-height: 1.08 !important;
    font-weight: 900 !important;
    text-align: center !important;
  }
  html.mobile-safe-header .brand-cn,
  html.force-mobile-header .brand-cn,
  .force-mobile-header .brand-cn {
    font-size: clamp(19px, 5.2vw, 26px) !important;
    line-height: 1.1 !important;
    font-weight: 800 !important;
    text-align: center !important;
    margin-top: 6px !important;
  }
  html.mobile-safe-header .header-social-left,
  html.force-mobile-header .header-social-left,
  .force-mobile-header .header-social-left {
    justify-content: center !important;
  }
  html.mobile-safe-header .actions,
  html.force-mobile-header .actions,
  .force-mobile-header .actions {
    justify-content: center !important;
  }
  html.mobile-safe-header .trust-response,
  html.force-mobile-header .trust-response,
  .force-mobile-header .trust-response {
    display: none !important;
  }
  html.mobile-safe-header .header-trust,
  html.force-mobile-header .header-trust,
  .force-mobile-header .header-trust {
    max-width: 100% !important;
    margin: 0 auto !important;
  }
  html.mobile-safe-header .trust-badges,
  html.force-mobile-header .trust-badges,
  .force-mobile-header .trust-badges {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    gap: 8px !important;
  }
}


/* Product list images: keep full product visible while reducing uneven white margins */
.media.contain-media img,
.card .media img{
  object-fit: contain !important;
  background: #fff !important;
  transition: transform .25s ease;
}
.card .media{
  overflow: hidden;
  background:#fff !important;
}
.card .media.contain-media{
  padding: 2px !important;
}
.card .media.contain-portrait img{
  transform: scale(1.15) !important;
}
.card .media.contain-balanced img{
  transform: scale(1.08) !important;
}
@media (max-width: 768px){
  .card .media.contain-portrait img{
    transform: scale(1.12) !important;
  }
  .card .media.contain-balanced img{
    transform: scale(1.05) !important;
  }
}

/* Home application image gallery inserted between hero and product section */
.home-application-gallery{
  background:#f1f5f9;
  padding:26px 0 8px;
  margin:0;
}
.home-application-gallery .container{
  max-width:none;
  width:100%;
  padding-left:0;
  padding-right:0;
}
.home-application-carousel{
  --gallery-gap: 24px;
  overflow:hidden;
  width:100vw;
  margin-left:50%;
  transform:translateX(-50%);
}
.home-application-track{
  display:flex;
  align-items:stretch;
  gap:var(--gallery-gap);
  width:max-content;
  animation:homeApplicationsScrollX 28s linear infinite;
  will-change:transform;
}
.home-application-carousel:hover .home-application-track{
  animation-play-state:paused;
}
.home-application-carousel.mobile-animation-paused .home-application-track{
  animation-play-state:paused !important;
}
.home-application-slide{
  flex:0 0 clamp(540px, 32vw, 660px);
  margin:0;
}
.home-application-slide img{
  width:100%;
  height:auto;
  display:block;
  background:#fff;
  border-radius:22px;
  box-shadow:0 12px 34px rgba(15,23,42,.10);
  border:1px solid rgba(148,163,184,.20);
  box-sizing:border-box;
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
}
@keyframes homeApplicationsScrollX{
  from{transform:translateX(0);}
  to{transform:translateX(calc(-50% - (var(--gallery-gap) / 2)));}
}
@keyframes homeApplicationsScrollY{
  from{transform:translateY(0);}
  to{transform:translateY(calc(-50% - (var(--gallery-gap) / 2)));}
}
@media(max-width:900px){
  .home-application-gallery{padding:18px 0 4px;}
  .home-application-gallery .container{
    padding-left:14px;
    padding-right:14px;
  }
  .home-application-carousel{
    --gallery-gap: 14px;
    width:100%;
    margin-left:0;
    transform:none;
    /* Mobile: show one application image area, then auto scroll vertically. */
    height:calc((100vw - 32px) * 0.54);
    max-height:360px;
    min-height:210px;
    overflow:hidden;
  }
  .home-application-track{
    flex-direction:column;
    align-items:stretch;
    width:100%;
    height:max-content;
    animation:homeApplicationsScrollY 18s linear infinite;
  }
  .home-application-carousel:hover .home-application-track{
    animation-play-state:running;
  }
  .home-application-slide{
    flex:0 0 auto;
    width:100%;
    height:calc((100vw - 32px) * 0.54);
    max-height:360px;
    min-height:210px;
    margin:0;
    overflow:hidden;
    border-radius:16px;
  }
  .home-application-carousel,
  .home-application-carousel *{
    -webkit-touch-callout:none;
  }
  .home-application-carousel{
    touch-action:pan-y;
  }
  .home-application-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    border-radius:16px;
    pointer-events:auto;
  }
}
@media (prefers-reduced-motion: reduce){
  .home-application-track{animation:none !important;}
}


/* Bottom showcase gallery above about section */
.bottom-showcase-gallery{
  background:#f1f5f9;
  padding:26px 0 8px;
  margin:0;
}
.bottom-showcase-gallery .container{
  max-width:none;
  width:100%;
  padding-left:0;
  padding-right:0;
}
.bottom-showcase-carousel{
  --gallery-gap: 24px;
  overflow:hidden;
  width:100vw;
  margin-left:50%;
  transform:translateX(-50%);
}
.bottom-showcase-track{
  display:flex;
  align-items:stretch;
  gap:var(--gallery-gap);
  width:max-content;
  animation:bottomShowcaseScrollX 34s linear infinite;
  will-change:transform;
}
.bottom-showcase-carousel:hover .bottom-showcase-track{
  animation-play-state:paused;
}
.bottom-showcase-carousel.mobile-animation-paused .bottom-showcase-track{
  animation-play-state:paused !important;
}
.bottom-showcase-slide{
  flex:0 0 auto;
  width:auto;
  margin:0;
  overflow:hidden;
  border-radius:22px;
  display:flex;
  justify-content:center;
  align-items:center;
}
.bottom-showcase-slide img{
  width:auto;
  max-width:640px;
  height:420px;
  object-fit:contain;
  display:block;
  background:#fff;
  border-radius:22px;
  box-shadow:0 12px 34px rgba(15,23,42,.10);
  border:1px solid rgba(148,163,184,.20);
  box-sizing:border-box;
  -webkit-user-drag:none;
  user-select:none;
  -webkit-user-select:none;
  padding:0;
  transform:none;
}
@keyframes bottomShowcaseScrollX{
  from{transform:translateX(0);}
  to{transform:translateX(calc(-50% - (var(--gallery-gap) / 2)));}
}
@keyframes bottomShowcaseScrollY{
  from{transform:translateY(0);}
  to{transform:translateY(calc(-50% - (var(--gallery-gap) / 2)));}
}
@media(max-width:900px){
  .bottom-showcase-gallery{padding:18px 0 4px;}
  .bottom-showcase-gallery .container{
    max-width:none;
    width:100%;
    padding-left:14px;
    padding-right:14px;
  }
  .bottom-showcase-carousel{
    --gallery-gap: 14px;
    width:100%;
    margin-left:0;
    transform:none;
    height:calc((100vw - 32px) * 0.54);
    max-height:360px;
    min-height:210px;
    overflow:hidden;
  }
  .bottom-showcase-track{
    flex-direction:column;
    align-items:center;
    width:100%;
    height:max-content;
    animation:bottomShowcaseScrollY 24s linear infinite;
  }
  .bottom-showcase-carousel:hover .bottom-showcase-track{
    animation-play-state:running;
  }
  .bottom-showcase-slide{
    flex:0 0 auto;
    width:100%;
    max-width:100%;
    height:calc((100vw - 32px) * 0.64);
    max-height:420px;
    min-height:240px;
    margin:0 auto;
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
  }
  .bottom-showcase-carousel,
  .bottom-showcase-carousel *{
    -webkit-touch-callout:none;
  }
  .bottom-showcase-carousel{
    touch-action:pan-y;
  }
  .bottom-showcase-slide img{
    width:100%;
    max-width:100%;
    height:100%;
    object-fit:contain;
    object-position:center center;
    background:#fff;
    border-radius:16px;
    padding:0;
    transform:none;
    transform-origin:center center;
  }
}
@media (prefers-reduced-motion: reduce){
  .bottom-showcase-track{animation:none !important;}
}


/* Header icon size + stronger mobile WhatsApp motion */
.header-social-left{gap:16px;}
.header-social-btn{
  width:48px !important;
  height:48px !important;
}
.header-social-btn img{
  width:42px !important;
  height:42px !important;
}
#waBtn{
  animation: whatsappBreath 3.2s ease-in-out infinite !important;
}
@media(max-width:900px){
  .header-social-left{gap:20px !important;}
  .header-social-btn,
  html.mobile-safe-header .header-social-btn,
  html.force-mobile-header .header-social-btn{
    width:54px !important;
    height:54px !important;
  }
  .header-social-btn img,
  html.mobile-safe-header .header-social-btn img,
  html.force-mobile-header .header-social-btn img{
    width:46px !important;
    height:46px !important;
  }
  #waBtn,
  html.mobile-safe-header #waBtn,
  html.force-mobile-header #waBtn{
    animation: whatsappPulseMobile 2.2s ease-in-out infinite !important;
    transform-origin:center center;
    box-shadow:0 12px 28px rgba(32,177,90,.30) !important;
  }
  #waBtn::after,
  html.mobile-safe-header #waBtn::after,
  html.force-mobile-header #waBtn::after{
    animation: whatsappShineMobile 2.8s ease-in-out infinite !important;
  }
}
@keyframes whatsappPulseMobile{
  0%,100%{transform:translateY(0) scale(1);box-shadow:0 12px 28px rgba(32,177,90,.30);}
  25%{transform:translateY(-2px) scale(1.04);box-shadow:0 16px 34px rgba(32,177,90,.38);}
  55%{transform:translateY(0) scale(.985);box-shadow:0 10px 22px rgba(32,177,90,.24);}
  78%{transform:translateY(-1px) scale(1.02);box-shadow:0 14px 30px rgba(32,177,90,.34);}
}
@keyframes whatsappShineMobile{
  0%,14%{left:-120%;}
  34%{left:130%;}
  100%{left:130%;}
}


/* Faster breathing + guaranteed visible WhatsApp motion on mobile */
.header-social-left .header-social-btn:nth-child(1){
  animation: headerIconFloatFast1 2.1s ease-in-out infinite !important;
}
.header-social-left .header-social-btn:nth-child(2){
  animation: headerIconFloatFast2 2.3s ease-in-out infinite .12s !important;
}
.header-social-left .header-social-btn:nth-child(1)::after{
  animation: headerIconAuraFast 2.1s ease-in-out infinite !important;
}
.header-social-left .header-social-btn:nth-child(2)::after{
  animation: headerIconAuraFast 2.3s ease-in-out infinite .12s !important;
}
#waBtn,
html.mobile-safe-header #waBtn,
html.force-mobile-header #waBtn{
  animation: whatsappBreathFast 2.05s ease-in-out infinite !important;
}
#waBtn::before,
html.mobile-safe-header #waBtn::before,
html.force-mobile-header #waBtn::before{
  content:"";
  position:absolute;
  inset:-6px;
  border-radius:999px;
  border:2px solid rgba(32,177,90,.28);
  pointer-events:none;
  opacity:0;
  animation: whatsappRingFast 2.05s ease-out infinite !important;
}
#waBtn::after,
html.mobile-safe-header #waBtn::after,
html.force-mobile-header #waBtn::after{
  animation: whatsappShineFast 2.35s ease-in-out infinite !important;
}
@media(max-width:900px){
  #waBtn,
  html.mobile-safe-header #waBtn,
  html.force-mobile-header #waBtn{
    animation: whatsappPulseMobileFast 1.7s ease-in-out infinite !important;
  }
  #waBtn::before,
  html.mobile-safe-header #waBtn::before,
  html.force-mobile-header #waBtn::before{
    animation: whatsappRingMobileFast 1.7s ease-out infinite !important;
  }
  #waBtn::after,
  html.mobile-safe-header #waBtn::after,
  html.force-mobile-header #waBtn::after{
    animation: whatsappShineMobileFast 2s ease-in-out infinite !important;
  }
}
@keyframes headerIconFloatFast1{
  0%,100%{transform:translateY(0) scale(1);}
  28%{transform:translateY(-5px) scale(1.08);}
  62%{transform:translateY(1px) scale(.98);}
}
@keyframes headerIconFloatFast2{
  0%,100%{transform:translateY(0) scale(1) rotate(0deg);}
  32%{transform:translateY(-4px) scale(1.1) rotate(2deg);}
  64%{transform:translateY(1px) scale(.985) rotate(-1deg);}
}
@keyframes headerIconAuraFast{
  0%,100%{opacity:.14;transform:scale(.84);}
  45%{opacity:.34;transform:scale(1.12);}
  72%{opacity:.18;transform:scale(.92);}
}
@keyframes whatsappBreathFast{
  0%,100%{transform:translateY(0) scale(1);box-shadow:0 10px 24px rgba(32,177,90,.24);}
  35%{transform:translateY(-2px) scale(1.06);box-shadow:0 17px 34px rgba(32,177,90,.36);}
  70%{transform:translateY(0) scale(.99);box-shadow:0 9px 18px rgba(32,177,90,.22);}
}
@keyframes whatsappRingFast{
  0%{opacity:0;transform:scale(.9);}
  20%{opacity:.28;}
  70%{opacity:0;transform:scale(1.18);}
  100%{opacity:0;transform:scale(1.18);}
}
@keyframes whatsappShineFast{
  0%,12%{left:-120%;}
  32%{left:130%;}
  100%{left:130%;}
}
@keyframes whatsappPulseMobileFast{
  0%,100%{transform:translateY(0) scale(1);box-shadow:0 12px 28px rgba(32,177,90,.30);}
  24%{transform:translateY(-2px) scale(1.08);box-shadow:0 18px 36px rgba(32,177,90,.42);}
  55%{transform:translateY(0) scale(.985);box-shadow:0 10px 22px rgba(32,177,90,.24);}
  78%{transform:translateY(-1px) scale(1.05);box-shadow:0 15px 32px rgba(32,177,90,.36);}
}
@keyframes whatsappRingMobileFast{
  0%{opacity:0;transform:scale(.92);}
  18%{opacity:.34;}
  68%{opacity:0;transform:scale(1.22);}
  100%{opacity:0;transform:scale(1.22);}
}
@keyframes whatsappShineMobileFast{
  0%,10%{left:-120%;}
  28%{left:130%;}
  100%{left:130%;}
}


/* Final mobile WhatsApp motion fix: use translate/scale individual properties so mobile layout transform resets cannot stop it */
@media screen and (max-device-width: 920px), screen and (max-width: 920px){
  #waBtn,
  html.mobile-safe-header #waBtn,
  html.force-mobile-header #waBtn,
  .force-mobile-header #waBtn{
    position:relative !important;
    overflow:visible !important;
    animation:waMobileActualMove 1.35s ease-in-out infinite !important;
    transform-origin:center center !important;
    box-shadow:0 12px 28px rgba(32,177,90,.34) !important;
    isolation:isolate !important;
  }
  #waBtn::before,
  html.mobile-safe-header #waBtn::before,
  html.force-mobile-header #waBtn::before,
  .force-mobile-header #waBtn::before{
    content:"" !important;
    position:absolute !important;
    inset:-7px !important;
    border-radius:999px !important;
    border:2px solid rgba(32,177,90,.35) !important;
    pointer-events:none !important;
    animation:waMobileActualRing 1.35s ease-out infinite !important;
    z-index:-1 !important;
  }
}
@keyframes waMobileActualMove{
  0%,100%{translate:0 0;scale:1;box-shadow:0 12px 28px rgba(32,177,90,.34);filter:brightness(1);}
  24%{translate:0 -4px;scale:1.09;box-shadow:0 18px 38px rgba(32,177,90,.48);filter:brightness(1.07);}
  48%{translate:2px 0;scale:1.01;box-shadow:0 10px 22px rgba(32,177,90,.28);filter:brightness(1);}
  72%{translate:-2px -2px;scale:1.05;box-shadow:0 16px 32px rgba(32,177,90,.42);filter:brightness(1.04);}
}
@keyframes waMobileActualRing{
  0%{opacity:0;transform:scale(.9);}
  18%{opacity:.45;}
  68%{opacity:0;transform:scale(1.25);}
  100%{opacity:0;transform:scale(1.25);}
}


/* Final mobile social icon size and spacing override */
@media(max-width:900px){
  .header-social-left,
  html.mobile-safe-header .header-social-left,
  html.force-mobile-header .header-social-left,
  .force-mobile-header .header-social-left{
    gap:28px !important;
    justify-content:center !important;
  }

  .header-social-btn,
  html.mobile-safe-header .header-social-btn,
  html.force-mobile-header .header-social-btn,
  .force-mobile-header .header-social-btn{
    width:66px !important;
    height:66px !important;
    min-width:66px !important;
    min-height:66px !important;
  }

  .header-social-btn img,
  html.mobile-safe-header .header-social-btn img,
  html.force-mobile-header .header-social-btn img,
  .force-mobile-header .header-social-btn img{
    width:56px !important;
    height:56px !important;
  }
}

@media(max-width:560px){
  .header-social-left,
  html.mobile-safe-header .header-social-left,
  html.force-mobile-header .header-social-left,
  .force-mobile-header .header-social-left{
    display:flex !important;
    gap:24px !important;
  }

  .header-social-btn,
  html.mobile-safe-header .header-social-btn,
  html.force-mobile-header .header-social-btn,
  .force-mobile-header .header-social-btn{
    width:60px !important;
    height:60px !important;
    min-width:60px !important;
    min-height:60px !important;
  }

  .header-social-btn img,
  html.mobile-safe-header .header-social-btn img,
  html.force-mobile-header .header-social-btn img,
  .force-mobile-header .header-social-btn img{
    width:50px !important;
    height:50px !important;
  }
}


/* In-app browser bottom showcase crop fix: force subject-width display and avoid old cached full-width layout */
.bottom-showcase-track{
  align-items:center !important;
}
.bottom-showcase-slide{
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  background:transparent !important;
}
.bottom-showcase-slide img{
  width:auto !important;
  height:420px !important;
  max-width:640px !important;
  object-fit:contain !important;
  background:#fff !important;
}
@media(max-width:1100px){
  .bottom-showcase-gallery .container,
  html.mobile-safe-header .bottom-showcase-gallery .container,
  html.force-mobile-header .bottom-showcase-gallery .container,
  .force-mobile-header .bottom-showcase-gallery .container{
    max-width:none !important;
    width:100% !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }
  .bottom-showcase-carousel,
  html.mobile-safe-header .bottom-showcase-carousel,
  html.force-mobile-header .bottom-showcase-carousel,
  .force-mobile-header .bottom-showcase-carousel{
    width:100% !important;
    margin-left:0 !important;
    transform:none !important;
    overflow:hidden !important;
    height:calc(100vw - 24px) !important;
    max-height:420px !important;
    min-height:300px !important;
  }
  .bottom-showcase-track,
  html.mobile-safe-header .bottom-showcase-track,
  html.force-mobile-header .bottom-showcase-track,
  .force-mobile-header .bottom-showcase-track{
    flex-direction:column !important;
    align-items:center !important;
    width:100% !important;
    height:max-content !important;
  }
  .bottom-showcase-slide,
  html.mobile-safe-header .bottom-showcase-slide,
  html.force-mobile-header .bottom-showcase-slide,
  .force-mobile-header .bottom-showcase-slide{
    width:100% !important;
    max-width:100% !important;
    height:calc(100vw - 24px) !important;
    max-height:420px !important;
    min-height:300px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    overflow:hidden !important;
  }
  .bottom-showcase-slide img,
  html.mobile-safe-header .bottom-showcase-slide img,
  html.force-mobile-header .bottom-showcase-slide img,
  .force-mobile-header .bottom-showcase-slide img{
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    object-fit:contain !important;
    object-position:center center !important;
    background:#fff !important;
    border-radius:16px !important;
    transform:none !important;
  }
}


/* Mobile language switch performance: pause expensive animations for one frame while text updates */
.lang-switching .home-application-track,
.lang-switching .bottom-showcase-track,
.lang-switching .hero-video-thumbs,
.lang-switching .thumbs{
  animation-play-state: paused !important;
}
.lang-switching *{
  scroll-behavior:auto !important;
}



/* Mobile performance / temperature guard */
.card, .about, .features, .home-application-section, .bottom-showcase-section, .product-detail-section {
  content-visibility: auto;
  contain-intrinsic-size: 1px 820px;
}
.product-card, .card, .media, .thumbs, .home-application-carousel, .bottom-showcase-carousel {
  contain: layout paint;
}
img, video {
  backface-visibility: hidden;
}
@media (max-width: 900px) {
  html.mobile-performance-mode .home-application-track {
    animation-duration: 26s !important;
    will-change: auto !important;
  }
  html.mobile-performance-mode .bottom-showcase-track {
    animation-duration: 42s !important;
    will-change: auto !important;
  }
  html.mobile-performance-mode.mobile-user-scrolling .home-application-track,
  html.mobile-performance-mode.mobile-user-scrolling .bottom-showcase-track,
  html.mobile-performance-mode.page-hidden-performance .home-application-track,
  html.mobile-performance-mode.page-hidden-performance .bottom-showcase-track,
  html.mobile-performance-mode.lang-switching .home-application-track,
  html.mobile-performance-mode.lang-switching .bottom-showcase-track {
    animation-play-state: paused !important;
  }
  html.mobile-performance-mode .product-main-video,
  html.mobile-performance-mode .product-thumb-video,
  html.mobile-performance-mode #heroMainVideo {
    transform: translateZ(0);
  }
  html.mobile-performance-mode .card {
    box-shadow: 0 10px 24px rgba(15,23,42,.08) !important;
  }
}


/* Desktop hero video moved right + home application desktop wider */
@media (min-width: 1024px){
  .hero .container{
    max-width: 1320px;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    gap: 52px;
  }

  /* Move desktop hero video frame a bit more to the right while keeping layout balanced */
  .hero-media{
    margin-left: 26px;
  }

  /* Widen the desktop home horizontal scrolling image area */
  .home-application-carousel{
    --gallery-gap: 28px;
  }
  .home-application-slide{
    flex: 0 0 clamp(620px, 36vw, 780px);
  }
  .home-application-slide img{
    image-rendering: auto;
  }
}


/* Desktop + mobile home application banner wider v2 */
@media (min-width: 1024px){
  .home-application-carousel{
    --gallery-gap: 32px;
  }
  .home-application-slide{
    flex: 0 0 clamp(700px, 40vw, 860px);
  }
}

@media (max-width: 900px){
  .home-application-gallery .container{
    padding-left: 6px;
    padding-right: 6px;
  }
  .home-application-carousel{
    --gallery-gap: 12px;
    height: calc((100vw - 12px) * 0.62);
    max-height: 440px;
    min-height: 250px;
  }
}


/* Desktop + mobile home application banner wider v3 */
@media (min-width: 1024px){
  .home-application-carousel{
    --gallery-gap: 34px;
  }
  .home-application-slide{
    flex: 0 0 clamp(760px, 44vw, 960px);
  }
}

@media (max-width: 900px){
  .home-application-gallery .container{
    padding-left: 2px;
    padding-right: 2px;
  }
  .home-application-carousel{
    --gallery-gap: 10px;
    height: calc((100vw - 4px) * 0.74);
    max-height: 520px;
    min-height: 300px;
  }
  .home-application-slide{
    height: calc((100vw - 4px) * 0.74);
    max-height: 520px;
    min-height: 300px;
  }
}


/* Mobile home application banner full-visible fix v4 */
@media (max-width: 900px){
  .home-application-gallery .container{
    padding-left: 2px;
    padding-right: 2px;
  }
  .home-application-carousel{
    --gallery-gap: 10px;
    width: 100%;
    margin-left: 0;
    transform: none;
    height: calc((100vw - 4px) * 0.545);
    max-height: 400px;
    min-height: 220px;
    overflow: hidden;
  }
  .home-application-slide{
    width: 100%;
    height: calc((100vw - 4px) * 0.545);
    max-height: 400px;
    min-height: 220px;
    margin: 0;
    overflow: hidden;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
  }
  .home-application-slide img{
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    object-position: center center;
    border-radius: 16px;
    background: #eef4fb;
    display: block;
  }
}


/* Bluestar 2026 professional upgrade */
:root{--brand-blue:#0056D6;--brand-dark:#1A1A1A;--brand-soft:#f5f8ff}
.main-nav{display:flex;align-items:center;gap:18px;font-weight:800;font-size:14px;white-space:nowrap}
.main-nav a{color:#1A1A1A;text-decoration:none}.main-nav a:hover{color:#0056D6}
.section-title-block{max-width:820px;margin:0 auto 26px;text-align:center}.section-title-block p,.factory-strength p,.contact-upgrade p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.section-title-block h2,.factory-strength h2,.contact-upgrade h2{margin:0;color:#1A1A1A;font-size:clamp(26px,3vw,42px);line-height:1.15}.section-title-block span,.factory-strength span,.contact-upgrade span{display:block;margin-top:12px;color:#64748b;line-height:1.8}
.solution-categories,.why-upgrade{padding:58px 0 22px}.solution-grid,.why-grid,.project-grid-upgrade{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.solution-card,.why-item,.project-card-upgrade,.contact-form-upgrade{background:#fff;border:1px solid #e5e7eb;border-radius:22px;box-shadow:0 14px 40px rgba(15,23,42,.08);overflow:hidden}.solution-card,.why-item{padding:22px}.solution-card h3,.why-item b,.project-card-upgrade h3{color:#1A1A1A;margin:0 0 10px;font-size:19px}.solution-card p,.why-item span,.project-card-upgrade p{color:#64748b;line-height:1.7;font-size:14px}.solution-card a{display:inline-flex;margin-top:10px;color:#0056D6;font-weight:900;text-decoration:none}.why-grid{grid-template-columns:repeat(4,1fr)}
.projects-upgrade{padding:62px 0;background:#f8fafc}.project-grid-upgrade{grid-template-columns:repeat(3,1fr)}.project-card-upgrade img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.project-card-upgrade div{padding:18px}.project-card-upgrade small{color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.project-card-upgrade h3{margin-top:8px}
.factory-strength{padding:68px 0;background:linear-gradient(135deg,#0f172a,#1e3a8a);color:#fff}.factory-strength h2,.factory-strength p,.factory-strength span{color:#fff}.factory-strength span{color:#dbeafe}.factory-grid-upgrade{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:center}.factory-badges{display:grid;grid-template-columns:1fr 1fr;gap:12px}.factory-badges b{display:flex;align-items:center;justify-content:center;min-height:96px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:20px;color:#fff;text-align:center;padding:14px}
.contact-upgrade{padding:70px 0;background:#fff}.contact-upgrade-grid{display:grid;grid-template-columns:1fr 420px;gap:28px;align-items:start}.contact-lines{display:grid;gap:10px;margin:22px 0}.contact-lines b{color:#1A1A1A}.contact-form-upgrade{padding:20px}.contact-form-upgrade label{display:block;color:#1A1A1A;font-weight:800;margin-bottom:12px}.contact-form-upgrade input,.contact-form-upgrade textarea{width:100%;box-sizing:border-box;margin-top:6px;border:1px solid #dbe3ef;border-radius:12px;padding:12px;font:inherit}.contact-form-upgrade textarea{min-height:130px;resize:vertical}.contact-form-upgrade .btn{width:100%;justify-content:center;border:0;cursor:pointer}.btn{border-radius:6px!important}.editor{display:none!important}html.admin-mode .editor{display:block!important}.edit-product,#editToggle,#addProduct{display:none!important}html.admin-mode .edit-product,html.admin-mode #editToggle,html.admin-mode #addProduct{display:inline-flex!important}
@media(max-width:1100px){.solution-grid,.why-grid{grid-template-columns:repeat(2,1fr)}.main-nav{display:none}.contact-upgrade-grid,.factory-grid-upgrade{grid-template-columns:1fr}.project-grid-upgrade{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.solution-grid,.why-grid,.project-grid-upgrade,.factory-badges{grid-template-columns:1fr}.solution-categories,.why-upgrade,.projects-upgrade,.factory-strength,.contact-upgrade{padding:42px 0}.contact-form-upgrade{padding:16px}.hero-buttons{align-items:stretch}.hero-buttons .btn{justify-content:center}.section-title-block{text-align:left}}


/* Bluestar conversion optimization v2 */
.quote-guide{padding:58px 0;background:#fff}
.quote-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.quote-guide-grid article{background:#f8fafc;border:1px solid #e5e7eb;border-radius:22px;padding:22px;box-shadow:0 14px 36px rgba(15,23,42,.06)}
.quote-guide-grid b{display:inline-flex;width:40px;height:40px;border-radius:999px;align-items:center;justify-content:center;background:#0056D6;color:#fff;margin-bottom:14px}
.quote-guide-grid h3{margin:0 0 8px;color:#1A1A1A;font-size:20px}.quote-guide-grid p{margin:0;color:#64748b;line-height:1.7}
.process-upgrade{padding:64px 0;background:#f5f8ff}.process-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.process-steps div{background:#fff;border:1px solid #dbeafe;border-radius:22px;padding:20px;box-shadow:0 12px 30px rgba(15,23,42,.06)}.process-steps span{color:#0056D6;font-weight:900;font-size:26px}.process-steps b{display:block;margin:10px 0 8px;color:#1A1A1A;font-size:18px}.process-steps p{margin:0;color:#64748b;line-height:1.7;font-size:14px}
.faq-upgrade{padding:68px 0;background:#fff}.faq-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;align-items:start}.faq-grid>div:first-child p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.faq-grid h2{margin:0;color:#1A1A1A;font-size:clamp(26px,3vw,42px);line-height:1.15}.faq-grid span{display:block;margin-top:12px;color:#64748b;line-height:1.8}.faq-list{display:grid;gap:12px}.faq-list details{background:#f8fafc;border:1px solid #e5e7eb;border-radius:16px;padding:16px}.faq-list summary{cursor:pointer;font-weight:900;color:#1A1A1A}.faq-list p{color:#64748b;line-height:1.7;margin:12px 0 0}.mobile-sticky-whatsapp{display:none;position:fixed;left:50%;right:auto;transform:translateX(-50%);bottom:14px;z-index:9999;background:#20b15a;color:#fff;text-align:center;text-decoration:none;font-weight:900;padding:14px 24px;border-radius:999px;box-shadow:0 16px 36px rgba(32,177,90,.38);width:max-content;max-width:calc(100vw - 32px);white-space:nowrap}
.contact-form-upgrade button.btn{background:#0056D6;color:#fff}.hero .btn,.contact-upgrade .btn.green{box-shadow:0 12px 28px rgba(0,86,214,.18)}
@media(max-width:1100px){.process-steps{grid-template-columns:repeat(2,1fr)}.faq-grid{grid-template-columns:1fr}.quote-guide-grid{grid-template-columns:1fr}}
@media(max-width:680px){.quote-guide,.process-upgrade,.faq-upgrade{padding:42px 0}.process-steps{grid-template-columns:1fr}.mobile-sticky-whatsapp{display:block}body{padding-bottom:72px}.quote-guide .section-title-block,.process-upgrade .section-title-block{text-align:left}}

/* V3 pitch focus section */
.pitch-focus{margin-top:32px;background:#f8fbff;border:1px solid #dbeafe;border-radius:24px;padding:26px;box-shadow:0 18px 45px rgba(15,23,42,.06)}
.pitch-focus-title{text-align:center;max-width:820px;margin:0 auto 22px}
.pitch-focus-title p{margin:0 0 8px;color:var(--blue);font-weight:900;text-transform:uppercase;letter-spacing:.14em;font-size:13px}
.pitch-focus-title h3{margin:0;font-size:clamp(28px,4vw,44px);color:#111827;line-height:1.08}
.pitch-focus-title span{display:block;margin-top:12px;color:#58708f;font-size:17px;line-height:1.7}
.pitch-focus-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.pitch-focus-grid article{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:20px;min-height:154px;transition:.2s ease;box-shadow:0 12px 28px rgba(15,23,42,.05)}
.pitch-focus-grid article:hover{transform:translateY(-3px);border-color:#93c5fd;box-shadow:0 18px 42px rgba(0,86,214,.12)}
.pitch-focus-grid b{display:block;color:var(--blue);font-size:32px;line-height:1;margin-bottom:14px}
.pitch-focus-grid span{display:block;color:#5b708c;line-height:1.65;font-size:15px}
@media(max-width:900px){.pitch-focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.pitch-focus{padding:20px}.pitch-focus-grid{grid-template-columns:1fr}.pitch-focus-grid article{min-height:auto}}


/* Bluestar conversion optimization v4 */
.solution-kicker{display:inline-flex;margin-bottom:12px;padding:6px 10px;border-radius:999px;background:#eaf2ff;color:#0056D6;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.quick-specs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 14px}
.quick-specs span{display:block;background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:8px 10px;color:#1f2937;font-size:12px;line-height:1.35;min-height:44px}
.quick-specs em{display:block;font-style:normal;color:#0056D6;font-weight:900;font-size:11px;margin-bottom:3px;text-transform:uppercase;letter-spacing:.04em}
.quality-upgrade{padding:68px 0;background:#f8fbff;border-top:1px solid #eaf1fb;border-bottom:1px solid #eaf1fb}
.quality-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:32px;align-items:start}
.quality-grid>div:first-child p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.quality-grid h2{margin:0;color:#1A1A1A;font-size:clamp(26px,3vw,42px);line-height:1.15}.quality-grid span{display:block;margin-top:12px;color:#64748b;line-height:1.8}
.quality-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}.quality-list article{background:#fff;border:1px solid #dbeafe;border-radius:20px;padding:20px;box-shadow:0 14px 34px rgba(15,23,42,.06)}.quality-list b{display:block;color:#1A1A1A;font-size:18px;margin-bottom:8px}.quality-list span{color:#64748b;line-height:1.65}
.contact-form-upgrade select{width:100%;box-sizing:border-box;margin-top:6px;border:1px solid #dbe3ef;border-radius:12px;padding:12px;font:inherit;background:#fff;color:#1A1A1A}
.contact-form-upgrade{display:grid;grid-template-columns:1fr 1fr;gap:12px}.contact-form-upgrade label{margin-bottom:0}.contact-form-upgrade label:last-of-type,.contact-form-upgrade button{grid-column:1/-1}
.contact-upgrade-grid{grid-template-columns:minmax(0,1fr) minmax(480px,560px)}
.contact-page-body{background:#f8fafc;color:#1A1A1A}.contact-page-main{background:#fff}.contact-page-header .main-nav a.active{color:#0056D6;font-weight:900}.contact-page-section{min-height:calc(100vh - 180px);padding-top:38px}.contact-back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;border:0;background:transparent;color:#0056D6;font:inherit;font-size:18px;font-weight:900;line-height:1;cursor:pointer}.contact-back-link:hover{text-decoration:underline}.contact-page-section .contact-upgrade-grid{align-items:start}.contact-page-section .contact-form-upgrade{box-shadow:0 16px 46px rgba(15,23,42,.1)}
@media(max-width:1100px){.quality-grid{grid-template-columns:1fr}.contact-upgrade-grid{grid-template-columns:1fr}.contact-form-upgrade{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.quick-specs{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.quick-specs span{padding:10px 12px;min-height:0;font-size:12.5px;line-height:1.4}.quick-specs em{font-size:10.5px;margin-bottom:4px}.quality-upgrade{padding:42px 0}.quality-list,.contact-form-upgrade{grid-template-columns:1fr}.quality-grid>div:first-child{text-align:left}.contact-page-section{padding-top:24px}.contact-back-link{font-size:17px;margin-bottom:18px}}

.active-solution-filter{display:flex;align-items:center;justify-content:space-between;gap:18px;background:#eef5ff;border:1px solid #cfe1ff;border-radius:18px;padding:16px 18px;margin:0 0 20px;box-shadow:0 10px 30px rgba(0,86,214,.08)}
.active-solution-filter b{display:block;color:#0056d6;font-size:18px;margin-bottom:4px}.active-solution-filter p{margin:0;color:#536a8b;line-height:1.55}.active-solution-filter button{border:0;border-radius:999px;background:#0056d6;color:#fff;font-weight:800;padding:10px 16px;white-space:nowrap;cursor:pointer}.no-products{grid-column:1/-1;background:#fff;border:1px solid #dde5f0;border-radius:20px;padding:28px;color:#536a8b;text-align:center;font-weight:700}
@media(max-width:760px){.active-solution-filter{align-items:flex-start;flex-direction:column}.active-solution-filter button{width:100%}}


/* V7 professional mobile responsive upgrade
   Goal: mobile first sales flow, touch-friendly navigation, no horizontal overflow. */
*, *::before, *::after { box-sizing: border-box; }

@media (max-width: 920px) {
  html, body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
  }

  .container,
  .header .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .topbar,
  .search,
  .header-social-left,
  .header-trust,
  .brand-sub {
    display: none !important;
  }

  .header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: rgba(255,255,255,.96) !important;
    backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid #e8eef7 !important;
  }

  .header-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 12px 16px 14px !important;
    overflow: visible !important;
  }

  .brand {
    order: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  .brand img,
  #logo {
    width: 46px !important;
    height: 46px !important;
    flex: 0 0 46px !important;
    object-fit: contain !important;
  }

  .brand-text {
    min-width: 0 !important;
    max-width: calc(100% - 60px) !important;
  }

  .brand-title {
    font-size: 18px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  .brand-cn {
    font-size: 13px !important;
    line-height: 1.2 !important;
    margin-top: 2px !important;
  }

  .main-nav {
    order: 2 !important;
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 8px !important;
    overflow-x: auto !important;
    padding: 2px 0 4px !important;
    justify-content: flex-start !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .main-nav::-webkit-scrollbar { display: none !important; }

  .main-nav a {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 38px !important;
    padding: 9px 14px !important;
    border-radius: 999px !important;
    background: #eef5ff !important;
    color: #0056D6 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
  }

  .actions {
    order: 3 !important;
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    max-width: 420px !important;
    gap: 10px !important;
    margin: 0 auto !important;
    overflow: visible !important;
  }

  .actions .btn,
  .actions a,
  .actions button,
  .lang-toggle,
  #waBtn {
    width: 100% !important;
    max-width: none !important;
    min-height: 42px !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 11px 12px !important;
    font-size: 14px !important;
    border-radius: 999px !important;
    white-space: nowrap !important;
  }

  .hero .container {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    padding-top: 28px !important;
    padding-bottom: 36px !important;
  }

  .hero h1 {
    font-size: clamp(30px, 8.5vw, 42px) !important;
    line-height: 1.08 !important;
    letter-spacing: -0.02em !important;
    margin-bottom: 14px !important;
  }

  .hero p {
    font-size: 16px !important;
    line-height: 1.65 !important;
    margin-bottom: 18px !important;
  }

  .hero-buttons {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    width: 100% !important;
  }

  .hero-buttons .btn {
    width: 100% !important;
    min-height: 46px !important;
    justify-content: center !important;
  }

  .stats {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-top: 18px !important;
  }

  .stat {
    padding: 14px 12px !important;
    min-height: 88px !important;
  }

  .stat b { font-size: 24px !important; }
  .stat span { font-size: 13px !important; }

  .hero-media,
  .hero-video-gallery {
    border-radius: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .hero-media video,
  .hero-media img {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
  }

  .home-application-gallery { padding: 22px 0 !important; }
  .home-application-gallery .container { padding-left: 8px !important; padding-right: 8px !important; }
  .home-application-carousel,
  .home-application-slide {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 16px !important;
  }

  .section-title-block,
  .pitch-focus-title,
  .faq-grid > div:first-child,
  .quality-grid > div:first-child {
    text-align: left !important;
  }

  .section-title-block h2,
  .factory-strength h2,
  .contact-upgrade h2,
  .faq-grid h2,
  .quality-grid h2 {
    font-size: clamp(26px, 8vw, 36px) !important;
    line-height: 1.12 !important;
  }

  .solution-grid,
  .why-grid,
  .project-grid-upgrade,
  .quote-guide-grid,
  .process-steps,
  .pitch-focus-grid,
  .quality-list,
  .contact-upgrade-grid,
  .factory-grid-upgrade,
  .faq-grid,
  .layout,
  .grid,
  .about-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .solution-card,
  .why-item,
  .project-card-upgrade,
  .quote-guide-grid article,
  .process-steps div,
  .quality-list article,
  .pitch-focus-grid article,
  .contact-form-upgrade,
  .contact-box,
  .card {
    border-radius: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .solution-card { padding: 20px !important; }
  .solution-card a { min-height: 42px !important; align-items: center !important; }

  .quick-specs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .contact-form-upgrade {
    grid-template-columns: 1fr !important;
  }

  .project-card-upgrade img,
  .media,
  .media img,
  .media video {
    width: 100% !important;
    aspect-ratio: 16 / 10 !important;
    height: auto !important;
    object-fit: cover !important;
  }

  .active-solution-filter {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }

  .active-solution-filter button { width: 100% !important; min-height: 44px !important; }

  .faq-list details {
    padding: 14px 16px !important;
    border-radius: 14px !important;
  }

  .faq-list summary {
    line-height: 1.35 !important;
  }

  .contact-form-upgrade input,
  .contact-form-upgrade select,
  .contact-form-upgrade textarea {
    min-height: 46px !important;
    font-size: 16px !important; /* prevents iPhone zoom-in */
  }

  .footer .container {
    display: grid !important;
    grid-template-columns: 1fr !important;
    text-align: center !important;
    justify-items: center !important;
  }

  .mobile-sticky-whatsapp {
    display: block !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    bottom: max(14px, env(safe-area-inset-bottom)) !important;
    min-height: 52px !important;
    line-height: 24px !important;
    padding: 14px 24px !important;
    border-radius: 999px !important;
    width: max-content !important;
    max-width: calc(100vw - 32px) !important;
    white-space: nowrap !important;
  }

  body { padding-bottom: 82px !important; }
}

@media (max-width: 380px) {
  .brand-title { font-size: 16px !important; }
  .brand-cn { font-size: 12px !important; }
  .actions { grid-template-columns: 1fr !important; }
  .stats { grid-template-columns: 1fr !important; }
  .main-nav a { padding: 8px 12px !important; }
}

/* v8 header navigation row: Products / Projects / About / Contact in a separate line */
@media (min-width: 1101px) {
  .header-inner {
    justify-content: center !important;
    align-items: center !important;
    gap: 12px 22px !important;
  }
  .header-social-left { order: 1 !important; }
  .brand { order: 2 !important; }
  .search { order: 3 !important; }
  .actions { order: 4 !important; }
  .header-trust { order: 5 !important; }
  .main-nav {
    order: 6 !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 34px !important;
    padding: 12px 0 0 !important;
    margin-top: 4px !important;
    border-top: 1px solid rgba(15, 23, 42, .08) !important;
    font-size: 15px !important;
  }
  .main-nav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 34px !important;
    padding: 6px 12px !important;
    border-radius: 999px !important;
    color: #1A1A1A !important;
  }
  .main-nav a:hover {
    background: #eef5ff !important;
    color: #0056D6 !important;
  }
}

@media (min-width: 769px) and (max-width: 1100px) {
  .main-nav {
    order: 6 !important;
    display: flex !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    justify-content: center !important;
    gap: 24px !important;
    padding: 10px 0 0 !important;
    margin-top: 4px !important;
    border-top: 1px solid rgba(15, 23, 42, .08) !important;
  }
}

/* v9: make the separate header navigation row larger and easier to click */
@media (min-width: 1101px) {
  .main-nav {
    gap: 56px !important;
    padding: 16px 0 2px !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    letter-spacing: .2px !important;
  }
  .main-nav a {
    min-height: 44px !important;
    padding: 8px 18px !important;
  }
}

@media (min-width: 769px) and (max-width: 1100px) {
  .main-nav {
    gap: 36px !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    padding: 14px 0 2px !important;
  }
  .main-nav a {
    min-height: 42px !important;
    padding: 8px 16px !important;
  }
}

/* V12 fix: separate Why Choose Us titles and body text */
.why-item b{
  display:block !important;
  margin:0 0 14px 0 !important;
  line-height:1.22 !important;
  font-size:20px !important;
  color:#0f172a !important;
}
.why-item span{
  display:block !important;
  margin:0 !important;
  line-height:1.75 !important;
  font-size:15px !important;
  color:#58708f !important;
}
@media (max-width:680px){
  .why-item b{font-size:19px !important;margin-bottom:12px !important;}
  .why-item span{font-size:15px !important;}
}

/* V13: mobile / desktop view switcher for phones */
.view-mode-toggle{
  display:none;
  position:fixed;
  left:max(14px, env(safe-area-inset-left));
  bottom:max(82px, calc(env(safe-area-inset-bottom) + 82px));
  z-index:10050;
  min-height:42px;
  padding:10px 16px;
  border:0;
  border-radius:999px;
  background:#0056D6;
  color:#fff;
  font-weight:900;
  font-size:14px;
  letter-spacing:.02em;
  box-shadow:0 14px 36px rgba(0,86,214,.34);
  align-items:center;
  justify-content:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.view-mode-toggle:active{transform:translateY(1px)}
@media (max-width:920px){.view-mode-toggle{display:inline-flex}}
html.desktop-view-mode .view-mode-toggle{
  display:inline-flex !important;
  left:18px;
  bottom:18px;
  min-height:44px;
  padding:10px 18px;
  font-size:15px;
}
html.desktop-view-mode .mobile-sticky-whatsapp{display:none !important;}
html.desktop-view-mode body{padding-bottom:0 !important;}
html.desktop-view-mode .topbar{display:block !important;}
html.desktop-view-mode .main-nav{display:flex !important;}
html.desktop-view-mode .search{display:flex !important;}
html.desktop-view-mode .header-social-left{display:flex !important;}
html.desktop-view-mode .header-trust{display:flex !important;}

/* V14: phone PC-version size calibration
   When a visitor switches to PC version on a phone, the site uses an 1180px desktop canvas
   and the viewport is scaled to fit the phone width. This keeps the full desktop layout visible. */
html.desktop-view-mode,
html.desktop-view-mode body{
  min-width:1180px !important;
  width:1180px !important;
  max-width:none !important;
  overflow-x:auto !important;
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}
html.desktop-view-mode .container{
  max-width:1100px !important;
}
html.desktop-view-mode .header-inner{
  max-width:1100px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}
html.desktop-view-mode .view-mode-toggle{
  min-width:168px !important;
  min-height:58px !important;
  padding:14px 24px !important;
  font-size:20px !important;
  border-radius:999px !important;
}
html.desktop-view-mode .main-nav a{
  font-size:22px !important;
}


/* V15: phone desktop-mode header calibration + view-mode language sync
   On phones, the PC version should keep the desktop header proportions after viewport scaling. */
@media (max-width: 1200px) {
  html.desktop-view-mode,
  html.desktop-view-mode body {
    width: 1180px !important;
    min-width: 1180px !important;
    max-width: none !important;
    overflow-x: auto !important;
  }
  html.desktop-view-mode .header,
  html.desktop-view-mode .topbar,
  html.desktop-view-mode main,
  html.desktop-view-mode .hero,
  html.desktop-view-mode .about,
  html.desktop-view-mode .footer {
    width: 1180px !important;
    min-width: 1180px !important;
    max-width: none !important;
    overflow: visible !important;
  }
  html.desktop-view-mode .container,
  html.desktop-view-mode .header .container {
    width: 1100px !important;
    max-width: 1100px !important;
    min-width: 1100px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  html.desktop-view-mode .header-inner {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 14px 22px !important;
    width: 1100px !important;
    max-width: 1100px !important;
    min-width: 1100px !important;
    padding: 18px 0 14px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: visible !important;
  }
  html.desktop-view-mode .header-social-left {
    order: 1 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
  }
  html.desktop-view-mode .brand {
    order: 2 !important;
    display: flex !important;
    flex: 0 0 300px !important;
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    justify-content: flex-start !important;
    text-align: left !important;
  }
  html.desktop-view-mode .brand-title { font-size: 20px !important; }
  html.desktop-view-mode .brand-cn { font-size: 16px !important; display: block !important; }
  html.desktop-view-mode .brand-sub { display: block !important; font-size: 13px !important; }
  html.desktop-view-mode .search {
    order: 3 !important;
    display: flex !important;
    flex: 0 0 360px !important;
    width: 360px !important;
    max-width: 360px !important;
    min-width: 360px !important;
    height: 56px !important;
    max-height: 56px !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
    border-radius: 0 !important;
    aspect-ratio: auto !important;
    transform: none !important;
  }
  html.desktop-view-mode .search input {
    display: block !important;
    width: 360px !important;
    min-width: 360px !important;
    max-width: 360px !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    padding: 0 24px !important;
    margin: 0 !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    font-size: 16px !important;
    line-height: 56px !important;
    box-shadow: none !important;
    aspect-ratio: auto !important;
    transform: none !important;
  }
  html.desktop-view-mode .actions {
    order: 4 !important;
    display: flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    justify-content: flex-end !important;
    gap: 10px !important;
  }
  html.desktop-view-mode .header-trust {
    order: 5 !important;
    display: flex !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 4px 0 0 !important;
    align-items: center !important;
  }
  html.desktop-view-mode .trust-badges,
  html.desktop-view-mode .trust-response {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
    column-gap: 10px !important;
  }
  html.desktop-view-mode .main-nav {
    order: 6 !important;
    display: flex !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 70px !important;
    padding: 18px 0 8px !important;
    margin: 4px 0 0 !important;
    border-top: 1px solid rgba(15,23,42,.10) !important;
    overflow: visible !important;
  }
  html.desktop-view-mode .main-nav a {
    font-size: 22px !important;
    line-height: 1.2 !important;
    padding: 8px 0 !important;
    white-space: nowrap !important;
  }
}

/* V16: enlarge and normalize the PC-version header when opened on a phone.
   Because the desktop canvas is scaled down to fit the phone screen, header text/icons
   need larger desktop-side sizes so they stay readable after scaling. */
@media (max-width: 1200px) {
  html.desktop-view-mode .topbar,
  html.desktop-view-mode.mobile-safe-header .topbar,
  html.desktop-view-mode.force-mobile-header .topbar{
    display:block !important;
    width:1180px !important;
    min-width:1180px !important;
    height:auto !important;
    padding:8px 0 !important;
    font-size:18px !important;
    line-height:1.25 !important;
    letter-spacing:.01em !important;
  }

  html.desktop-view-mode .header,
  html.desktop-view-mode.mobile-safe-header .header,
  html.desktop-view-mode.force-mobile-header .header{
    width:1180px !important;
    min-width:1180px !important;
    overflow:visible !important;
  }

  html.desktop-view-mode .header-inner,
  html.desktop-view-mode.mobile-safe-header .header-inner,
  html.desktop-view-mode.force-mobile-header .header-inner{
    display:grid !important;
    grid-template-columns:130px 360px 410px 210px !important;
    grid-template-rows:auto auto auto !important;
    gap:18px 18px !important;
    align-items:center !important;
    justify-content:center !important;
    width:1120px !important;
    min-width:1120px !important;
    max-width:1120px !important;
    padding:28px 0 18px !important;
    margin:0 auto !important;
    overflow:visible !important;
    text-align:left !important;
  }

  html.desktop-view-mode .header-social-left,
  html.desktop-view-mode.mobile-safe-header .header-social-left,
  html.desktop-view-mode.force-mobile-header .header-social-left{
    grid-column:1 !important;
    grid-row:1 !important;
    display:flex !important;
    flex:none !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:16px !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
  }
  html.desktop-view-mode .header-social-btn,
  html.desktop-view-mode.mobile-safe-header .header-social-btn,
  html.desktop-view-mode.force-mobile-header .header-social-btn{
    width:58px !important;
    height:58px !important;
    flex:0 0 58px !important;
    padding:0 !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
  }
  html.desktop-view-mode .header-social-btn img,
  html.desktop-view-mode.mobile-safe-header .header-social-btn img,
  html.desktop-view-mode.force-mobile-header .header-social-btn img{
    width:56px !important;
    height:56px !important;
    object-fit:contain !important;
  }

  html.desktop-view-mode .brand,
  html.desktop-view-mode.mobile-safe-header .brand,
  html.desktop-view-mode.force-mobile-header .brand{
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    flex:none !important;
    width:360px !important;
    min-width:360px !important;
    max-width:360px !important;
    justify-content:flex-start !important;
    align-items:center !important;
    text-align:left !important;
    gap:12px !important;
    margin:0 !important;
    padding:0 !important;
  }
  html.desktop-view-mode .brand img{width:62px !important;height:62px !important;display:none !important;}
  html.desktop-view-mode .brand-text{display:block !important;min-width:0 !important;}
  html.desktop-view-mode .brand-title{font-size:34px !important;line-height:1.05 !important;font-weight:900 !important;letter-spacing:-.02em !important;}
  html.desktop-view-mode .brand-cn{font-size:24px !important;line-height:1.15 !important;font-weight:800 !important;display:block !important;margin-top:4px !important;}
  html.desktop-view-mode .brand-sub{font-size:18px !important;line-height:1.2 !important;display:block !important;margin-top:5px !important;color:#64748b !important;}

  html.desktop-view-mode .search,
  html.desktop-view-mode.mobile-safe-header .search,
  html.desktop-view-mode.force-mobile-header .search{
    grid-column:3 !important;
    grid-row:1 !important;
    display:flex !important;
    flex:none !important;
    width:410px !important;
    min-width:410px !important;
    max-width:410px !important;
    height:68px !important;
    max-height:68px !important;
    margin:0 !important;
    padding:0 !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:0 !important;
    overflow:visible !important;
    aspect-ratio:auto !important;
    transform:none !important;
  }
  html.desktop-view-mode .search input{
    width:410px !important;
    min-width:410px !important;
    max-width:410px !important;
    height:68px !important;
    min-height:68px !important;
    max-height:68px !important;
    padding:0 28px !important;
    border-radius:999px !important;
    font-size:22px !important;
    font-weight:600 !important;
    line-height:68px !important;
    background:#fff !important;
    border:1px solid #e5e7eb !important;
    box-shadow:0 10px 28px rgba(15,23,42,.06) !important;
    aspect-ratio:auto !important;
    transform:none !important;
  }

  html.desktop-view-mode .actions,
  html.desktop-view-mode.mobile-safe-header .actions,
  html.desktop-view-mode.force-mobile-header .actions{
    grid-column:4 !important;
    grid-row:1 !important;
    display:flex !important;
    flex:none !important;
    width:210px !important;
    min-width:210px !important;
    max-width:210px !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 !important;
  }
  html.desktop-view-mode .actions .btn,
  html.desktop-view-mode .lang-toggle,
  html.desktop-view-mode #waBtn{
    min-height:62px !important;
    padding:16px 18px !important;
    font-size:20px !important;
    font-weight:900 !important;
    border-radius:10px !important;
    white-space:nowrap !important;
  }

  html.desktop-view-mode .header-trust,
  html.desktop-view-mode.mobile-safe-header .header-trust,
  html.desktop-view-mode.force-mobile-header .header-trust{
    grid-column:1 / 5 !important;
    grid-row:2 !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px 16px !important;
    width:100% !important;
    max-width:100% !important;
    margin:4px 0 0 !important;
    padding:0 !important;
    font-size:18px !important;
    line-height:1.2 !important;
    overflow:visible !important;
  }
  html.desktop-view-mode .trust-badges,
  html.desktop-view-mode .trust-response{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    column-gap:12px !important;
    width:100% !important;
    white-space:nowrap !important;
  }
  html.desktop-view-mode .trust-pill{
    padding:7px 14px !important;
    font-size:18px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    justify-content:center !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }
  html.desktop-view-mode .trust-response span{
    font-size:16px !important;
    font-weight:800 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  html.desktop-view-mode .main-nav,
  html.desktop-view-mode.mobile-safe-header .main-nav,
  html.desktop-view-mode.force-mobile-header .main-nav{
    grid-column:1 / 5 !important;
    grid-row:3 !important;
    display:flex !important;
    width:100% !important;
    justify-content:center !important;
    align-items:center !important;
    gap:76px !important;
    padding:20px 0 10px !important;
    margin:4px 0 0 !important;
    border-top:1px solid rgba(15,23,42,.12) !important;
    overflow:visible !important;
  }
  html.desktop-view-mode .main-nav a{
    font-size:30px !important;
    line-height:1.15 !important;
    font-weight:900 !important;
    padding:8px 10px !important;
    white-space:nowrap !important;
  }

  html.desktop-view-mode .view-mode-toggle{
    min-width:260px !important;
    min-height:78px !important;
    padding:18px 30px !important;
    font-size:28px !important;
    line-height:1.1 !important;
    border-radius:999px !important;
    left:26px !important;
    bottom:26px !important;
    box-shadow:0 18px 46px rgba(0,86,214,.42) !important;
  }
}


/* V17: redesign the desktop-on-phone header area for better readability and tighter composition */
@media (max-width: 1200px) {
  html.desktop-view-mode .header,
  html.desktop-view-mode.mobile-safe-header .header,
  html.desktop-view-mode.force-mobile-header .header{
    background:linear-gradient(180deg,#deecfb 0%, #e9f3ff 100%) !important;
    border-bottom:1px solid rgba(15,23,42,.08) !important;
  }

  html.desktop-view-mode .header-inner,
  html.desktop-view-mode.mobile-safe-header .header-inner,
  html.desktop-view-mode.force-mobile-header .header-inner{
    display:grid !important;
    grid-template-columns:88px 350px 430px 220px !important;
    grid-template-rows:auto auto auto !important;
    gap:14px 16px !important;
    align-items:center !important;
    justify-content:center !important;
    width:1120px !important;
    min-width:1120px !important;
    max-width:1120px !important;
    padding:18px 0 14px !important;
    margin:0 auto !important;
    overflow:visible !important;
  }

  html.desktop-view-mode .header-social-left,
  html.desktop-view-mode.mobile-safe-header .header-social-left,
  html.desktop-view-mode.force-mobile-header .header-social-left{
    grid-column:1 !important;
    grid-row:1 !important;
    display:flex !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:12px !important;
    width:88px !important;
    min-width:88px !important;
    margin:0 !important;
    padding:0 !important;
    align-self:center !important;
  }
  html.desktop-view-mode .header-social-btn,
  html.desktop-view-mode.mobile-safe-header .header-social-btn,
  html.desktop-view-mode.force-mobile-header .header-social-btn{
    width:38px !important;
    height:38px !important;
    flex:0 0 38px !important;
  }
  html.desktop-view-mode .header-social-btn img,
  html.desktop-view-mode.mobile-safe-header .header-social-btn img,
  html.desktop-view-mode.force-mobile-header .header-social-btn img{
    width:38px !important;
    height:38px !important;
  }

  html.desktop-view-mode .brand,
  html.desktop-view-mode.mobile-safe-header .brand,
  html.desktop-view-mode.force-mobile-header .brand{
    grid-column:2 !important;
    grid-row:1 !important;
    display:flex !important;
    width:350px !important;
    min-width:350px !important;
    max-width:350px !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
    align-self:center !important;
  }
  html.desktop-view-mode .brand-text{display:block !important;}
  html.desktop-view-mode .brand-title{font-size:30px !important;line-height:1.06 !important;font-weight:900 !important;letter-spacing:-.02em !important;margin:0 !important;}
  html.desktop-view-mode .brand-cn{font-size:19px !important;line-height:1.15 !important;font-weight:800 !important;margin-top:4px !important;color:#334155 !important;}
  html.desktop-view-mode .brand-sub{display:block !important;font-size:15px !important;line-height:1.2 !important;margin-top:5px !important;color:#64748b !important;}

  html.desktop-view-mode .search,
  html.desktop-view-mode.mobile-safe-header .search,
  html.desktop-view-mode.force-mobile-header .search{
    grid-column:3 !important;
    grid-row:1 !important;
    display:flex !important;
    width:430px !important;
    min-width:430px !important;
    max-width:430px !important;
    height:58px !important;
    min-height:58px !important;
    margin:0 !important;
    padding:0 !important;
    align-items:center !important;
    justify-content:center !important;
    align-self:center !important;
  }
  html.desktop-view-mode .search input,
  html.desktop-view-mode.mobile-safe-header .search input,
  html.desktop-view-mode.force-mobile-header .search input{
    width:430px !important;
    min-width:430px !important;
    max-width:430px !important;
    height:58px !important;
    min-height:58px !important;
    padding:0 22px !important;
    border-radius:999px !important;
    font-size:17px !important;
    font-weight:600 !important;
    line-height:58px !important;
    box-shadow:0 6px 18px rgba(15,23,42,.06) !important;
    background:#fff !important;
  }

  html.desktop-view-mode .actions,
  html.desktop-view-mode.mobile-safe-header .actions,
  html.desktop-view-mode.force-mobile-header .actions{
    grid-column:4 !important;
    grid-row:1 !important;
    display:flex !important;
    width:220px !important;
    min-width:220px !important;
    max-width:220px !important;
    justify-content:flex-end !important;
    align-items:center !important;
    gap:10px !important;
    margin:0 !important;
    padding:0 !important;
    align-self:center !important;
  }
  html.desktop-view-mode .actions .btn,
  html.desktop-view-mode .lang-toggle,
  html.desktop-view-mode #waBtn{
    min-height:52px !important;
    padding:12px 16px !important;
    font-size:16px !important;
    font-weight:800 !important;
    border-radius:10px !important;
    box-shadow:0 6px 16px rgba(15,23,42,.08) !important;
  }

  html.desktop-view-mode .header-trust,
  html.desktop-view-mode.mobile-safe-header .header-trust,
  html.desktop-view-mode.force-mobile-header .header-trust{
    grid-column:1 / 5 !important;
    grid-row:2 !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px 14px !important;
    width:1120px !important;
    max-width:1120px !important;
    margin:2px 0 0 !important;
    padding:0 !important;
    align-items:center !important;
  }
  html.desktop-view-mode .trust-badges,
  html.desktop-view-mode .trust-response{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    column-gap:12px !important;
    width:100% !important;
    align-items:center !important;
  }
  html.desktop-view-mode .trust-pill{
    padding:6px 14px !important;
    font-size:14px !important;
    font-weight:800 !important;
    border-radius:999px !important;
    line-height:1.2 !important;
    white-space:nowrap !important;
  }
  html.desktop-view-mode .trust-response span{
    font-size:13px !important;
    font-weight:800 !important;
    color:#0f172a !important;
    white-space:nowrap !important;
  }

  html.desktop-view-mode .main-nav,
  html.desktop-view-mode.mobile-safe-header .main-nav,
  html.desktop-view-mode.force-mobile-header .main-nav{
    grid-column:1 / 5 !important;
    grid-row:3 !important;
    display:flex !important;
    width:1120px !important;
    justify-content:center !important;
    align-items:center !important;
    gap:58px !important;
    padding:14px 0 2px !important;
    margin:2px 0 0 !important;
    border-top:1px solid rgba(15,23,42,.10) !important;
  }
  html.desktop-view-mode .main-nav a{
    font-size:19px !important;
    line-height:1.1 !important;
    font-weight:900 !important;
    letter-spacing:.01em !important;
    padding:4px 6px !important;
  }

  html.desktop-view-mode .view-mode-toggle{
    min-width:210px !important;
    min-height:62px !important;
    padding:14px 24px !important;
    font-size:20px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    left:18px !important;
    bottom:20px !important;
  }
}


/* V18: phone view-mode toggle behavior and sizing refinement */
.view-mode-toggle,
html.desktop-view-mode .view-mode-toggle{
  position:fixed !important;
  left:max(14px, env(safe-area-inset-left)) !important;
  bottom:max(94px, calc(env(safe-area-inset-bottom) + 94px)) !important;
  width:auto !important;
  max-width:min(260px, calc(100vw - 28px)) !important;
  white-space:nowrap !important;
  justify-content:center !important;
  align-items:center !important;
  transform:translateY(0) !important;
  opacity:1 !important;
  pointer-events:auto !important;
  transition:opacity .22s ease, transform .22s ease, box-shadow .22s ease !important;
  z-index:10060 !important;
}
.view-mode-toggle.is-temporarily-hidden,
html.desktop-view-mode .view-mode-toggle.is-temporarily-hidden{
  opacity:0 !important;
  transform:translateY(12px) !important;
  pointer-events:none !important;
}

@media (max-width:920px){
  .view-mode-toggle[data-mode="mobile"]{
    min-width:152px !important;
    min-height:48px !important;
    padding:12px 18px !important;
    font-size:15px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    box-shadow:0 12px 28px rgba(0,86,214,.30) !important;
  }
  .view-mode-toggle[data-mode="desktop"]{
    min-width:220px !important;
    min-height:58px !important;
    padding:15px 24px !important;
    font-size:21px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    box-shadow:0 18px 42px rgba(0,86,214,.38) !important;
  }
}

@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle,
  html.desktop-view-mode.force-mobile-header .view-mode-toggle,
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle{
    left:max(16px, env(safe-area-inset-left)) !important;
    bottom:max(96px, calc(env(safe-area-inset-bottom) + 96px)) !important;
    width:auto !important;
    min-width:230px !important;
    max-width:260px !important;
    min-height:60px !important;
    padding:16px 24px !important;
    font-size:21px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    box-shadow:0 18px 42px rgba(0,86,214,.38) !important;
  }
}


/* V19: keep Desktop/Mobile switch clickable while auto-hide is active */
.view-mode-toggle{
  touch-action:manipulation !important;
  -webkit-user-select:none !important;
  user-select:none !important;
}
.view-mode-toggle:hover,
.view-mode-toggle:focus,
.view-mode-toggle:active{
  opacity:1 !important;
  pointer-events:auto !important;
}


/* V20: make Mobile Version button larger in phone desktop-mode */
@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:280px !important;
    min-height:78px !important;
    padding:20px 34px !important;
    font-size:28px !important;
    font-weight:900 !important;
    border-radius:999px !important;
    left:max(18px, env(safe-area-inset-left)) !important;
    bottom:max(104px, calc(env(safe-area-inset-bottom) + 104px)) !important;
    box-shadow:0 20px 48px rgba(0,86,214,.42) !important;
  }
}

/* Professional conversion optimization update */
.hero-trust-strip{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.hero-trust-strip span{display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.10);color:#e0f2fe;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:800}
.stats{grid-template-columns:repeat(4,1fr)}
.quote-checklist{margin-top:20px;background:linear-gradient(135deg,#0f172a,#12356b);color:#fff;border-radius:24px;padding:22px;display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:center;box-shadow:0 18px 40px rgba(15,23,42,.14)}
.quote-checklist p{margin:0 0 6px;color:#93c5fd;font-weight:900;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
.quote-checklist h3{margin:0;font-size:26px;line-height:1.2}.quote-checklist ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.quote-checklist li{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:10px 12px;color:#f8fafc;font-weight:700;font-size:14px}.quote-checklist li:before{content:'✓';color:#86efac;font-weight:900;margin-right:8px}
.project-quote-link{display:inline-flex;margin-top:14px;align-items:center;justify-content:center;text-decoration:none;background:#0056D6;color:#fff;border-radius:999px;padding:10px 14px;font-weight:900;font-size:13px;box-shadow:0 10px 22px rgba(0,86,214,.18)}
.product-card-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.product-card-cta .btn.small{padding:9px 12px;font-size:12px;min-height:0}.product-card-cta .btn.secondary{background:#eef6ff;border-color:#bfdbfe;color:#0056D6}
.contact-lines b{display:block;margin-bottom:7px}.contact-upgrade .contact-lines b:nth-child(2){color:#0f172a}
.solution-card,.why-item,.project-card-upgrade,.quote-guide-grid article{transition:transform .2s ease, box-shadow .2s ease}.solution-card:hover,.why-item:hover,.project-card-upgrade:hover,.quote-guide-grid article:hover{transform:translateY(-3px);box-shadow:0 18px 48px rgba(15,23,42,.12)}
@media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}.quote-checklist{grid-template-columns:1fr}.quote-checklist ul{grid-template-columns:1fr}.hero-trust-strip span{font-size:12px;padding:7px 10px}.product-card-cta .btn.small{flex:1}}
@media(max-width:560px){.hero-trust-strip{gap:8px}.hero-trust-strip span{width:calc(50% - 4px);justify-content:center;text-align:center}.quote-checklist{padding:18px;border-radius:20px}.quote-checklist h3{font-size:22px}.project-quote-link{width:100%}.stats{grid-template-columns:repeat(2,1fr)!important}.mobile-sticky-whatsapp{left:50%;right:auto;transform:translateX(-50%);bottom:12px;padding:13px 20px;max-width:calc(100vw - 24px);font-size:14px}}
html.desktop-view-mode .hero-trust-strip{max-width:680px}
html.desktop-view-mode .quote-checklist ul{grid-template-columns:repeat(3,1fr)}


/* Product-list professional copy and CTA optimization */
.card .desc{
  color:#435775;
  font-size:14.5px;
  line-height:1.62;
  min-height:92px;
  margin-top:4px;
}
.card-body h3{margin-bottom:10px;}
.product-card-cta{display:flex;gap:10px;align-items:center;margin-top:12px;}
.product-card-cta .btn.small{min-height:42px;display:inline-flex;align-items:center;justify-content:center;flex:1 1 auto;white-space:nowrap;}
.product-card-cta .btn.secondary.small{flex:0 0 78px;}
.quick-specs{margin-top:14px;}
.quick-specs span{background:linear-gradient(180deg,#ffffff,#f8fbff);border-color:#dbe7f5;}
@media(max-width:680px){.card .desc{font-size:15px;line-height:1.6;min-height:auto;margin-bottom:10px}.product-card-cta{gap:8px}.product-card-cta .btn.small{font-size:13px;padding-left:10px;padding-right:10px}.product-card-cta .btn.secondary.small{flex:0 0 74px}}
@media(min-width:681px) and (max-width:1200px){.card .desc{min-height:112px}}


/* Solution cards and quick selection steps upgrade */
.solution-grid{align-items:stretch;}
.solution-card{display:flex;flex-direction:column;min-height:100%;}
.solution-card p{margin-bottom:14px;}
.solution-points{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:8px;}
.solution-points li{position:relative;padding-left:18px;font-weight:800;color:#0f172a;line-height:1.5;}
.solution-points li::before{content:"";position:absolute;left:0;top:.7em;width:8px;height:8px;border-radius:999px;background:#22c55e;transform:translateY(-50%);}
.solution-card a{margin-top:auto;font-size:18px;line-height:1.25;}
.selection-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;}
.selection-step{background:#fff;border:1px solid #e5e7eb;border-radius:22px;box-shadow:0 14px 40px rgba(15,23,42,.08);padding:20px;}
.step-number{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;background:#0056D6;color:#fff;font-weight:900;font-size:22px;margin-bottom:14px;}
.selection-step h3{margin:0 0 10px;color:#1A1A1A;font-size:18px;line-height:1.3;}
.selection-step p{margin:0;color:#64748b;line-height:1.7;font-size:14px;}
@media(max-width:1100px){.solution-grid{grid-template-columns:repeat(2,1fr);}.selection-steps{grid-template-columns:1fr 1fr;}}
@media(max-width:680px){.selection-steps{grid-template-columns:1fr;}.solution-card a{font-size:16px;}}

/* WhatsApp-first conversion upgrades */
.best-for{margin:12px 0 14px;padding:10px 12px;border-radius:14px;background:#f0fdf4;border:1px solid #bbf7d0;color:#334155;line-height:1.55;font-size:14px;}
.best-for b{color:#16a34a;margin-right:4px;}
.product-card-cta .btn.green{box-shadow:0 10px 22px rgba(22,163,74,.22);font-weight:900;}
.product-card-cta .btn.secondary{font-weight:800;}
.pitch-comparison{padding:36px 0 20px;}
.pitch-table-wrap{background:#fff;border:1px solid #e5e7eb;border-radius:24px;box-shadow:0 14px 40px rgba(15,23,42,.08);overflow:auto;}
.pitch-table{width:100%;border-collapse:collapse;min-width:760px;}
.pitch-table th,.pitch-table td{padding:16px 18px;text-align:left;border-bottom:1px solid #e5e7eb;color:#334155;line-height:1.55;}
.pitch-table th{background:#f8fafc;color:#0056D6;text-transform:uppercase;font-size:13px;letter-spacing:.05em;}
.pitch-table tbody tr:last-child td{border-bottom:0;}
.pitch-table td:first-child{font-size:18px;color:#0f172a;}
.pitch-whatsapp-cta{margin-top:16px;padding:16px 18px;border-radius:20px;background:#ecfdf5;border:1px solid #bbf7d0;display:flex;align-items:center;justify-content:space-between;gap:14px;}
.pitch-whatsapp-cta span{font-weight:900;color:#0f172a;}
.quality-photo-section{padding:62px 0;background:#fff;}
.quality-photo-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.quality-photo-grid article{background:#fff;border:1px solid #e5e7eb;border-radius:22px;box-shadow:0 14px 40px rgba(15,23,42,.08);overflow:hidden;}
.quality-photo-grid img{width:100%;aspect-ratio:4/3;object-fit:contain;display:block;background:#07111b;padding:0;border-radius:0;}
.quality-photo-grid div{padding:16px;}
.quality-photo-grid b{display:block;color:#0f172a;font-size:17px;margin-bottom:8px;}
.quality-photo-grid p{margin:0;color:#64748b;line-height:1.7;font-size:14px;}
.buying-process-steps{grid-template-columns:repeat(3,1fr);}
.contact-upgrade .btn.green,.mobile-sticky-whatsapp,#waBtn,#heroWa,#sideWa{font-weight:900;}
.contact-upgrade .btn.green{font-size:18px;padding:14px 22px;box-shadow:0 12px 28px rgba(22,163,74,.25);}
@media(max-width:1100px){.quality-photo-grid{grid-template-columns:repeat(2,1fr)}.buying-process-steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.pitch-comparison{padding:28px 0 16px}.pitch-table-wrap{border-radius:18px}.pitch-table{min-width:680px}.pitch-table th,.pitch-table td{padding:13px 14px;font-size:13px}.pitch-whatsapp-cta{flex-direction:column;align-items:flex-start}.pitch-whatsapp-cta .btn{width:100%;justify-content:center}.quality-photo-grid{grid-template-columns:1fr}.buying-process-steps{grid-template-columns:1fr}.best-for{font-size:13px}.contact-upgrade .btn.green{width:100%;justify-content:center}}


/* FIX: show full Quality Control images without cropping (desktop, mobile, EN/ES) */
.quality-photo-grid img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:4/3 !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#07111b !important;
  display:block !important;
}
.quality-photo-grid article{overflow:hidden !important;}
@media(max-width:1100px){.quality-photo-grid img{aspect-ratio:4/3 !important;object-fit:contain !important;}}
@media(max-width:680px){.quality-photo-grid img{aspect-ratio:4/3 !important;object-fit:contain !important;}}

/* FINAL FIX: Quality Control images must display complete original artwork, no cropping */
.quality-photo-grid img{
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#07111b !important;
  display:block !important;
}
.quality-photo-grid article{
  overflow:hidden !important;
  align-self:start !important;
}
@media(max-width:1100px){
  .quality-photo-grid img{height:auto !important;aspect-ratio:auto !important;object-fit:contain !important;}
}
@media(max-width:680px){
  .quality-photo-grid img{height:auto !important;aspect-ratio:auto !important;object-fit:contain !important;}
}

/* FINAL LAYOUT FIX: QC artwork uses uniform landscape cards, no tall portrait cards */
.quality-photo-grid img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:16/9 !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#07111b !important;
  display:block !important;
}
.quality-photo-grid article{
  align-self:stretch !important;
  display:flex !important;
  flex-direction:column !important;
}
.quality-photo-grid article > div{
  flex:1 1 auto !important;
}
@media(max-width:1100px){
  .quality-photo-grid img{aspect-ratio:16/9 !important;object-fit:contain !important;}
}
@media(max-width:680px){
  .quality-photo-grid img{aspect-ratio:16/9 !important;object-fit:contain !important;}
}

/* USER REQUEST FIX: enlarge Quality Control screenshot cards for readability */
.quality-photo-section .container{
  max-width:1500px !important;
}
.quality-photo-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:32px !important;
}
.quality-photo-grid article{
  border-radius:26px !important;
  box-shadow:0 18px 48px rgba(15,23,42,.12) !important;
}
.quality-photo-grid img{
  width:100% !important;
  height:auto !important;
  aspect-ratio:16/9 !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#07111b !important;
  display:block !important;
}
.quality-photo-grid article > div{
  padding:20px 22px 24px !important;
}
.quality-photo-grid b{
  font-size:22px !important;
  line-height:1.25 !important;
}
.quality-photo-grid p{
  font-size:16px !important;
  line-height:1.75 !important;
}
@media(max-width:900px){
  .quality-photo-grid{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
}
@media(max-width:680px){
  .quality-photo-section{padding:46px 0 !important;}
  .quality-photo-grid article > div{padding:18px !important;}
  .quality-photo-grid b{font-size:20px !important;}
  .quality-photo-grid p{font-size:15px !important;}
}

/* Update: phone visitors open the desktop-on-phone version by default; make the switch button larger and higher */
@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:330px !important;
    min-height:88px !important;
    padding:22px 38px !important;
    font-size:31px !important;
    line-height:1.08 !important;
    left:max(20px, env(safe-area-inset-left)) !important;
    bottom:max(168px, calc(env(safe-area-inset-bottom) + 168px)) !important;
    border-radius:999px !important;
    box-shadow:0 24px 56px rgba(0,86,214,.45) !important;
  }
}
@media (max-width:560px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:300px !important;
    min-height:82px !important;
    padding:20px 34px !important;
    font-size:29px !important;
    bottom:max(156px, calc(env(safe-area-inset-bottom) + 156px)) !important;
  }
}

/* FINAL SYNC FIX: product list mobile/desktop refinements */
@media (max-width: 680px){
  .quick-specs{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important;}
  .quick-specs span{padding:10px 12px !important;min-height:0 !important;font-size:12.5px !important;line-height:1.4 !important;}
  .quick-specs em{font-size:10.5px !important;margin-bottom:4px !important;}
  .mobile-sticky-whatsapp{left:50% !important;right:auto !important;transform:translateX(-50%) !important;width:max-content !important;max-width:calc(100vw - 32px) !important;white-space:nowrap !important;padding:13px 22px !important;bottom:max(12px, env(safe-area-inset-bottom)) !important;}
}
@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:320px !important;
    min-height:88px !important;
    padding:24px 40px !important;
    font-size:32px !important;
    left:max(22px, env(safe-area-inset-left)) !important;
    bottom:max(142px, calc(env(safe-area-inset-bottom) + 142px)) !important;
    border-radius:999px !important;
    box-shadow:0 22px 54px rgba(0,86,214,.44) !important;
  }
}

/* Search result jump highlight */

/* Search confirmation button: Alibaba-style search bar update */
.search{
  display:flex !important;
  align-items:center !important;
  gap:0 !important;
  background:#fffdfa !important;
  border:2px solid #ff6d0b !important;
  border-radius:999px !important;
  overflow:hidden !important;
  padding:0 !important;
  box-shadow:none !important;
}
.search input{
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  border:0 !important;
  outline:none !important;
  box-shadow:none !important;
  border-radius:999px 0 0 999px !important;
  background:#fffdfa !important;
  color:#666666 !important;
  padding:0 22px !important;
}
.search input::placeholder{color:#929292 !important;opacity:1 !important;}
.search-confirm-btn{
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:calc(100% - 8px) !important;
  min-height:42px !important;
  margin:4px !important;
  padding:0 26px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#ff6d0b !important;
  color:#fff !important;
  font-weight:900 !important;
  font-size:15px !important;
  line-height:1 !important;
  cursor:pointer !important;
  white-space:nowrap !important;
  box-shadow:none !important;
  -webkit-tap-highlight-color:transparent !important;
}
.search-confirm-btn:hover,.search-confirm-btn:focus{background:#f56300 !important;box-shadow:none !important;}
.search-result-focus{box-shadow:0 0 0 4px rgba(245,160,0,.20),0 12px 28px rgba(15,23,42,.10) !important;transform:translateY(-2px) !important;}

@media(max-width:768px){
  .search,
  html.force-mobile-header .search,
  html.mobile-safe-header .search{
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    height:48px !important;
    margin:0 !important;
    order:3 !important;
  }
  .search input{height:44px !important;min-height:44px !important;font-size:14px !important;line-height:44px !important;padding:0 14px !important;}
  .search-confirm-btn{min-height:38px !important;height:38px !important;padding:0 16px !important;font-size:14px !important;}
}

@media(max-width:1200px){
  html.desktop-view-mode .search,
  html.desktop-view-mode.mobile-safe-header .search,
  html.desktop-view-mode.force-mobile-header .search{
    display:flex !important;
    width:430px !important;
    min-width:430px !important;
    max-width:430px !important;
    height:58px !important;
    min-height:58px !important;
    border:2px solid #ff6a00 !important;
    border-radius:999px !important;
    overflow:hidden !important;
    align-items:center !important;
    justify-content:flex-start !important;
    background:#fff !important;
  }
  html.desktop-view-mode .search input,
  html.desktop-view-mode.mobile-safe-header .search input,
  html.desktop-view-mode.force-mobile-header .search input{
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:54px !important;
    min-height:54px !important;
    max-height:54px !important;
    line-height:54px !important;
    border:0 !important;
    padding:0 18px !important;
    font-size:17px !important;
    border-radius:999px 0 0 999px !important;
  }
  html.desktop-view-mode .search-confirm-btn,
  html.desktop-view-mode.mobile-safe-header .search-confirm-btn,
  html.desktop-view-mode.force-mobile-header .search-confirm-btn{
    height:50px !important;
    min-height:50px !important;
    padding:0 24px !important;
    font-size:18px !important;
  }
}


/* Final cache fix for search button v3: duplicated at end so it wins over older responsive rules. */
.search{display:flex !important;align-items:center !important;gap:0 !important;background:#fffdfa !important;border:2px solid #ff6d0b !important;border-radius:999px !important;overflow:hidden !important;padding:0 !important;box-shadow:none !important;box-sizing:border-box !important;}
.search input{flex:1 1 auto !important;width:auto !important;min-width:0 !important;max-width:none !important;height:52px !important;min-height:52px !important;line-height:52px !important;border:0 !important;outline:none !important;box-shadow:none !important;border-radius:999px 0 0 999px !important;background:#fffdfa !important;color:#666666 !important;padding:0 22px !important;box-sizing:border-box !important;}
.search input::placeholder{color:#929292 !important;opacity:1 !important;}
.search-confirm-btn{display:inline-flex !important;align-items:center !important;justify-content:center !important;flex:0 0 auto !important;height:44px !important;min-height:44px !important;margin:4px !important;padding:0 26px !important;border:0 !important;border-radius:999px !important;appearance:none !important;-webkit-appearance:none !important;background:#ff6d0b !important;color:#fff !important;font-family:inherit !important;font-weight:900 !important;font-size:16px !important;line-height:1 !important;cursor:pointer !important;white-space:nowrap !important;box-shadow:none !important;-webkit-tap-highlight-color:transparent !important;}
.search-confirm-btn:hover,.search-confirm-btn:focus{background:#f56300 !important;box-shadow:none !important;}
.search-result-focus{box-shadow:0 0 0 4px rgba(245,160,0,.20),0 12px 28px rgba(15,23,42,.10) !important;transform:translateY(-2px) !important;}
@media(max-width:768px){.search,html.force-mobile-header .search,html.mobile-safe-header .search{display:flex !important;width:100% !important;max-width:100% !important;min-width:0 !important;height:48px !important;margin:0 !important;order:3 !important;}.search input{height:44px !important;min-height:44px !important;line-height:44px !important;font-size:14px !important;padding:0 14px !important;}.search-confirm-btn{height:38px !important;min-height:38px !important;margin:4px !important;padding:0 18px !important;font-size:14px !important;}}
@media(max-width:1200px){html.desktop-view-mode .search,html.desktop-view-mode.mobile-safe-header .search,html.desktop-view-mode.force-mobile-header .search{display:flex !important;width:430px !important;min-width:430px !important;max-width:430px !important;height:58px !important;min-height:58px !important;border:2px solid #ff6d0b !important;border-radius:999px !important;overflow:hidden !important;align-items:center !important;justify-content:flex-start !important;background:#fffdfa !important;}html.desktop-view-mode .search input,html.desktop-view-mode.mobile-safe-header .search input,html.desktop-view-mode.force-mobile-header .search input{flex:1 1 auto !important;width:auto !important;min-width:0 !important;max-width:none !important;height:54px !important;min-height:54px !important;max-height:54px !important;line-height:54px !important;border:0 !important;padding:0 20px !important;font-size:17px !important;border-radius:999px 0 0 999px !important;}html.desktop-view-mode .search-confirm-btn,html.desktop-view-mode.mobile-safe-header .search-confirm-btn,html.desktop-view-mode.force-mobile-header .search-confirm-btn{height:48px !important;min-height:48px !important;margin:4px !important;padding:0 28px !important;font-size:18px !important;}}

/* Factory video gallery: real production / testing / packing videos */
.factory-video-section{padding:64px 0;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%);border-top:1px solid #e5edf8;border-bottom:1px solid #e5edf8;}
.factory-video-title{max-width:1240px;margin-left:auto;margin-right:auto;}
.factory-video-note{max-width:1240px;margin:0 auto 32px;padding:15px 20px;border:1px solid #bfdbfe;background:#eff6ff;color:#1e40af;border-radius:16px;font-weight:800;text-align:center;}
.factory-video-group{margin-top:30px;}
.factory-video-group-title{display:block;margin:0 0 18px;border-left:5px solid #ff6d0b;padding:10px 0 10px 16px;background:linear-gradient(90deg,rgba(255,109,11,.06),rgba(255,255,255,0));border-radius:0 14px 14px 0;}
.factory-video-group-title h3{margin:0;color:#0f172a;font-size:24px;line-height:1.2;font-weight:900;}
.factory-video-group-title p{display:block;margin:8px 0 0;max-width:760px;color:#536a8b;line-height:1.6;font-size:14px;text-align:left;}
.factory-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;}
.factory-video-card{background:#fff;border:1px solid #e5e7eb;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(15,23,42,.08);transition:transform .2s ease,box-shadow .2s ease;}
.factory-video-card:hover{transform:translateY(-3px);box-shadow:0 18px 46px rgba(15,23,42,.13);}
.factory-video-media{background:#07111b;aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.factory-video-media video{width:100%;height:100%;object-fit:cover;display:block;background:#07111b;}
.factory-video-copy{padding:18px 18px 20px;}
.factory-video-copy span{display:inline-flex;margin-bottom:8px;padding:5px 9px;border-radius:999px;background:#fff7ed;border:1px solid #fed7aa;color:#c2410c;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;}
.factory-video-copy h4{margin:0 0 8px;color:#111827;font-size:19px;line-height:1.32;}
.factory-video-copy p{margin:0;color:#64748b;font-size:15px;line-height:1.65;}
html.desktop-view-mode .factory-video-section{min-width:0;}
html.desktop-view-mode .factory-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
@media(max-width:1100px){.factory-video-grid{grid-template-columns:1fr;gap:20px;}.factory-video-group-title p{max-width:100%;}}
@media(max-width:760px){.factory-video-section{padding:42px 0;}.factory-video-note{text-align:left;font-size:13px}.factory-video-grid{grid-template-columns:1fr;gap:18px}.factory-video-group-title{margin-bottom:14px;padding:9px 0 9px 12px}.factory-video-group-title h3{font-size:20px}.factory-video-group-title p{font-size:13px;line-height:1.55}.factory-video-copy{padding:16px}.factory-video-copy h4{font-size:17px}.factory-video-copy p{font-size:13.5px}.factory-video-copy span{font-size:10px}}
@media(max-width:460px){.factory-video-grid{grid-template-columns:1fr}.factory-video-media{aspect-ratio:16/10}.factory-video-copy h4{font-size:16px}.factory-video-copy p{font-size:13px}}


/* Final update: faster factory videos + smaller always-visible phone view switch buttons */
.view-mode-toggle.is-temporarily-hidden,
html.desktop-view-mode .view-mode-toggle.is-temporarily-hidden{
  opacity:1 !important;
  transform:translateY(0) !important;
  pointer-events:auto !important;
}
@media (max-width:920px){
  .view-mode-toggle[data-mode="mobile"]{
    min-width:126px !important;
    max-width:170px !important;
    min-height:40px !important;
    padding:9px 14px !important;
    font-size:13px !important;
    line-height:1.05 !important;
    left:max(12px, env(safe-area-inset-left)) !important;
    bottom:max(86px, calc(env(safe-area-inset-bottom) + 86px)) !important;
    border-radius:999px !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}
@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:220px !important;
    max-width:260px !important;
    min-height:60px !important;
    padding:15px 24px !important;
    font-size:22px !important;
    line-height:1.05 !important;
    left:max(16px, env(safe-area-inset-left)) !important;
    bottom:max(122px, calc(env(safe-area-inset-bottom) + 122px)) !important;
    border-radius:999px !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}
@media (max-width:560px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:200px !important;
    max-width:240px !important;
    min-height:56px !important;
    padding:14px 22px !important;
    font-size:20px !important;
    bottom:max(116px, calc(env(safe-area-inset-bottom) + 116px)) !important;
  }
}


/* V24: faster rendering + always-visible, adjusted phone view-mode buttons */
.factory-video-section{
  content-visibility:auto;
  contain-intrinsic-size:1200px;
}
.factory-video-card{
  content-visibility:auto;
  contain-intrinsic-size:420px;
}
.view-mode-toggle.is-temporarily-hidden,
html.desktop-view-mode .view-mode-toggle.is-temporarily-hidden{
  opacity:1 !important;
  transform:translateY(0) !important;
  pointer-events:auto !important;
}
@media (max-width:920px){
  .view-mode-toggle[data-mode="mobile"]{
    min-width:118px !important;
    max-width:152px !important;
    min-height:38px !important;
    padding:8px 13px !important;
    font-size:12.5px !important;
    line-height:1.05 !important;
    left:max(12px, env(safe-area-inset-left)) !important;
    bottom:max(86px, calc(env(safe-area-inset-bottom) + 86px)) !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}
@media (max-width:1200px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:260px !important;
    max-width:310px !important;
    min-height:72px !important;
    padding:18px 30px !important;
    font-size:27px !important;
    line-height:1.05 !important;
    left:max(18px, env(safe-area-inset-left)) !important;
    bottom:max(126px, calc(env(safe-area-inset-bottom) + 126px)) !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}
@media (max-width:560px){
  html.desktop-view-mode .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.force-mobile-header .view-mode-toggle[data-mode="desktop"],
  html.desktop-view-mode.mobile-safe-header .view-mode-toggle[data-mode="desktop"]{
    min-width:238px !important;
    max-width:286px !important;
    min-height:66px !important;
    padding:17px 28px !important;
    font-size:25px !important;
    bottom:max(122px, calc(env(safe-area-inset-bottom) + 122px)) !important;
  }
}


/* Custom lightweight factory video player: big play/pause button, click-to-load for faster pages */
.factory-video-media{position:relative;}
.factory-video-media video{cursor:pointer;}
.factory-video-toggle{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:92px !important;
  height:92px !important;
  border:0 !important;
  border-radius:999px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:rgba(255,255,255,.92) !important;
  color:#111827 !important;
  box-shadow:0 16px 40px rgba(0,0,0,.22) !important;
  z-index:5 !important;
  cursor:pointer !important;
  font-family:Arial, sans-serif !important;
  line-height:1 !important;
  -webkit-tap-highlight-color:transparent !important;
}
.factory-video-toggle .factory-icon-play{
  display:block !important;
  font-size:46px !important;
  margin-left:7px !important;
}
.factory-video-toggle .factory-icon-pause{
  display:none !important;
  font-size:42px !important;
  font-weight:900 !important;
  letter-spacing:-10px !important;
  transform:translateX(-5px) !important;
}
.factory-video-media.is-playing .factory-video-toggle{
  opacity:.82 !important;
  width:74px !important;
  height:74px !important;
}
.factory-video-media.is-playing .factory-video-toggle .factory-icon-play{display:none !important;}
.factory-video-media.is-playing .factory-video-toggle .factory-icon-pause{display:block !important;}
.factory-video-media.is-playing:hover .factory-video-toggle,
.factory-video-media.is-playing:focus-within .factory-video-toggle{opacity:.95 !important;}
.factory-video-media::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:44px !important;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.38)) !important;
  pointer-events:none !important;
}
@media(max-width:760px){
  .factory-video-toggle{width:82px !important;height:82px !important;}
  .factory-video-toggle .factory-icon-play{font-size:42px !important;}
  .factory-video-media.is-playing .factory-video-toggle{width:68px !important;height:68px !important;}
}
@media(max-width:460px){
  .factory-video-toggle{width:76px !important;height:76px !important;}
  .factory-video-toggle .factory-icon-play{font-size:38px !important;}
}


/* Final factory video control behavior: hide center button while video is playing */
.factory-video-media.is-playing .factory-video-toggle{
  opacity:0 !important;
  pointer-events:none !important;
  transform:translate(-50%,-50%) scale(.92) !important;
}
.factory-video-media.is-playing:hover .factory-video-toggle,
.factory-video-media.is-playing:focus-within .factory-video-toggle{
  opacity:0 !important;
  pointer-events:none !important;
}
.factory-video-media:not(.is-playing) .factory-video-toggle{
  opacity:1 !important;
  pointer-events:auto !important;
}
.factory-video-media:not(.is-playing) .factory-video-toggle .factory-icon-play{
  display:block !important;
}
.factory-video-media:not(.is-playing) .factory-video-toggle .factory-icon-pause{
  display:none !important;
}


/* Phone Desktop Version: make product detail modal complete and fully scrollable */
@media (max-width:1200px){
  html.desktop-view-mode .product-detail-modal:not(.hide),
  html.desktop-view-mode.mobile-safe-header .product-detail-modal:not(.hide),
  html.desktop-view-mode.force-mobile-header .product-detail-modal:not(.hide){
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    max-width:100vw !important;
    max-height:100vh !important;
    overflow:hidden !important;
    z-index:10080 !important;
    box-sizing:border-box !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-panel,
  html.desktop-view-mode.mobile-safe-header .product-detail-modal:not(.hide) .product-detail-panel,
  html.desktop-view-mode.force-mobile-header .product-detail-modal:not(.hide) .product-detail-panel{
    position:relative !important;
    display:block !important;
    width:calc(100vw - 32px) !important;
    max-width:calc(100vw - 32px) !important;
    min-width:0 !important;
    height:calc(100vh - 32px) !important;
    max-height:calc(100vh - 32px) !important;
    margin:16px auto !important;
    padding:20px !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    box-sizing:border-box !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) #productDetailContent,
  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-grid{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr) !important;
    gap:18px !important;
    clear:both !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-gallery,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-info,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-section{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
    padding:16px !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-main{
    height:420px !important;
    max-height:46vh !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-section{
    grid-column:1 / -1 !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-thumbs{
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-desc,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-info h1,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-section p,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-supplier span,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-specs th,
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-specs td{
    overflow-wrap:anywhere !important;
    word-break:normal !important;
  }

  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-close{
    position:sticky !important;
    top:0 !important;
    right:0 !important;
    z-index:20 !important;
  }

  html.desktop-view-mode.modal-open,
  html.desktop-view-mode body.modal-open{
    overflow:hidden !important;
  }
}
@media (max-width:760px){
  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-panel{
    width:calc(100vw - 20px) !important;
    max-width:calc(100vw - 20px) !important;
    height:calc(100vh - 20px) !important;
    max-height:calc(100vh - 20px) !important;
    margin:10px auto !important;
    padding:14px !important;
  }
  html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-main{
    height:360px !important;
    max-height:42vh !important;
  }
  html.desktop-view-mode .product-detail-modal:not(.hide) .detail-price-box{
    grid-template-columns:1fr !important;
  }
}


/* Facebook in-app browser + phone Desktop Version:
   Use full product detail page with complete width instead of clipped modal. */
html.desktop-view-mode.product-page-mode,
html.desktop-view-mode.product-page-mode body,
html.desktop-view-mode.fb-browser.product-page-mode,
html.desktop-view-mode.fb-browser.product-page-mode body{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  overflow-x:hidden !important;
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}
html.desktop-view-mode.product-page-mode .fb-product-page,
html.desktop-view-mode.fb-browser.product-page-mode .fb-product-page{
  width:100% !important;
  max-width:100vw !important;
  min-width:0 !important;
  overflow-x:hidden !important;
  padding-left:12px !important;
  padding-right:12px !important;
}
html.desktop-view-mode.product-page-mode .fb-product-page .product-detail-grid,
html.desktop-view-mode.fb-browser.product-page-mode .fb-product-page .product-detail-grid{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}
html.desktop-view-mode.product-page-mode .fb-product-page .detail-gallery,
html.desktop-view-mode.product-page-mode .fb-product-page .detail-info,
html.desktop-view-mode.product-page-mode .fb-product-page .detail-section{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  overflow:hidden !important;
}

/* Final Facebook in-app product detail safe mode:
   switch product detail page back to real phone viewport so it is not squeezed to the left. */
html.fb-product-detail-safe-mode,
html.fb-product-detail-safe-mode body,
html.fb-product-detail-safe-mode.product-page-mode,
html.fb-product-detail-safe-mode.product-page-mode body{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
  background:#fff !important;
  -webkit-text-size-adjust:100% !important;
  text-size-adjust:100% !important;
}

html.fb-product-detail-safe-mode .fb-product-page{
  display:block !important;
  width:100% !important;
  max-width:100vw !important;
  min-width:0 !important;
  margin:0 auto !important;
  padding:12px 12px 30px !important;
  box-sizing:border-box !important;
  overflow-x:hidden !important;
}

html.fb-product-detail-safe-mode .fb-product-page .product-detail-grid{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-gallery,
html.fb-product-detail-safe-mode .fb-product-page .detail-info,
html.fb-product-detail-safe-mode .fb-product-page .detail-section{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 0 14px !important;
  padding:14px !important;
  border-radius:18px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-main{
  width:100% !important;
  height:360px !important;
  max-height:48vh !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-main img,
html.fb-product-detail-safe-mode .fb-product-page .detail-main video{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-thumbs{
  width:100% !important;
  max-width:100% !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-price-box{
  grid-template-columns:1fr !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-specs,
html.fb-product-detail-safe-mode .fb-product-page .detail-specs tbody,
html.fb-product-detail-safe-mode .fb-product-page .detail-specs tr,
html.fb-product-detail-safe-mode .fb-product-page .detail-specs th,
html.fb-product-detail-safe-mode .fb-product-page .detail-specs td{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-specs tr{
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  overflow:hidden !important;
  margin-bottom:8px !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-specs th,
html.fb-product-detail-safe-mode .fb-product-page .detail-specs td{
  border:0 !important;
  padding:9px 10px !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}

html.fb-product-detail-safe-mode .fb-product-page .fb-product-page-close{
  position:fixed !important;
  top:calc(env(safe-area-inset-top) + 12px) !important;
  right:12px !important;
  z-index:99999 !important;
}

/* Larger Facebook/mobile product detail back button and reliable return position */
html.fb-product-detail-safe-mode .fb-product-page .fb-product-page-back,
.fb-product-page .fb-product-page-back{
  position:sticky !important;
  top:calc(env(safe-area-inset-top) + 8px) !important;
  left:12px !important;
  z-index:99999 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:108px !important;
  min-height:48px !important;
  padding:12px 18px !important;
  margin:0 0 12px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font-size:17px !important;
  line-height:1 !important;
  font-weight:900 !important;
  box-shadow:0 12px 28px rgba(0,86,214,.28) !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
}
html.fb-product-detail-safe-mode .fb-product-page .fb-product-page-back:active,
.fb-product-page .fb-product-page-back:active{
  transform:translateY(1px) !important;
}
.return-highlight{
  box-shadow:0 0 0 5px rgba(255,106,0,.35),0 18px 46px rgba(15,23,42,.16) !important;
  transform:translateY(-2px) !important;
}

/* Center Facebook in-app product detail page and use larger blue Back button across mobile product details */
html.fb-product-detail-safe-mode .fb-product-page{
  width:calc(100vw - 24px) !important;
  max-width:430px !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

html.fb-product-detail-safe-mode .fb-product-page .detail-gallery,
html.fb-product-detail-safe-mode .fb-product-page .detail-info,
html.fb-product-detail-safe-mode .fb-product-page .detail-section{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

html.fb-product-detail-safe-mode .fb-product-page .fb-product-page-back,
.fb-product-page .fb-product-page-back{
  min-width:112px !important;
  min-height:52px !important;
  padding:13px 20px !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  border:0 !important;
  font-size:18px !important;
  font-weight:900 !important;
  box-shadow:0 14px 30px rgba(0,86,214,.30) !important;
}

/* Mobile product modal close button becomes a clear blue Back button */
.product-detail-close.mobile-product-back-btn{
  float:none !important;
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  right:auto !important;
  z-index:30 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:112px !important;
  height:auto !important;
  min-height:52px !important;
  padding:13px 20px !important;
  margin:0 0 14px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 14px 30px rgba(0,86,214,.30) !important;
}

@media(max-width:760px){
  html.fb-product-detail-safe-mode .fb-product-page{
    width:calc(100vw - 20px) !important;
    max-width:430px !important;
  }
  .product-detail-close.mobile-product-back-btn{
    min-width:106px !important;
    min-height:50px !important;
    font-size:17px !important;
    padding:12px 18px !important;
  }
}

/* Desktop also follows: product detail modal uses the same large blue Back / Volver button */
.product-detail-close.product-detail-back-btn-all,
.product-detail-close.mobile-product-back-btn{
  float:none !important;
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  right:auto !important;
  z-index:40 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:112px !important;
  height:auto !important;
  min-height:52px !important;
  padding:13px 20px !important;
  margin:0 0 16px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font-size:18px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 14px 30px rgba(0,86,214,.30) !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
}

.product-detail-close.product-detail-back-btn-all:hover,
.product-detail-close.mobile-product-back-btn:hover{
  background:#0048b5 !important;
  box-shadow:0 16px 34px rgba(0,86,214,.36) !important;
}

.product-detail-close.product-detail-back-btn-all:active,
.product-detail-close.mobile-product-back-btn:active{
  transform:translateY(1px) !important;
}

/* Keep the modal content below the big Back button on desktop and mobile */
.product-detail-panel .product-detail-grid{
  clear:both !important;
}

@media(max-width:760px){
  .product-detail-close.product-detail-back-btn-all,
  .product-detail-close.mobile-product-back-btn{
    min-width:106px !important;
    min-height:50px !important;
    font-size:17px !important;
    padding:12px 18px !important;
    margin-bottom:14px !important;
  }
}

/* FINAL v2: Facebook in-app product detail page true center alignment */
html.fb-product-detail-centered,
html.fb-product-detail-centered body,
html.fb-product-detail-centered.product-page-mode,
html.fb-product-detail-centered.product-page-mode body{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  overflow-x:hidden !important;
  background:#fff !important;
}

html.fb-product-detail-centered body{
  display:flex !important;
  justify-content:center !important;
  align-items:flex-start !important;
}

html.fb-product-detail-centered .fb-product-page{
  flex:0 1 480px !important;
  width:calc(100vw - 16px) !important;
  max-width:480px !important;
  min-width:0 !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding:12px 0 30px !important;
  box-sizing:border-box !important;
  overflow-x:hidden !important;
}

html.fb-product-detail-centered .fb-product-page .product-detail-grid,
html.fb-product-detail-centered .fb-product-page .detail-gallery,
html.fb-product-detail-centered .fb-product-page .detail-info,
html.fb-product-detail-centered .fb-product-page .detail-section{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-left:0 !important;
  margin-right:0 !important;
  box-sizing:border-box !important;
}

html.fb-product-detail-centered .fb-product-page .detail-gallery,
html.fb-product-detail-centered .fb-product-page .detail-info,
html.fb-product-detail-centered .fb-product-page .detail-section{
  padding:14px !important;
  border-radius:18px !important;
}

@media(max-width:520px){
  html.fb-product-detail-centered .fb-product-page{
    width:calc(100vw - 16px) !important;
    max-width:calc(100vw - 16px) !important;
  }
}

/* Stronger return-to-product behavior for Facebook / Instagram mobile in-app browsers */
.card[id^="product-"],
.card[data-id]{
  scroll-margin-top:120px !important;
}
.return-highlight{
  box-shadow:0 0 0 6px rgba(255,106,0,.42),0 18px 48px rgba(15,23,42,.20) !important;
  transform:translateY(-3px) !important;
  transition:box-shadow .25s ease, transform .25s ease !important;
}
@media(max-width:920px){
  .card[id^="product-"],
  .card[data-id]{
    scroll-margin-top:90px !important;
  }
}

/* Navigation update: add Home link, keep nav/header visible while scrolling, and align anchor jumps */
html{scroll-behavior:smooth !important;scroll-padding-top:150px !important;}
.header{
  position:sticky !important;
  top:0 !important;
  z-index:10040 !important;
  background:rgba(255,255,255,.96) !important;
  backdrop-filter:blur(10px) !important;
}
.main-nav{
  position:relative !important;
  z-index:10041 !important;
}
.main-nav a{
  cursor:pointer !important;
}
@media(max-width:920px){
  html{scroll-padding-top:110px !important;}
  .header{
    position:sticky !important;
    top:0 !important;
    z-index:10040 !important;
  }
}
html.desktop-view-mode .header,
html.desktop-view-mode.mobile-safe-header .header,
html.desktop-view-mode.force-mobile-header .header{
  position:sticky !important;
  top:0 !important;
  z-index:10040 !important;
}

/* FINAL: keep the full top header + navigation visible while scrolling, with the previous light-blue background */
:root{--fixed-header-height:156px;}
html{scroll-padding-top:calc(var(--fixed-header-height) + 18px) !important;}
body{
  padding-top:var(--fixed-header-height) !important;
}

.header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:10050 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  box-shadow:0 1px 14px rgba(15,23,42,.08) !important;
  backdrop-filter:none !important;
}

.header .container,
.header-inner,
.main-nav{
  background:transparent !important;
}

.main-nav{
  position:relative !important;
  z-index:10051 !important;
}

.main-nav a{
  cursor:pointer !important;
}

section[id],
div[id],
footer[id]{
  scroll-margin-top:calc(var(--fixed-header-height) + 18px) !important;
}

/* Desktop view on mobile keeps the same fixed navigation behavior */
html.desktop-view-mode .header,
html.desktop-view-mode.mobile-safe-header .header,
html.desktop-view-mode.force-mobile-header .header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:10050 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
}

/* Normal mobile header can be shorter */
@media(max-width:920px){
  :root{--fixed-header-height:138px;}
  body{padding-top:var(--fixed-header-height) !important;}
  html{scroll-padding-top:calc(var(--fixed-header-height) + 14px) !important;}
  section[id],div[id],footer[id]{scroll-margin-top:calc(var(--fixed-header-height) + 14px) !important;}
}

/* Phone Desktop Version header is taller, keep enough space so content is not covered */
@media(max-width:1200px){
  html.desktop-view-mode{
    --fixed-header-height:300px;
  }
  html.desktop-view-mode body{
    padding-top:var(--fixed-header-height) !important;
  }
  html.desktop-view-mode section[id],
  html.desktop-view-mode div[id],
  html.desktop-view-mode footer[id]{
    scroll-margin-top:calc(var(--fixed-header-height) + 18px) !important;
  }
}

/* Very small phone mobile version */
@media(max-width:560px){
  :root{--fixed-header-height:126px;}
  html.desktop-view-mode{--fixed-header-height:300px;}
}

/* FINAL correction: only the navigation row stays fixed/sticky; the upper header scrolls normally */
body{
  padding-top:0 !important;
}

.header,
html.desktop-view-mode .header,
html.desktop-view-mode.mobile-safe-header .header,
html.desktop-view-mode.force-mobile-header .header{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:60 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  backdrop-filter:none !important;
}

/* Hide the original nav row inside the header; use the dedicated sticky nav row instead */
.header .main-nav{
  display:none !important;
}

.sticky-nav-wrap{
  position:sticky !important;
  top:0 !important;
  z-index:10050 !important;
  width:100% !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
  border-bottom:1px solid rgba(15,23,42,.10) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.06) !important;
}

.sticky-main-nav{
  max-width:1200px !important;
  margin:0 auto !important;
  padding:18px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:64px !important;
  font-size:24px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

.sticky-main-nav a{
  color:#1A1A1A !important;
  text-decoration:none !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:6px 10px !important;
  border-radius:999px !important;
  cursor:pointer !important;
}

.sticky-main-nav a:hover{
  color:#0056D6 !important;
  background:rgba(255,255,255,.55) !important;
}

html{
  scroll-padding-top:92px !important;
}

section[id],
div[id],
footer[id]{
  scroll-margin-top:92px !important;
}

/* Phone desktop version still only keeps the nav row sticky */
html.desktop-view-mode .sticky-nav-wrap,
html.desktop-view-mode.mobile-safe-header .sticky-nav-wrap,
html.desktop-view-mode.force-mobile-header .sticky-nav-wrap{
  position:sticky !important;
  top:0 !important;
  z-index:10050 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
}

@media(max-width:920px){
  .sticky-main-nav{
    max-width:100% !important;
    padding:12px 10px !important;
    gap:22px !important;
    font-size:15px !important;
    overflow-x:auto !important;
    justify-content:flex-start !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .sticky-main-nav a{
    flex:0 0 auto !important;
    min-height:36px !important;
    padding:6px 9px !important;
  }
  html{scroll-padding-top:70px !important;}
  section[id],div[id],footer[id]{scroll-margin-top:70px !important;}
}

@media(max-width:1200px){
  html.desktop-view-mode .sticky-main-nav{
    padding:16px 14px !important;
    gap:38px !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow-x:auto !important;
  }
  html.desktop-view-mode{scroll-padding-top:82px !important;}
  html.desktop-view-mode section[id],
  html.desktop-view-mode div[id],
  html.desktop-view-mode footer[id]{
    scroll-margin-top:82px !important;
  }
}

@media(max-width:560px){
  .sticky-main-nav{
    gap:18px !important;
    font-size:14px !important;
  }
}

/* FINAL STRONG FIX: only the Home / Products / Projects / About / Contact row stays fixed */
body{
  padding-top:0 !important;
}

.header,
html.desktop-view-mode .header,
html.desktop-view-mode.mobile-safe-header .header,
html.desktop-view-mode.force-mobile-header .header{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:40 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  backdrop-filter:none !important;
  box-shadow:0 1px 14px rgba(15,23,42,.08) !important;
}

/* Do not keep the upper header fixed */
.topbar,
.header-inner,
.header .container{
  position:relative !important;
}

/* Hide only the original nav row inside the header; the separate fixed row is used */
.header .main-nav{
  display:none !important;
}

/* This is the only fixed part */
.sticky-nav-wrap{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:100000 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  border-bottom:1px solid rgba(15,23,42,.12) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.08) !important;
  transform:none !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

.sticky-main-nav{
  max-width:1200px !important;
  margin:0 auto !important;
  padding:14px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:64px !important;
  font-size:24px !important;
  font-weight:900 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  background:transparent !important;
}

.sticky-main-nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:40px !important;
  padding:6px 10px !important;
  color:#1A1A1A !important;
  text-decoration:none !important;
  border-radius:999px !important;
  cursor:pointer !important;
}

.sticky-main-nav a:hover{
  color:#0056D6 !important;
  background:rgba(255,255,255,.55) !important;
}

/* Add enough page top space so the fixed nav does not cover content */
html{
  scroll-behavior:smooth !important;
  scroll-padding-top:86px !important;
}

body::before{
  content:"" !important;
  display:block !important;
  height:70px !important;
  width:100% !important;
}

section[id],
div[id],
footer[id]{
  scroll-margin-top:86px !important;
}

@media(max-width:920px){
  .sticky-main-nav{
    max-width:100% !important;
    padding:10px 12px !important;
    gap:22px !important;
    font-size:15px !important;
    justify-content:flex-start !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .sticky-main-nav a{
    flex:0 0 auto !important;
    min-height:34px !important;
    padding:6px 8px !important;
  }
  body::before{height:58px !important;}
  html{scroll-padding-top:72px !important;}
  section[id],div[id],footer[id]{scroll-margin-top:72px !important;}
}

/* Phone Desktop Version: same row fixed, slightly larger */
@media(max-width:1200px){
  html.desktop-view-mode .sticky-nav-wrap,
  html.desktop-view-mode.mobile-safe-header .sticky-nav-wrap,
  html.desktop-view-mode.force-mobile-header .sticky-nav-wrap{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:100000 !important;
  }

  html.desktop-view-mode .sticky-main-nav{
    padding:13px 14px !important;
    gap:38px !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow-x:auto !important;
  }

  html.desktop-view-mode body::before{
    height:68px !important;
  }

  html.desktop-view-mode{
    scroll-padding-top:82px !important;
  }

  html.desktop-view-mode section[id],
  html.desktop-view-mode div[id],
  html.desktop-view-mode footer[id]{
    scroll-margin-top:82px !important;
  }
}

@media(max-width:560px){
  .sticky-main-nav{
    gap:18px !important;
    font-size:14px !important;
  }
}

/* NAV FINAL v7
   Restore the original header layout.
   At page top: the normal navigation row stays in its original position below the top header.
   While scrolling: only a cloned navigation row is fixed at the top.
*/
body{
  padding-top:0 !important;
}
body::before{
  content:none !important;
  display:none !important;
  height:0 !important;
}

/* Original header is NOT fixed. It keeps the old layout and scrolls normally. */
.header,
html.desktop-view-mode .header,
html.desktop-view-mode.mobile-safe-header .header,
html.desktop-view-mode.force-mobile-header .header{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:60 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  backdrop-filter:none !important;
  box-shadow:0 1px 14px rgba(15,23,42,.08) !important;
}

/* Show the original nav row again in the original header layout. */
.header .main-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:56px !important;
  flex:0 0 100% !important;
  width:100% !important;
  padding:14px 0 2px !important;
  margin-top:4px !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
  font-size:22px !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}
.header .main-nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:8px 14px !important;
  color:#1A1A1A !important;
  text-decoration:none !important;
  border-radius:999px !important;
}
.header .main-nav a:hover{
  color:#0056D6 !important;
  background:rgba(255,255,255,.55) !important;
}

/* The clone is fixed, but hidden at the top of the page.
   It appears only after the original navigation row scrolls away. */
.sticky-nav-wrap{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:100000 !important;
  background:#dff2ff !important;
  background:linear-gradient(180deg,#eef8ff 0%,#dcefff 100%) !important;
  border-bottom:1px solid rgba(15,23,42,.12) !important;
  box-shadow:0 8px 22px rgba(15,23,42,.08) !important;
  transform:translateY(-110%) !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:transform .18s ease, opacity .18s ease !important;
}
.sticky-nav-wrap.is-active{
  transform:translateY(0) !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
.sticky-main-nav{
  max-width:1200px !important;
  margin:0 auto !important;
  padding:14px 20px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:64px !important;
  font-size:24px !important;
  font-weight:900 !important;
  line-height:1 !important;
  white-space:nowrap !important;
  background:transparent !important;
}
.sticky-main-nav a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:40px !important;
  padding:6px 10px !important;
  color:#1A1A1A !important;
  text-decoration:none !important;
  border-radius:999px !important;
  cursor:pointer !important;
}
.sticky-main-nav a:hover{
  color:#0056D6 !important;
  background:rgba(255,255,255,.55) !important;
}

html{
  scroll-behavior:smooth !important;
  scroll-padding-top:84px !important;
}
section[id],
div[id],
footer[id]{
  scroll-margin-top:84px !important;
}

/* Mobile + common in-app browser layouts */
@media(max-width:920px){
  .header .main-nav{
    gap:22px !important;
    font-size:15px !important;
    overflow-x:auto !important;
    justify-content:flex-start !important;
    padding:10px 0 2px !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .header .main-nav a{
    flex:0 0 auto !important;
    min-height:34px !important;
    padding:6px 8px !important;
  }
  .sticky-main-nav{
    max-width:100% !important;
    padding:10px 12px !important;
    gap:22px !important;
    font-size:15px !important;
    justify-content:flex-start !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .sticky-main-nav a{
    flex:0 0 auto !important;
    min-height:34px !important;
    padding:6px 8px !important;
  }
  html{scroll-padding-top:70px !important;}
  section[id],div[id],footer[id]{scroll-margin-top:70px !important;}
}

/* Phone Desktop Version keeps the original desktop-like nav row first, then the fixed clone */
@media(max-width:1200px){
  html.desktop-view-mode .header .main-nav{
    gap:38px !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow-x:auto !important;
    padding:13px 0 2px !important;
  }
  html.desktop-view-mode .sticky-main-nav{
    padding:13px 14px !important;
    gap:38px !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow-x:auto !important;
  }
  html.desktop-view-mode{
    scroll-padding-top:82px !important;
  }
  html.desktop-view-mode section[id],
  html.desktop-view-mode div[id],
  html.desktop-view-mode footer[id]{
    scroll-margin-top:82px !important;
  }
}

/* Restore product detail: detail modal/page is enabled.
   When product detail opens, the fixed/sticky navigation row must disappear. */
.product-title-text{display:inline-block;font:inherit;font-weight:900;color:#111827;line-height:1.35}
html.product-detail-active .sticky-nav-wrap,
html.product-page-mode .sticky-nav-wrap,
html.product-modal-open .sticky-nav-wrap,
body.modal-open ~ .sticky-nav-wrap{
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
  transform:translateY(-120%) !important;
}

/* Product detail should remain visible above everything */
.product-detail-modal:not(.hide){
  display:block !important;
  z-index:100200 !important;
}

/* Mobile nav fit: keep Home / Products / Projects / About / Contact visible on phone */
@media(max-width:920px){
  .header .main-nav,
  .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:0 !important;
    overflow-x:hidden !important;
    overflow-y:hidden !important;
    padding:9px 6px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    font-size:13px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  .header .main-nav a,
  .sticky-main-nav a{
    flex:1 1 20% !important;
    min-width:0 !important;
    max-width:20% !important;
    width:20% !important;
    box-sizing:border-box !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    padding:7px 2px !important;
    margin:0 !important;
    font-size:13px !important;
    line-height:1 !important;
    font-weight:900 !important;
    overflow:hidden !important;
    text-overflow:clip !important;
    white-space:nowrap !important;
  }
  .sticky-nav-wrap{
    width:100vw !important;
    max-width:100vw !important;
    overflow:hidden !important;
  }
}

@media(max-width:920px){
  html[lang="es"] .header .main-nav,
  html[lang="es"] .sticky-main-nav{
    font-size:12px !important;
    padding-left:4px !important;
    padding-right:4px !important;
  }
  html[lang="es"] .header .main-nav a,
  html[lang="es"] .sticky-main-nav a{
    font-size:12px !important;
    padding-left:1px !important;
    padding-right:1px !important;
  }
}

@media(max-width:430px){
  .header .main-nav,
  .sticky-main-nav{
    padding:8px 3px !important;
    font-size:12px !important;
  }
  .header .main-nav a,
  .sticky-main-nav a{
    font-size:12px !important;
    letter-spacing:-.15px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
  html[lang="es"] .header .main-nav a,
  html[lang="es"] .sticky-main-nav a{
    font-size:11px !important;
    letter-spacing:-.25px !important;
  }
}

@media(max-width:1200px){
  html.desktop-view-mode .header .main-nav,
  html.desktop-view-mode .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    justify-content:space-between !important;
    gap:0 !important;
    overflow:hidden !important;
    padding-left:8px !important;
    padding-right:8px !important;
  }
  html.desktop-view-mode .header .main-nav a,
  html.desktop-view-mode .sticky-main-nav a{
    flex:1 1 20% !important;
    max-width:20% !important;
    width:20% !important;
    min-width:0 !important;
    text-align:center !important;
    justify-content:center !important;
    padding-left:2px !important;
    padding-right:2px !important;
  }
}

/* Button jump / section anchor fix */
html{scroll-behavior:smooth !important;}
#home,#products,#projects,#about,#contact,#solutions,#quotation-guide{
  scroll-margin-top:90px !important;
}
.hero-buttons a[href^="#"],
.solution-card a[href^="#"],
.project-quote-link[href^="#"]{
  cursor:pointer !important;
}
@media(max-width:920px){
  #home,#products,#projects,#about,#contact,#solutions,#quotation-guide{
    scroll-margin-top:74px !important;
  }
}
@media(max-width:1200px){
  html.desktop-view-mode #home,
  html.desktop-view-mode #products,
  html.desktop-view-mode #projects,
  html.desktop-view-mode #about,
  html.desktop-view-mode #contact,
  html.desktop-view-mode #solutions,
  html.desktop-view-mode #quotation-guide{
    scroll-margin-top:84px !important;
  }
}

/* Fixed navigation click safety: when the cloned nav is active, it owns the top row. */
html.nav-clone-active .header{
  pointer-events:none !important;
}
html.nav-clone-active .sticky-nav-wrap,
html.nav-clone-active .sticky-main-nav,
html.nav-clone-active .sticky-main-nav a{
  pointer-events:auto !important;
}
html.nav-clone-active .sticky-nav-wrap.is-active{
  top:0 !important;
  transform:translateY(0) !important;
  opacity:1 !important;
}

/* 20260602 refresh/home-top and in-app phone desktop blank-space fix */
html.desktop-view-mode,
html.desktop-view-mode body,
html.desktop-view-mode.mobile-safe-header body,
html.desktop-view-mode.force-mobile-header body,
html.desktop-view-mode.product-page-mode body,
html.desktop-view-mode.fb-browser.product-page-mode body,
html.fb-browser.product-page-mode body,
html.inapp-browser.product-page-mode body{
  padding-top:0 !important;
  margin-top:0 !important;
}
body::before,
html.desktop-view-mode body::before,
html.desktop-view-mode.mobile-safe-header body::before,
html.desktop-view-mode.force-mobile-header body::before,
html.desktop-view-mode.product-page-mode body::before,
html.fb-browser.product-page-mode body::before,
html.inapp-browser.product-page-mode body::before{
  content:none !important;
  display:none !important;
  height:0 !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
}
html.desktop-view-mode .topbar,
html.desktop-view-mode .header,
html.desktop-view-mode .sticky-nav-wrap,
html.desktop-view-mode .hero,
html.desktop-view-mode.product-page-mode .fb-product-page,
html.desktop-view-mode.fb-browser.product-page-mode .fb-product-page,
html.fb-browser.product-page-mode .fb-product-page,
html.inapp-browser.product-page-mode .fb-product-page{
  margin-top:0 !important;
}
html.desktop-view-mode.product-page-mode .fb-product-page,
html.desktop-view-mode.fb-browser.product-page-mode .fb-product-page,
html.fb-browser.product-page-mode .fb-product-page,
html.inapp-browser.product-page-mode .fb-product-page{
  padding-top:0 !important;
}
html.fb-browser.product-page-mode .fb-product-page-close,
html.fb-browser.product-page-mode .fb-product-page-close.product-detail-close,
html.inapp-browser.product-page-mode .fb-product-page-close,
html.inapp-browser.product-page-mode .fb-product-page-close.product-detail-close{
  top:8px !important;
}

/* 20260603 About page */
.about-page-body{background:#f8fafc;color:#1A1A1A}.about-page-main{background:#fff}.about-page-header .main-nav a.active{color:#0056D6;font-weight:900}.about-page-hero{padding:38px 0 30px;background:linear-gradient(180deg,#fff 0%,#eef6ff 100%)}.about-back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;border:0;background:transparent;color:#0056D6;font:inherit;font-size:18px;font-weight:900;line-height:1;cursor:pointer}.about-back-link:hover{text-decoration:underline}.about-page-title{max-width:920px}.about-page-title p,.about-section-head p,.about-process-grid>div>p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.about-page-title h1,.about-section-head h2,.about-process-grid h2,.about-cta h2{margin:0;color:#1A1A1A;font-size:clamp(28px,3.4vw,48px);line-height:1.12}.about-page-title span,.about-process-grid span,.about-cta p{display:block;margin-top:14px;color:#64748b;line-height:1.8}.about-page-content,.about-capabilities,.about-process,.about-cta{padding:56px 0}.about-page-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:28px;align-items:start}.about-story,.about-facts div,.about-capability-grid article,.about-steps li{background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 14px 40px rgba(15,23,42,.07)}.about-story{padding:26px}.about-story h2{margin:0 0 14px;font-size:28px;color:#1A1A1A}.about-story p{color:#64748b;line-height:1.85;margin:0 0 14px}.about-story p:last-child{margin-bottom:0}.about-facts{display:grid;gap:12px}.about-facts div{padding:18px}.about-facts b,.about-capability-grid b,.about-steps b{display:block;color:#1A1A1A;margin-bottom:8px}.about-facts span,.about-capability-grid span,.about-steps span{color:#64748b;line-height:1.65}.about-capabilities{background:#f8fafc}.about-section-head{max-width:820px;margin:0 auto 26px;text-align:center}.about-capability-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.about-capability-grid article{padding:20px}.about-process-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:start}.about-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px;counter-reset:aboutStep}.about-steps li{position:relative;padding:20px 20px 20px 58px;counter-increment:aboutStep}.about-steps li::before{content:counter(aboutStep);position:absolute;left:18px;top:20px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#0056D6;color:#fff;font-weight:900}.about-cta{background:#0f172a;color:#fff;text-align:center}.about-cta h2{color:#fff}.about-cta p{max-width:680px;margin-left:auto;margin-right:auto;color:#cbd5e1}.about-cta .btn{margin-top:18px}
@media(max-width:1100px){.about-page-grid,.about-process-grid{grid-template-columns:1fr}.about-capability-grid{grid-template-columns:1fr 1fr}.about-facts{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.about-page-hero{padding:24px 0 22px}.about-back-link{font-size:17px;margin-bottom:18px}.about-page-content,.about-capabilities,.about-process,.about-cta{padding:38px 0}.about-page-title h1,.about-section-head h2,.about-process-grid h2,.about-cta h2{font-size:28px}.about-page-grid,.about-process-grid{gap:18px}.about-facts,.about-capability-grid,.about-steps{grid-template-columns:1fr}.about-section-head{text-align:left}.about-story{padding:20px}.about-steps li{padding-right:16px}}

/* 20260603 Projects page */
.projects-page-body{background:#f8fafc;color:#1A1A1A}.projects-page-main{background:#fff}.projects-page-header .main-nav a.active{color:#0056D6;font-weight:900}.projects-page-hero{padding:38px 0 30px;background:linear-gradient(180deg,#fff 0%,#eef6ff 100%)}.projects-back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;border:0;background:transparent;color:#0056D6;font:inherit;font-size:18px;font-weight:900;line-height:1;cursor:pointer}.projects-back-link:hover{text-decoration:underline}.projects-page-title{max-width:940px}.projects-page-title p,.projects-support-grid>div>p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.projects-page-title h1,.projects-support-grid h2,.projects-cta h2{margin:0;color:#1A1A1A;font-size:clamp(28px,3.4vw,48px);line-height:1.12}.projects-page-title span,.projects-support-grid span,.projects-cta p{display:block;margin-top:14px;color:#64748b;line-height:1.8}.projects-page-content,.projects-support,.projects-cta{padding:56px 0}.projects-case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.projects-case{background:#fff;border:1px solid #e5e7eb;border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(15,23,42,.07)}.projects-case img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block;background:#eef2f7}.projects-case div{padding:20px}.projects-case small{display:block;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.projects-case h2{font-size:22px;line-height:1.18;margin:0 0 10px;color:#1A1A1A}.projects-case p{margin:0;color:#64748b;line-height:1.75}.projects-support{background:#f8fafc}.projects-support-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:start}.projects-info-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}.projects-info-list div{background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 14px 40px rgba(15,23,42,.07);padding:20px}.projects-info-list b{display:block;color:#1A1A1A;margin-bottom:8px}.projects-info-list span{color:#64748b;line-height:1.65}.projects-cta{background:#0f172a;text-align:center}.projects-cta h2{color:#fff}.projects-cta p{max-width:720px;margin-left:auto;margin-right:auto;color:#cbd5e1}.projects-cta .btn{margin-top:18px}
@media(max-width:1100px){.projects-case-grid,.projects-support-grid{grid-template-columns:1fr}.projects-case{display:grid;grid-template-columns:360px minmax(0,1fr)}.projects-info-list{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.projects-page-hero{padding:24px 0 22px}.projects-back-link{font-size:17px;margin-bottom:18px}.projects-page-content,.projects-support,.projects-cta{padding:38px 0}.projects-page-title h1,.projects-support-grid h2,.projects-cta h2{font-size:28px}.projects-case{display:block}.projects-case-grid,.projects-support-grid,.projects-info-list{gap:16px}.projects-info-list{grid-template-columns:1fr}}

/* 20260603 Products page */
.products-page-body{background:#f8fafc;color:#1A1A1A}.products-page-main{background:#fff}.products-page-header .main-nav a.active{color:#0056D6;font-weight:900}.products-page-hero{padding:38px 0 30px;background:linear-gradient(180deg,#fff 0%,#eef6ff 100%)}.products-back-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 22px;border:0;background:transparent;color:#0056D6;font:inherit;font-size:18px;font-weight:900;line-height:1;cursor:pointer}.products-back-link:hover{text-decoration:underline}.products-page-title{max-width:960px}.products-page-title p,.products-guide-grid>div>p{margin:0 0 8px;color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.products-page-title h1,.products-guide-grid h2{margin:0;color:#1A1A1A;font-size:clamp(28px,3.4vw,48px);line-height:1.12}.products-page-title span,.products-guide-grid span{display:block;margin-top:14px;color:#64748b;line-height:1.8}.products-page-tools{padding:24px 0;background:#fff}.products-filter-bar{display:flex;gap:10px;flex-wrap:wrap}.products-filter{border:1px solid #cbd5e1;background:#fff;color:#1A1A1A;border-radius:999px;padding:10px 16px;font-weight:900;cursor:pointer}.products-filter.active,.products-filter:hover{background:#0056D6;color:#fff;border-color:#0056D6}.products-page-list{padding:22px 0 58px}.products-page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.products-page-card{background:#fff;border:1px solid #e5e7eb;border-radius:18px;overflow:hidden;box-shadow:0 14px 40px rgba(15,23,42,.07);display:flex;flex-direction:column}.products-page-media{height:260px;background:#f8fafc;display:flex;align-items:center;justify-content:center;overflow:hidden}.products-page-media img,.products-page-media video{width:100%;height:100%;object-fit:contain;background:#fff}.products-card-no-media{font-size:34px;font-weight:900;color:#cbd5e1}.products-page-card-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}.products-page-card-body small{color:#0056D6;font-weight:900;text-transform:uppercase;letter-spacing:.04em}.products-page-card-body h2{font-size:21px;line-height:1.2;margin:0;color:#1A1A1A}.products-page-card-body p{margin:0;color:#64748b;line-height:1.65}.products-page-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;color:#c2410c;font-weight:900;background:#fff7ed;border:1px solid #fed7aa;border-radius:12px;padding:10px;margin-top:auto}.products-page-actions{display:flex;gap:10px;flex-wrap:wrap}.products-page-actions .btn{flex:1 1 150px;justify-content:center}.products-page-guide{padding:56px 0;background:#f8fafc}.products-guide-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:start}.products-guide-list{display:grid;grid-template-columns:1fr 1fr;gap:14px}.products-guide-list div{background:#fff;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 14px 40px rgba(15,23,42,.07);padding:20px}.products-guide-list b{display:block;color:#1A1A1A;margin-bottom:8px}.products-guide-list span{color:#64748b;line-height:1.65}.products-detail-modal{position:fixed;inset:0;z-index:100300}.products-detail-modal.hide{display:none!important}.products-detail-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.62);backdrop-filter:blur(3px)}.products-detail-panel{position:relative;margin:24px auto;width:min(1180px,calc(100% - 28px));max-height:calc(100vh - 48px);overflow:auto;background:#fff;border-radius:20px;box-shadow:0 30px 90px rgba(0,0,0,.35);padding:22px}.products-detail-close{position:sticky;top:0;float:right;z-index:2;width:42px;height:42px;border:0;border-radius:50%;background:#0f172a;color:#fff;font-size:28px;line-height:1;cursor:pointer}.products-detail-grid{display:grid;grid-template-columns:minmax(280px,1fr) minmax(280px,.9fr);gap:20px;clear:both}.products-detail-gallery,.products-detail-info,.products-detail-section{background:#fff;border:1px solid #eef2f7;border-radius:18px;padding:16px}.products-detail-main{height:430px;background:#f8fafc;border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden}.products-detail-main img,.products-detail-main video{width:100%;height:100%;object-fit:contain;background:#fff}.products-detail-thumbs{display:flex;gap:8px;overflow:auto;margin-top:12px}.products-detail-thumb{width:74px;height:62px;flex:0 0 auto;border:2px solid #e5e7eb;border-radius:10px;overflow:hidden;background:#fff;padding:0;cursor:pointer}.products-detail-thumb:hover{border-color:#0056D6}.products-detail-thumb img,.products-detail-thumb video{width:100%;height:100%;object-fit:cover}.products-detail-info small{color:#0056D6;font-weight:900;text-transform:uppercase}.products-detail-info h2{font-size:28px;line-height:1.18;margin:10px 0;color:#1A1A1A}.products-detail-info p{color:#64748b;line-height:1.75}.products-detail-price{display:grid;gap:8px;background:#fff7ed;border:1px solid #fed7aa;border-radius:14px;padding:14px;color:#c2410c;font-weight:900;margin:16px 0}.products-detail-section{grid-column:1/-1}.products-detail-section h3{font-size:22px;margin:0 0 12px}.products-detail-specs{width:100%;border-collapse:collapse}.products-detail-specs th,.products-detail-specs td{border:1px solid #e5e7eb;padding:10px;text-align:left;vertical-align:top}.products-detail-specs th{width:260px;background:#f8fafc;color:#334155}.products-detail-specs .spec-section th{background:#fff7ed;color:#9a3412;text-transform:uppercase}.products-detail-note{color:#64748b;line-height:1.7}
@media(max-width:1100px){.products-page-grid{grid-template-columns:1fr 1fr}.products-guide-grid,.products-detail-grid{grid-template-columns:1fr}.products-guide-list{grid-template-columns:1fr 1fr}.products-detail-main{height:360px}}
@media(max-width:680px){.products-page-hero{padding:24px 0 22px}.products-back-link{font-size:17px;margin-bottom:18px}.products-page-title h1,.products-guide-grid h2{font-size:28px}.products-page-grid,.products-guide-list{grid-template-columns:1fr}.products-page-media{height:230px}.products-page-list,.products-page-guide{padding:38px 0}.products-detail-panel{margin:10px auto;width:calc(100% - 16px);max-height:calc(100vh - 20px);border-radius:14px;padding:14px}.products-detail-main{height:280px}.products-detail-info h2{font-size:23px}.products-detail-specs th,.products-detail-specs td{display:block;width:100%}}

/* 20260603 full-site audit upgrade: mobile layout, CTAs and view-mode switch */
@media(max-width:920px){
  html:not(.desktop-view-mode),
  html:not(.desktop-view-mode) body{width:100% !important;max-width:100% !important;overflow-x:hidden !important;}
  html:not(.desktop-view-mode) .topbar,
  html:not(.desktop-view-mode) .header-social-left,
  html:not(.desktop-view-mode) .header-trust,
  html:not(.desktop-view-mode) .search{display:none !important;}
  html:not(.desktop-view-mode) .header{position:sticky !important;top:0 !important;z-index:1000 !important;background:#eef8ff !important;border-bottom:1px solid #dbeafe !important;}
  html:not(.desktop-view-mode) .header-inner{width:100% !important;max-width:100% !important;padding:10px 14px 12px !important;gap:10px !important;display:flex !important;flex-direction:column !important;align-items:center !important;justify-content:flex-start !important;overflow:hidden !important;}
  html:not(.desktop-view-mode) .brand{width:100% !important;min-width:0 !important;max-width:100% !important;justify-content:center !important;text-align:center !important;}
  html:not(.desktop-view-mode) .brand-text{width:100% !important;max-width:100% !important;min-width:0 !important;}
  html:not(.desktop-view-mode) .brand-title{font-size:22px !important;line-height:1.05 !important;white-space:normal !important;overflow-wrap:anywhere !important;letter-spacing:0 !important;}
  html:not(.desktop-view-mode) .brand-cn{font-size:14px !important;line-height:1.15 !important;margin-top:3px !important;}
  html:not(.desktop-view-mode) .brand-sub{display:block !important;font-size:12px !important;line-height:1.2 !important;margin-top:3px !important;}
  html:not(.desktop-view-mode) .actions{width:100% !important;max-width:100% !important;display:flex !important;justify-content:center !important;gap:8px !important;order:2 !important;}
  html:not(.desktop-view-mode) .actions .btn,
  html:not(.desktop-view-mode) .lang-toggle,
  html:not(.desktop-view-mode) #waBtn{min-height:38px !important;padding:8px 12px !important;font-size:13px !important;line-height:1.1 !important;white-space:nowrap !important;}
  html:not(.desktop-view-mode) .header .main-nav{order:3 !important;width:100% !important;max-width:100% !important;overflow:hidden !important;display:flex !important;flex-wrap:wrap !important;justify-content:center !important;gap:6px !important;padding:2px 0 4px !important;scrollbar-width:none !important;-webkit-overflow-scrolling:touch !important;}
  html:not(.desktop-view-mode) .header .main-nav::-webkit-scrollbar{display:none !important;}
  html:not(.desktop-view-mode) .header .main-nav a{flex:0 1 auto !important;width:auto !important;min-width:auto !important;max-width:none !important;min-height:32px !important;padding:8px 10px !important;border-radius:999px !important;background:#fff !important;color:#1A1A1A !important;font-size:12px !important;font-weight:900 !important;line-height:1 !important;letter-spacing:0 !important;box-shadow:0 6px 18px rgba(15,23,42,.05) !important;}
  html:not(.desktop-view-mode) .hero{padding:30px 0 34px !important;}
  html:not(.desktop-view-mode) .hero .container{width:100% !important;max-width:100% !important;padding-left:18px !important;padding-right:18px !important;display:grid !important;grid-template-columns:1fr !important;gap:22px !important;overflow:hidden !important;}
  html:not(.desktop-view-mode) .hero h1{font-size:clamp(30px,9vw,38px) !important;line-height:1.08 !important;letter-spacing:0 !important;overflow-wrap:anywhere !important;max-width:100% !important;}
  html:not(.desktop-view-mode) .hero p{font-size:15px !important;line-height:1.65 !important;max-width:100% !important;}
  html:not(.desktop-view-mode) .hero-buttons{display:grid !important;grid-template-columns:1fr !important;gap:10px !important;width:100% !important;max-width:100% !important;}
  html:not(.desktop-view-mode) .hero-buttons .btn{width:100% !important;min-height:48px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;font-size:14px !important;line-height:1.2 !important;font-weight:900 !important;color:#fff !important;text-align:center !important;opacity:1 !important;visibility:visible !important;white-space:normal !important;}
  html:not(.desktop-view-mode) .hero-buttons .btn.secondary{color:#111827 !important;background:#fff !important;}
  html:not(.desktop-view-mode) .hero-trust-strip{display:grid !important;grid-template-columns:1fr 1fr !important;gap:8px !important;}
  html:not(.desktop-view-mode) .hero-trust-strip span{width:auto !important;min-width:0 !important;font-size:12px !important;line-height:1.25 !important;padding:8px 10px !important;}
  html:not(.desktop-view-mode) .stats{grid-template-columns:1fr 1fr !important;gap:10px !important;}
  html:not(.desktop-view-mode) .hero-media{display:none !important;}
  html:not(.desktop-view-mode) .mobile-sticky-whatsapp{bottom:12px !important;z-index:9990 !important;}
  html:not(.desktop-view-mode) .view-mode-toggle{position:fixed !important;left:12px !important;right:auto !important;bottom:74px !important;z-index:9991 !important;transform:none !important;max-width:calc(100vw - 24px) !important;padding:10px 14px !important;min-height:40px !important;border-radius:999px !important;font-size:14px !important;line-height:1 !important;box-shadow:0 12px 26px rgba(0,86,214,.28) !important;}
}
@media(min-width:921px){.view-mode-toggle{display:none !important;}}
@media(max-width:1200px){
  html.desktop-view-mode .view-mode-toggle{position:fixed !important;left:14px !important;right:auto !important;bottom:16px !important;top:auto !important;z-index:9991 !important;transform:none !important;padding:10px 15px !important;min-height:40px !important;border-radius:999px !important;font-size:14px !important;line-height:1 !important;}
  html.desktop-view-mode .hero-buttons .btn{color:#fff !important;opacity:1 !important;visibility:visible !important;}
  html.desktop-view-mode .hero-buttons .btn.secondary{color:#111827 !important;background:#fff !important;}
}

@media(max-width:1200px){
  html.desktop-view-mode body.products-page-body,
  html.desktop-view-mode body.about-page-body,
  html.desktop-view-mode body.projects-page-body,
  html.desktop-view-mode body.contact-page-body{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:hidden !important;
  }
  html.desktop-view-mode body.products-page-body .header,
  html.desktop-view-mode body.about-page-body .header,
  html.desktop-view-mode body.projects-page-body .header,
  html.desktop-view-mode body.contact-page-body .header,
  html.desktop-view-mode body.products-page-body .products-page-main,
  html.desktop-view-mode body.about-page-body .about-page-main,
  html.desktop-view-mode body.projects-page-body .projects-page-main,
  html.desktop-view-mode body.contact-page-body .contact-page-main,
  html.desktop-view-mode body.products-page-body .products-page-hero,
  html.desktop-view-mode body.about-page-body .about-page-hero,
  html.desktop-view-mode body.projects-page-body .projects-page-hero{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
  }
  html.desktop-view-mode body.products-page-body .topbar,
  html.desktop-view-mode body.about-page-body .topbar,
  html.desktop-view-mode body.projects-page-body .topbar,
  html.desktop-view-mode body.contact-page-body .topbar,
  html.desktop-view-mode body.products-page-body .header-social-left,
  html.desktop-view-mode body.about-page-body .header-social-left,
  html.desktop-view-mode body.projects-page-body .header-social-left,
  html.desktop-view-mode body.contact-page-body .header-social-left,
  html.desktop-view-mode body.products-page-body .search,
  html.desktop-view-mode body.about-page-body .search,
  html.desktop-view-mode body.projects-page-body .search,
  html.desktop-view-mode body.contact-page-body .search{
    display:none !important;
  }
  html.desktop-view-mode body.products-page-body .container,
  html.desktop-view-mode body.about-page-body .container,
  html.desktop-view-mode body.projects-page-body .container,
  html.desktop-view-mode body.contact-page-body .container,
  html.desktop-view-mode body.products-page-body .header .container,
  html.desktop-view-mode body.about-page-body .header .container,
  html.desktop-view-mode body.projects-page-body .header .container,
  html.desktop-view-mode body.contact-page-body .header .container{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding-left:18px !important;
    padding-right:18px !important;
  }
  html.desktop-view-mode body.products-page-body .header-inner,
  html.desktop-view-mode body.about-page-body .header-inner,
  html.desktop-view-mode body.projects-page-body .header-inner,
  html.desktop-view-mode body.contact-page-body .header-inner{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    flex-direction:column !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:10px !important;
    padding:12px 0 !important;
    overflow:hidden !important;
  }
  html.desktop-view-mode body.products-page-body .brand,
  html.desktop-view-mode body.about-page-body .brand,
  html.desktop-view-mode body.projects-page-body .brand,
  html.desktop-view-mode body.contact-page-body .brand{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    justify-content:center !important;
    text-align:center !important;
  }
  html.desktop-view-mode body.products-page-body .brand-title,
  html.desktop-view-mode body.about-page-body .brand-title,
  html.desktop-view-mode body.projects-page-body .brand-title,
  html.desktop-view-mode body.contact-page-body .brand-title{
    font-size:22px !important;
    line-height:1.05 !important;
    overflow-wrap:anywhere !important;
  }
  html.desktop-view-mode body.products-page-body .main-nav,
  html.desktop-view-mode body.about-page-body .main-nav,
  html.desktop-view-mode body.projects-page-body .main-nav,
  html.desktop-view-mode body.contact-page-body .main-nav{
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    justify-content:flex-start !important;
    gap:8px !important;
    padding:4px 0 !important;
    scrollbar-width:none !important;
  }
  html.desktop-view-mode body.products-page-body .main-nav::-webkit-scrollbar,
  html.desktop-view-mode body.about-page-body .main-nav::-webkit-scrollbar,
  html.desktop-view-mode body.projects-page-body .main-nav::-webkit-scrollbar,
  html.desktop-view-mode body.contact-page-body .main-nav::-webkit-scrollbar{display:none !important;}
  html.desktop-view-mode body.products-page-body .main-nav a,
  html.desktop-view-mode body.about-page-body .main-nav a,
  html.desktop-view-mode body.projects-page-body .main-nav a,
  html.desktop-view-mode body.contact-page-body .main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:auto !important;
    font-size:14px !important;
    padding:8px 14px !important;
    border-radius:999px !important;
    background:#fff !important;
  }
  html.desktop-view-mode body.products-page-body .products-filter-bar{
    overflow-x:auto !important;
    flex-wrap:nowrap !important;
    padding-bottom:4px !important;
  }
  html.desktop-view-mode body.products-page-body .products-filter{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }
}

/* 20260603 final factory video alignment fix: phone desktop and in-app browsers */
@media(max-width:1200px){
  html.desktop-view-mode .factory-video-section,
  html.desktop-view-mode.mobile-safe-header .factory-video-section,
  html.desktop-view-mode.force-mobile-header .factory-video-section,
  html.inapp-browser .factory-video-section,
  html.fb-browser .factory-video-section{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
  }
  html.desktop-view-mode .factory-video-section > .container,
  html.desktop-view-mode.mobile-safe-header .factory-video-section > .container,
  html.desktop-view-mode.force-mobile-header .factory-video-section > .container,
  html.inapp-browser .factory-video-section > .container,
  html.fb-browser .factory-video-section > .container{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:18px !important;
    padding-right:18px !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  html.desktop-view-mode .factory-video-title,
  html.desktop-view-mode .factory-video-note,
  html.desktop-view-mode .factory-video-group,
  html.desktop-view-mode .factory-video-group-title,
  html.inapp-browser .factory-video-title,
  html.inapp-browser .factory-video-note,
  html.inapp-browser .factory-video-group,
  html.inapp-browser .factory-video-group-title{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }
  html.desktop-view-mode .factory-video-grid,
  html.desktop-view-mode.mobile-safe-header .factory-video-grid,
  html.desktop-view-mode.force-mobile-header .factory-video-grid,
  html.inapp-browser .factory-video-grid,
  html.fb-browser .factory-video-grid{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    justify-items:stretch !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }
  html.desktop-view-mode .factory-video-card,
  html.inapp-browser .factory-video-card,
  html.fb-browser .factory-video-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
  }
}

/* 20260603 final home product detail fix: compact Back button and no image overlap */
@media(max-width:920px){
  .product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn,
  .product-detail-modal:not(.hide) .product-detail-close.product-detail-back-btn-all,
  html.inapp-browser .product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn,
  html.fb-browser .product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn{
    float:none !important;
    position:sticky !important;
    top:0 !important;
    left:0 !important;
    right:auto !important;
    z-index:45 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:0 !important;
    max-width:148px !important;
    height:auto !important;
    min-height:36px !important;
    padding:8px 12px !important;
    margin:0 0 10px 0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#0056D6 !important;
    color:#fff !important;
    font-size:14px !important;
    font-weight:900 !important;
    line-height:1 !important;
    box-shadow:0 10px 22px rgba(0,86,214,.24) !important;
    white-space:nowrap !important;
    cursor:pointer !important;
    -webkit-tap-highlight-color:transparent !important;
  }
}

@media(min-width:921px){
  .product-detail-modal:not(.hide) .product-detail-close:not(.mobile-product-back-btn):not(.product-detail-back-btn-all){
    float:right !important;
    position:sticky !important;
    top:0 !important;
    left:auto !important;
    right:0 !important;
    width:42px !important;
    min-width:42px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 !important;
    margin:0 0 8px 12px !important;
    border-radius:50% !important;
    background:#0f172a !important;
    color:#fff !important;
    font-size:28px !important;
    line-height:1 !important;
  }
}

/* 20260603 Products page mobile detail size sync with homepage product detail */
@media(max-width:920px){
  .products-detail-modal:not(.hide){
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    overflow:hidden !important;
    background:#fff !important;
  }
  .products-detail-modal:not(.hide) .products-detail-backdrop{
    display:none !important;
  }
  .products-detail-modal:not(.hide) .products-detail-panel{
    width:100vw !important;
    max-width:100vw !important;
    height:100vh !important;
    height:100dvh !important;
    max-height:100vh !important;
    max-height:100dvh !important;
    margin:0 !important;
    padding:12px !important;
    border-radius:0 !important;
    box-shadow:none !important;
    overflow:auto !important;
    box-sizing:border-box !important;
    background:#fff !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .products-detail-modal:not(.hide) .products-detail-close{
    float:none !important;
    position:sticky !important;
    top:0 !important;
    left:0 !important;
    right:auto !important;
    z-index:45 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:0 !important;
    max-width:148px !important;
    height:auto !important;
    min-height:36px !important;
    padding:8px 12px !important;
    margin:0 0 10px 0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#0056D6 !important;
    color:#fff !important;
    font-size:14px !important;
    font-weight:900 !important;
    line-height:1 !important;
    box-shadow:0 10px 22px rgba(0,86,214,.24) !important;
    white-space:nowrap !important;
  }
  .products-detail-modal:not(.hide) .products-detail-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
    clear:both !important;
  }
  .products-detail-modal:not(.hide) .products-detail-gallery,
  .products-detail-modal:not(.hide) .products-detail-info,
  .products-detail-modal:not(.hide) .products-detail-section{
    border:1px solid #eef2f7 !important;
    border-radius:18px !important;
    padding:12px !important;
    box-shadow:none !important;
  }
  .products-detail-modal:not(.hide) .products-detail-main{
    height:380px !important;
    min-height:300px !important;
    border-radius:14px !important;
  }
  .products-detail-modal:not(.hide) .products-detail-thumbs{
    gap:8px !important;
    margin-top:12px !important;
    padding-bottom:2px !important;
  }
  .products-detail-modal:not(.hide) .products-detail-thumb{
    width:72px !important;
    height:62px !important;
    border-radius:10px !important;
  }
  .products-detail-modal:not(.hide) .products-detail-info h2{
    font-size:24px !important;
    line-height:1.22 !important;
    margin:10px 0 !important;
  }
  .products-detail-modal:not(.hide) .products-detail-info p{
    font-size:15px !important;
    line-height:1.7 !important;
  }
  .products-detail-modal:not(.hide) .products-detail-price{
    border-radius:14px !important;
    padding:14px !important;
    margin:14px 0 !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .products-detail-main,
  html.fb-browser .products-detail-modal:not(.hide) .products-detail-main{
    height:360px !important;
    min-height:240px !important;
  }
  html.fb-browser .products-detail-modal:not(.hide) .products-detail-main{
    height:285px !important;
  }
}

@media(max-width:380px){
  .products-detail-modal:not(.hide) .products-detail-main{
    height:330px !important;
    min-height:280px !important;
  }
  .products-detail-modal:not(.hide) .products-detail-thumb{
    width:66px !important;
    height:58px !important;
  }
}

/* 20260603 Products page detail content uses the homepage detail structure */
@media(max-width:920px){
  .products-detail-modal:not(.hide) .product-detail-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
    clear:none !important;
    width:100% !important;
  }
  .products-detail-modal:not(.hide) .detail-gallery,
  .products-detail-modal:not(.hide) .detail-info,
  .products-detail-modal:not(.hide) .detail-section{
    width:100% !important;
    min-width:0 !important;
    border-radius:16px !important;
    padding:12px !important;
    box-sizing:border-box !important;
  }
  .products-detail-modal:not(.hide) .detail-main{
    height:min(64vh, 380px) !important;
    min-height:260px !important;
    border-radius:14px !important;
  }
  .products-detail-modal:not(.hide) .detail-main img,
  .products-detail-modal:not(.hide) .detail-main video{
    max-width:100% !important;
    max-height:100% !important;
    object-fit:contain !important;
  }
  .products-detail-modal:not(.hide) .detail-thumbs{
    gap:8px !important;
    margin-top:10px !important;
    padding:0 0 8px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  .products-detail-modal:not(.hide) .detail-thumb{
    width:66px !important;
    height:58px !important;
    flex:0 0 66px !important;
    border-radius:10px !important;
  }
  .products-detail-modal:not(.hide) .detail-info h1{
    font-size:24px !important;
    line-height:1.22 !important;
    margin:0 0 12px !important;
  }
  .products-detail-modal:not(.hide) .detail-desc,
  .products-detail-modal:not(.hide) .detail-section p,
  .products-detail-modal:not(.hide) .detail-supplier span{
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
  .products-detail-modal:not(.hide) .detail-price-box{
    grid-template-columns:1fr 1fr !important;
  }
}

@media(max-width:920px){
  html.inapp-browser .products-detail-modal:not(.hide) .detail-main{
    height:min(58vh, 360px) !important;
    min-height:230px !important;
  }
  html.fb-browser .products-detail-modal:not(.hide) .detail-main{
    height:285px !important;
    min-height:230px !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .detail-info h1{
    font-size:21px !important;
    line-height:1.25 !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .detail-price-box{
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
    padding:12px !important;
    margin:12px 0 !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .detail-actions{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .detail-actions .btn{
    width:100% !important;
    justify-content:center !important;
    min-height:44px !important;
  }
  html.inapp-browser .products-detail-modal:not(.hide) .detail-specs,
  html.inapp-browser .products-detail-modal:not(.hide) .detail-specs tbody,
  html.inapp-browser .products-detail-modal:not(.hide) .detail-specs tr,
  html.inapp-browser .products-detail-modal:not(.hide) .detail-specs th,
  html.inapp-browser .products-detail-modal:not(.hide) .detail-specs td{
    display:block !important;
    width:100% !important;
  }
}

/* 20260603 final override: Facebook homepage product detail must match mobile detail and close instantly */
html.fb-browser .product-detail-modal,
html.fb-browser .product-detail-modal .product-detail-panel{
  transition:none !important;
  animation:none !important;
}
html.fb-browser .product-detail-modal:not(.hide){
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  max-width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
}
html.fb-browser .product-detail-modal:not(.hide) .product-detail-panel{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:auto !important;
  width:100vw !important;
  max-width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  max-height:100vh !important;
  max-height:100dvh !important;
}
html.fb-browser .product-detail-modal:not(.hide) .detail-price-box{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
}

/* 20260603 final: larger mobile product detail Back / Volver button */
@media(max-width:920px){
  .product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn,
  .product-detail-modal:not(.hide) .product-detail-close.product-detail-back-btn-all,
  .products-detail-modal:not(.hide) .products-detail-close{
    min-height:46px !important;
    min-width:118px !important;
    max-width:190px !important;
    padding:12px 18px !important;
    font-size:17px !important;
    line-height:1 !important;
    border-radius:999px !important;
    box-shadow:0 12px 28px rgba(0,86,214,.30) !important;
  }
}

/* 20260603 independent pages: Products / Projects / About / Contact use the same fixed navigation row as the homepage */
.sticky-main-nav a.active{
  color:#0056D6 !important;
  background:rgba(255,255,255,.70) !important;
  box-shadow:inset 0 0 0 1px rgba(0,86,214,.18) !important;
}

/* 20260604: all Back / Volver controls match the large blue mobile product-detail return button */
.contact-back-link,
.about-back-link,
.projects-back-link,
.products-back-link,
.quote-contact-back,
.products-detail-close,
.product-detail-close.product-detail-back-btn-all,
.product-detail-close.mobile-product-back-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:auto !important;
  min-width:118px !important;
  min-height:46px !important;
  max-width:220px !important;
  padding:12px 18px !important;
  margin:0 0 18px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font:inherit !important;
  font-size:17px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:0 12px 28px rgba(0,86,214,.30) !important;
  cursor:pointer !important;
  -webkit-tap-highlight-color:transparent !important;
}
.contact-back-link:hover,
.about-back-link:hover,
.projects-back-link:hover,
.products-back-link:hover,
.quote-contact-back:hover,
.products-detail-close:hover,
.product-detail-close.product-detail-back-btn-all:hover,
.product-detail-close.mobile-product-back-btn:hover{
  background:#0048b5 !important;
  text-decoration:none !important;
  box-shadow:0 16px 34px rgba(0,86,214,.36) !important;
}
.contact-back-link:active,
.about-back-link:active,
.projects-back-link:active,
.products-back-link:active,
.quote-contact-back:active,
.products-detail-close:active,
.product-detail-close.product-detail-back-btn-all:active,
.product-detail-close.mobile-product-back-btn:active{
  transform:translateY(1px) !important;
}

.quote-contact-modal{
  position:fixed;
  inset:0;
  z-index:100500;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:24px 14px;
  overflow:auto;
}
.quote-contact-modal.hide{display:none!important;}
.quote-contact-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.62);
  backdrop-filter:blur(3px);
}
.quote-contact-panel{
  position:relative;
  z-index:1;
  width:min(1180px, calc(100vw - 28px));
  max-height:calc(100vh - 48px);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  background:#fff;
  border-radius:20px;
  box-shadow:0 30px 90px rgba(0,0,0,.35);
  padding:22px;
}
.quote-contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,560px);
  gap:28px;
  align-items:start;
}
.quote-contact-copy > p{
  margin:0 0 8px;
  color:#0056D6;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.quote-contact-copy h2{
  margin:0;
  color:#1A1A1A;
  font-size:clamp(28px,3.4vw,48px);
  line-height:1.12;
}
.quote-contact-copy > span{
  display:block;
  margin-top:14px;
  color:#64748b;
  line-height:1.8;
}
.quote-contact-form{
  box-shadow:0 16px 46px rgba(15,23,42,.1);
}
.quote-contact-form select{
  width:100%;
  box-sizing:border-box;
  margin-top:6px;
  border:1px solid #dbe3ef;
  border-radius:12px;
  padding:12px;
  font:inherit;
  background:#fff;
  color:#1A1A1A;
}
body.quote-contact-modal-open{
  overflow:hidden;
}

@media(max-width:900px){
  .quote-contact-modal{
    padding:0;
  }
  .quote-contact-backdrop{
    display:none;
  }
  .quote-contact-panel{
    width:100vw;
    max-width:100vw;
    min-height:100vh;
    min-height:100dvh;
    max-height:none;
    border-radius:0;
    padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(18px + env(safe-area-inset-bottom, 0px));
    box-shadow:none;
  }
  .quote-contact-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .quote-contact-copy h2{
    font-size:28px;
  }
  .quote-contact-form{
    grid-template-columns:1fr !important;
    padding:16px;
  }
}

.products-page-body .sticky-nav-wrap,
.projects-page-body .sticky-nav-wrap,
.about-page-body .sticky-nav-wrap,
.contact-page-body .sticky-nav-wrap{
  display:block !important;
}

/* 20260603 phone desktop homepage sticky nav size fix */
@media(max-width:920px){
  html.desktop-view-mode .sticky-main-nav,
  html.phone-desktop-safe-page .sticky-main-nav{
    padding:14px 12px !important;
    gap:0 !important;
    font-size:18px !important;
    line-height:1 !important;
    justify-content:space-between !important;
    overflow-x:hidden !important;
  }

  html.desktop-view-mode .sticky-main-nav a,
  html.phone-desktop-safe-page .sticky-main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-height:42px !important;
    padding:9px 6px !important;
    font-size:18px !important;
    font-weight:900 !important;
    white-space:nowrap !important;
  }

  html.desktop-view-mode[lang="es"] .sticky-main-nav,
  html.phone-desktop-safe-page[lang="es"] .sticky-main-nav{
    font-size:16px !important;
  }

  html.desktop-view-mode[lang="es"] .sticky-main-nav a,
  html.phone-desktop-safe-page[lang="es"] .sticky-main-nav a{
    font-size:16px !important;
    padding-left:4px !important;
    padding-right:4px !important;
  }
}

/* 20260606 v112: Phone desktop inner-page top navigation banner.
   Scope: Products / Projects / About / Contact only, before the scrolled fixed clone activates. */
@media(max-width:1200px){
  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .sticky-nav-wrap:not(.is-active),
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .sticky-nav-wrap:not(.is-active),
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .sticky-nav-wrap:not(.is-active),
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .sticky-nav-wrap:not(.is-active){
    background:#eaf7ff !important;
    background:linear-gradient(180deg,#eef9ff 0%,#dff1ff 100%) !important;
    border-top:1px solid rgba(0,86,214,.08) !important;
    border-bottom:1px solid rgba(15,23,42,.12) !important;
    box-shadow:0 8px 18px rgba(15,23,42,.08) !important;
  }

  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    padding:16px 0 !important;
    gap:0 !important;
    justify-content:space-between !important;
    overflow:hidden !important;
    font-size:24px !important;
    font-weight:850 !important;
  }

  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-height:70px !important;
    padding:0 8px !important;
    font-size:24px !important;
    font-weight:850 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a.active{
    color:#0056D6 !important;
    background:#fff !important;
    border-radius:999px !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }

  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
    color:#0056D6 !important;
    background:#fff !important;
    border-radius:999px !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }

  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.products-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.projects-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.about-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.contact-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.products-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.projects-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.about-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active)[lang="es"] body.contact-page-body .sticky-nav-wrap:not(.is-active) .sticky-main-nav a{
    font-size:21px !important;
  }
}

/* 20260606: Inner pages phone desktop sticky nav less crowded.
   Scope: Products / Projects / About / Contact only. */
@media(max-width:920px){
  html.phone-desktop-safe-page body.products-page-body .sticky-main-nav,
  html.phone-desktop-safe-page body.projects-page-body .sticky-main-nav,
  html.phone-desktop-safe-page body.about-page-body .sticky-main-nav,
  html.phone-desktop-safe-page body.contact-page-body .sticky-main-nav{
    padding:9px 8px !important;
    font-size:14px !important;
    font-weight:800 !important;
  }

  html.phone-desktop-safe-page body.products-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page body.projects-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page body.about-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page body.contact-page-body .sticky-main-nav a{
    min-height:34px !important;
    padding:6px 3px !important;
    font-size:14px !important;
    font-weight:800 !important;
  }

  html.phone-desktop-safe-page[lang="es"] body.products-page-body .sticky-main-nav,
  html.phone-desktop-safe-page[lang="es"] body.projects-page-body .sticky-main-nav,
  html.phone-desktop-safe-page[lang="es"] body.about-page-body .sticky-main-nav,
  html.phone-desktop-safe-page[lang="es"] body.contact-page-body .sticky-main-nav,
  html.phone-desktop-safe-page[lang="es"] body.products-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page[lang="es"] body.projects-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page[lang="es"] body.about-page-body .sticky-main-nav a,
  html.phone-desktop-safe-page[lang="es"] body.contact-page-body .sticky-main-nav a{
    font-size:13px !important;
  }
}


/* v44: Product detail modal rebuilt with the same safe layout rules as Get Project Quote modal. */
.product-detail-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:100600 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:24px 14px !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  width:auto !important;
  height:auto !important;
  background:transparent !important;
  box-sizing:border-box !important;
}
.product-detail-modal.hide{display:none !important;}
.product-detail-backdrop{
  position:fixed !important;
  inset:0 !important;
  background:rgba(15,23,42,.62) !important;
  backdrop-filter:blur(3px) !important;
}
.product-detail-panel{
  position:relative !important;
  z-index:1 !important;
  width:min(1180px, calc(100vw - 28px)) !important;
  max-width:min(1180px, calc(100vw - 28px)) !important;
  min-width:0 !important;
  max-height:calc(100vh - 48px) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  background:#fff !important;
  border-radius:20px !important;
  box-shadow:0 30px 90px rgba(0,0,0,.35) !important;
  padding:22px !important;
  margin:0 !important;
  box-sizing:border-box !important;
  float:none !important;
  transform:none !important;
}
.product-detail-close{
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  right:auto !important;
  float:none !important;
  z-index:5 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:auto !important;
  min-width:94px !important;
  height:42px !important;
  min-height:42px !important;
  padding:0 16px !important;
  margin:0 0 16px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font-size:16px !important;
  line-height:1 !important;
  font-weight:900 !important;
  cursor:pointer !important;
  box-shadow:0 12px 28px rgba(0,86,214,.28) !important;
}
body.product-detail-quote-modal-open{overflow:hidden !important;}
html.product-detail-quote-modal-active,
html.product-detail-quote-modal-active body{overscroll-behavior:contain;}
.product-detail-modal #productDetailContent,
.product-detail-modal .product-detail-grid,
.product-detail-modal .detail-gallery,
.product-detail-modal .detail-info,
.product-detail-modal .detail-section,
.product-detail-modal .detail-price-box,
.product-detail-modal .detail-supplier{
  box-sizing:border-box !important;
  max-width:100% !important;
}
.product-detail-modal .product-detail-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  gap:24px !important;
  clear:both !important;
}
.product-detail-modal .detail-main{
  height:520px !important;
  max-height:58vh !important;
}
.product-detail-modal .detail-desc,
.product-detail-modal .detail-section p,
.product-detail-modal .detail-info h1,
.product-detail-modal .detail-supplier span,
.product-detail-modal .detail-specs th,
.product-detail-modal .detail-specs td{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

@media(max-width:900px){
  .product-detail-modal{
    padding:0 !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }
  .product-detail-backdrop{display:none !important;}
  .product-detail-panel{
    width:100vw !important;
    max-width:100vw !important;
    min-height:100vh !important;
    min-height:100dvh !important;
    max-height:none !important;
    border-radius:0 !important;
    padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow:none !important;
  }
  .product-detail-modal .product-detail-grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }
  .product-detail-modal .detail-main{
    height:360px !important;
    max-height:46vh !important;
    min-height:240px !important;
  }
  .product-detail-modal .detail-info h1{font-size:24px !important;}
  .product-detail-modal .detail-price-box{grid-template-columns:1fr !important;}
  .product-detail-modal .detail-section{grid-column:auto !important;}
  .product-detail-modal .detail-specs th{width:42% !important;}
}

/* Phone desktop mode: keep the product modal inside the same 1180px desktop canvas; do not switch to device-width. */
html.desktop-view-mode .product-detail-modal:not(.hide){
  width:1180px !important;
  min-width:1180px !important;
  max-width:1180px !important;
  left:0 !important;
  right:auto !important;
  padding:24px 14px !important;
  overflow:auto !important;
}
html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-panel{
  width:1152px !important;
  max-width:1152px !important;
  min-width:0 !important;
  max-height:calc(100vh - 48px) !important;
  border-radius:20px !important;
  padding:22px !important;
}
html.desktop-view-mode .product-detail-modal:not(.hide) .product-detail-grid{
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
}
html.desktop-view-mode .product-detail-modal:not(.hide) .detail-main{height:500px !important;}
html.fb-browser .product-detail-modal:not(.hide),
html.inapp-browser .product-detail-modal:not(.hide){
  transform:none !important;
}

/* v45: Make homepage product-detail modal Back button exactly match Get Project Quote modal Back button */
#productDetailModal .product-detail-close,
#productDetailModal .product-detail-close.mobile-product-back-btn,
#productDetailModal .product-detail-close.product-detail-back-btn-all,
html.desktop-view-mode #productDetailModal .product-detail-close,
html.inapp-browser #productDetailModal .product-detail-close,
html.fb-browser #productDetailModal .product-detail-close{
  position:relative !important;
  top:auto !important;
  right:auto !important;
  bottom:auto !important;
  left:auto !important;
  float:none !important;
  z-index:5 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:auto !important;
  min-width:118px !important;
  height:auto !important;
  min-height:46px !important;
  max-width:220px !important;
  padding:12px 18px !important;
  margin:0 0 18px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font:inherit !important;
  font-size:17px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:0 12px 28px rgba(0,86,214,.30) !important;
  cursor:pointer !important;
  transform:none !important;
  -webkit-tap-highlight-color:transparent !important;
}
#productDetailModal .product-detail-close:hover,
#productDetailModal .product-detail-close.mobile-product-back-btn:hover,
#productDetailModal .product-detail-close.product-detail-back-btn-all:hover{
  background:#0048b5 !important;
  text-decoration:none !important;
  box-shadow:0 16px 34px rgba(0,86,214,.36) !important;
}
#productDetailModal .product-detail-close:active,
#productDetailModal .product-detail-close.mobile-product-back-btn:active,
#productDetailModal .product-detail-close.product-detail-back-btn-all:active{
  transform:translateY(1px) !important;
}

/* v46: Homepage product detail modal must match the Products page detail modal size and Back button behavior. */
#productDetailModal.product-detail-modal:not(.hide){
  position:fixed !important;
  inset:0 !important;
  z-index:100600 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:24px 14px !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  background:transparent !important;
  transform:none !important;
}
#productDetailModal.product-detail-modal:not(.hide) .product-detail-panel{
  position:relative !important;
  z-index:1 !important;
  margin:0 auto !important;
  width:min(1180px, calc(100vw - 28px)) !important;
  max-width:min(1180px, calc(100vw - 28px)) !important;
  max-height:calc(100vh - 48px) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  background:#fff !important;
  border-radius:20px !important;
  box-shadow:0 30px 90px rgba(0,0,0,.35) !important;
  padding:22px !important;
  box-sizing:border-box !important;
}
#productDetailModal.product-detail-modal:not(.hide) .product-detail-close,
#productDetailModal.product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn,
#productDetailModal.product-detail-modal:not(.hide) .product-detail-close.product-detail-back-btn-all{
  position:sticky !important;
  top:0 !important;
  left:0 !important;
  right:auto !important;
  bottom:auto !important;
  float:none !important;
  z-index:80 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  width:auto !important;
  min-width:118px !important;
  min-height:46px !important;
  max-width:220px !important;
  height:auto !important;
  padding:12px 18px !important;
  margin:0 0 18px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font:inherit !important;
  font-size:17px !important;
  font-weight:900 !important;
  line-height:1 !important;
  box-shadow:0 12px 28px rgba(0,86,214,.30) !important;
  text-decoration:none !important;
  cursor:pointer !important;
  transform:none !important;
}
#productDetailModal.product-detail-modal:not(.hide) .product-detail-grid{
  display:grid !important;
  grid-template-columns:minmax(300px,1.05fr) minmax(320px,.95fr) !important;
  gap:24px !important;
  clear:both !important;
  width:100% !important;
}
#productDetailModal.product-detail-modal:not(.hide) .detail-main{
  height:520px !important;
  max-height:none !important;
  min-height:0 !important;
}
#productDetailModal.product-detail-modal:not(.hide) .detail-thumb{
  width:82px !important;
  height:72px !important;
  flex:0 0 82px !important;
}
/* Phone desktop keeps the 1180px canvas and no longer changes to device-width. */
html.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide),
html.fb-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide),
html.inapp-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide){
  width:1180px !important;
  min-width:1180px !important;
  max-width:1180px !important;
  left:0 !important;
  right:auto !important;
  padding:24px 14px !important;
  overflow:auto !important;
  height:100vh !important;
  max-height:100vh !important;
}
html.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .product-detail-panel,
html.fb-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .product-detail-panel,
html.inapp-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .product-detail-panel{
  position:relative !important;
  width:1152px !important;
  max-width:1152px !important;
  height:auto !important;
  max-height:calc(100vh - 48px) !important;
  min-height:0 !important;
  border-radius:20px !important;
  padding:22px !important;
  overflow:auto !important;
}
html.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .detail-main,
html.fb-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .detail-main,
html.inapp-browser.desktop-view-mode #productDetailModal.product-detail-modal:not(.hide) .detail-main{
  height:520px !important;
  max-height:none !important;
}
@media(max-width:920px){
  #productDetailModal.product-detail-modal:not(.hide){
    padding:0 !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .product-detail-backdrop{display:none !important;}
  #productDetailModal.product-detail-modal:not(.hide) .product-detail-panel{
    width:100vw !important;
    max-width:100vw !important;
    min-height:100vh !important;
    min-height:100dvh !important;
    max-height:none !important;
    border-radius:0 !important;
    padding:calc(12px + env(safe-area-inset-top, 0px)) 12px calc(18px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow:none !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .product-detail-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:12px !important;
    clear:none !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .detail-gallery,
  #productDetailModal.product-detail-modal:not(.hide) .detail-info,
  #productDetailModal.product-detail-modal:not(.hide) .detail-section{
    width:100% !important;
    min-width:0 !important;
    border-radius:16px !important;
    padding:12px !important;
    box-sizing:border-box !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .detail-main{
    height:min(64vh, 380px) !important;
    min-height:260px !important;
    border-radius:14px !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .detail-thumb{
    width:66px !important;
    height:58px !important;
    flex:0 0 66px !important;
    border-radius:10px !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .detail-info h1{
    font-size:24px !important;
    line-height:1.22 !important;
    margin:0 0 12px !important;
  }
  #productDetailModal.product-detail-modal:not(.hide) .detail-price-box{
    grid-template-columns:1fr 1fr !important;
  }
}
@media(max-width:920px){
  html.inapp-browser #productDetailModal.product-detail-modal:not(.hide) .detail-main{
    height:min(58vh, 360px) !important;
    min-height:230px !important;
  }
  html.fb-browser #productDetailModal.product-detail-modal:not(.hide) .detail-main{
    height:285px !important;
    min-height:230px !important;
  }
  html.inapp-browser #productDetailModal.product-detail-modal:not(.hide) .detail-info h1{
    font-size:21px !important;
    line-height:1.25 !important;
  }
}


/* v50 - ONLY phone desktop homepage product detail modal.
   Do not affect desktop, normal mobile, Products page, quote modal, or other pages. */
html.desktop-view-mode.home-phone-desktop-detail-open,
html.desktop-view-mode.home-phone-desktop-detail-open body,
html.desktop-view-mode body.home-phone-desktop-detail-open{
  overflow:hidden !important;
  overscroll-behavior:none !important;
  touch-action:none !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide){
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:auto !important;
  bottom:0 !important;
  width:1180px !important;
  min-width:1180px !important;
  max-width:1180px !important;
  height:100vh !important;
  max-height:100vh !important;
  z-index:2147482000 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:34px 20px 30px !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  background:transparent !important;
  transform:none !important;
  touch-action:none !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-backdrop{
  position:fixed !important;
  inset:0 !important;
  display:block !important;
  background:rgba(15,23,42,.62) !important;
  z-index:0 !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-panel{
  position:relative !important;
  z-index:1 !important;
  width:1140px !important;
  min-width:0 !important;
  max-width:1140px !important;
  height:auto !important;
  max-height:calc(100vh - 64px) !important;
  min-height:0 !important;
  margin:0 auto !important;
  padding:30px 28px 34px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  overscroll-behavior:contain !important;
  touch-action:pan-y !important;
  background:#fff !important;
  border-radius:22px !important;
  box-shadow:0 32px 95px rgba(0,0,0,.36) !important;
  box-sizing:border-box !important;
  transform:none !important;
  clip-path:none !important;
  contain:none !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close,
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close.mobile-product-back-btn,
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close.product-detail-back-btn-all,
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close.home-phone-desktop-large-back{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:18px !important;
  left:18px !important;
  right:auto !important;
  bottom:auto !important;
  z-index:2147483000 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  width:auto !important;
  min-width:176px !important;
  max-width:260px !important;
  height:auto !important;
  min-height:64px !important;
  padding:18px 28px !important;
  margin:0 0 24px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0056D6 !important;
  color:#fff !important;
  font-family:inherit !important;
  font-size:22px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-decoration:none !important;
  box-shadow:0 16px 36px rgba(0,86,214,.38) !important;
  transform:translateZ(0) !important;
  -webkit-transform:translateZ(0) !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  white-space:nowrap !important;
  box-sizing:border-box !important;
  float:none !important;
  overflow:visible !important;
  clip:auto !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close:hover,
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-close:active{
  background:#0048b5 !important;
  color:#fff !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) #productDetailContent{
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
  box-sizing:border-box !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-grid{
  display:grid !important;
  grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
  gap:24px !important;
  width:100% !important;
  clear:both !important;
}
html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .detail-main{
  height:520px !important;
  max-height:none !important;
}
@media(max-width:920px){
  html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide){
    width:1180px !important;
    min-width:1180px !important;
    max-width:1180px !important;
    height:100vh !important;
    max-height:100vh !important;
    padding:34px 20px 30px !important;
    align-items:flex-start !important;
    justify-content:center !important;
    overflow:hidden !important;
  }
  html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-panel{
    width:1140px !important;
    max-width:1140px !important;
    min-height:0 !important;
    max-height:calc(100vh - 64px) !important;
    border-radius:22px !important;
    padding:30px 28px 34px !important;
    box-shadow:0 32px 95px rgba(0,0,0,.36) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
  }
  html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .product-detail-grid{
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr) !important;
    gap:24px !important;
  }
  html.desktop-view-mode #productDetailModal.home-product-detail-modal:not(.hide) .detail-main{
    height:520px !important;
    min-height:0 !important;
    max-height:none !important;
  }
}

/* v53: mobile product-list videos are manual tap-to-play/tap-to-pause, no autoplay */
@media (hover:none), (pointer:coarse), (max-width:900px){
  .product-main-video{cursor:pointer;-webkit-tap-highlight-color:transparent;}
  .card .media:has(.product-main-video){cursor:pointer;}
}


/* v55: homepage product-list video play buttons keep the same dark round style as detail video thumbnails */
.card .media{position:relative;}
.product-video-toggle{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:46px !important;
  height:46px !important;
  border:0 !important;
  border-radius:999px !important;
  background:rgba(15,23,42,.78) !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:6 !important;
  cursor:pointer !important;
  box-shadow:0 10px 24px rgba(15,23,42,.30) !important;
  -webkit-tap-highlight-color:transparent !important;
}
.product-video-toggle .product-video-icon-play{display:block !important;font-size:22px !important;margin-left:3px !important;line-height:1 !important;}
.product-video-toggle .product-video-icon-pause{display:none !important;font-size:20px !important;font-weight:900 !important;letter-spacing:-5px !important;line-height:1 !important;transform:translateX(-2px) !important;}
.media.product-video-playing .product-video-toggle{opacity:.85 !important;}
.media.product-video-playing .product-video-icon-play{display:none !important;}
.media.product-video-playing .product-video-icon-pause{display:block !important;}
.thumb .video-play-badge{
  position:absolute !important;
  right:6px !important;
  bottom:6px !important;
  width:22px !important;
  height:22px !important;
  border-radius:50% !important;
  background:rgba(15,23,42,.78) !important;
  color:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:11px !important;
  line-height:1 !important;
  z-index:3 !important;
}
@media (hover:none), (pointer:coarse), (max-width:900px){
  .product-main-video{cursor:pointer;-webkit-tap-highlight-color:transparent;}
  .card .media:has(.product-main-video){cursor:pointer;}
  .product-video-toggle{width:52px !important;height:52px !important;}
  .product-video-toggle .product-video-icon-play{font-size:24px !important;}
}




/* v64 CLEAN SOCIAL BUTTON RULES
   Clean restart for mobile social buttons. Old v55-v63 social animation patches were removed.
   Scope: only mobile widths and phone desktop/mobile header action buttons.
   Layout:
   - Normal mobile and inner mobile pages: language row first, then WhatsApp / Instagram / Facebook in one row.
   - Phone desktop homepage: screenshot style, Español + green WhatsApp text button; WhatsApp breathes.
   - Phone desktop Products / Projects / About / Contact: language row first, then 3 social icons in one row.
   Animation:
   - All required buttons breathe by animating the INNER img when possible. This avoids parent transform conflicts.
   - Homepage phone-desktop text WhatsApp breathes on the button itself.
   - No shine, no black ring, no pseudo glow. */

@media (max-width:1200px){
  .header .actions{
    overflow:visible !important;
  }

  /* Default mobile / inner-page row layout */
  html:not(.desktop-view-mode) .header .actions,
  html.desktop-view-mode body:not(.home-page) .header .actions,
  html.mobile-safe-header .header .actions,
  html.force-mobile-header .header .actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:center !important;
    gap:18px 30px !important;
    row-gap:18px !important;
    column-gap:30px !important;
    overflow:visible !important;
  }

  html:not(.desktop-view-mode) .header .actions > #langToggle,
  html.desktop-view-mode body:not(.home-page) .header .actions > #langToggle,
  html.mobile-safe-header .header .actions > #langToggle,
  html.force-mobile-header .header .actions > #langToggle{
    order:1 !important;
    flex:0 0 min(100%, 760px) !important;
    width:min(100%, 760px) !important;
    max-width:min(100%, 760px) !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 auto !important;
  }

  /* Social icon row: WhatsApp / Instagram / Facebook */
  html:not(.desktop-view-mode) .header .actions > #waBtn,
  html.desktop-view-mode body:not(.home-page) .header .actions > #waBtn,
  html.mobile-safe-header .header .actions > #waBtn,
  html.force-mobile-header .header .actions > #waBtn,
  html:not(.desktop-view-mode) .header .actions > .mobile-action-social,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-social,
  html.mobile-safe-header .header .actions > .mobile-action-social,
  html.force-mobile-header .header .actions > .mobile-action-social{
    order:2 !important;
    display:inline-flex !important;
    visibility:visible !important;
    opacity:1 !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 56px !important;
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    max-width:56px !important;
    max-height:56px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:999px !important;
    overflow:visible !important;
    pointer-events:auto !important;
    transform:none !important;
    animation:none !important;
    -webkit-animation:none !important;
  }

  html:not(.desktop-view-mode) .header .actions > #waBtn,
  html.desktop-view-mode body:not(.home-page) .header .actions > #waBtn,
  html.mobile-safe-header .header .actions > #waBtn,
  html.force-mobile-header .header .actions > #waBtn{
    background:#22c55e !important;
    color:#fff !important;
    box-shadow:0 12px 26px rgba(34,197,94,.24) !important;
  }

  html:not(.desktop-view-mode) .header .actions > .mobile-action-social,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-social,
  html.mobile-safe-header .header .actions > .mobile-action-social,
  html.force-mobile-header .header .actions > .mobile-action-social{
    background:#fff !important;
    border:1px solid rgba(15,23,42,.08) !important;
    box-shadow:0 10px 24px rgba(15,23,42,.12) !important;
  }

  html:not(.desktop-view-mode) .header .actions > .mobile-action-instagram,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-instagram,
  html.mobile-safe-header .header .actions > .mobile-action-instagram,
  html.force-mobile-header .header .actions > .mobile-action-instagram{
    order:3 !important;
  }

  html:not(.desktop-view-mode) .header .actions > .mobile-action-facebook,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-facebook,
  html.mobile-safe-header .header .actions > .mobile-action-facebook,
  html.force-mobile-header .header .actions > .mobile-action-facebook{
    order:4 !important;
  }

  html:not(.desktop-view-mode) .header .actions > #waBtn .wa-text,
  html.desktop-view-mode body:not(.home-page) .header .actions > #waBtn .wa-text,
  html.mobile-safe-header .header .actions > #waBtn .wa-text,
  html.force-mobile-header .header .actions > #waBtn .wa-text{
    display:none !important;
  }

  html:not(.desktop-view-mode) .header .actions > #waBtn .mobile-action-whatsapp-icon,
  html.desktop-view-mode body:not(.home-page) .header .actions > #waBtn .mobile-action-whatsapp-icon,
  html.mobile-safe-header .header .actions > #waBtn .mobile-action-whatsapp-icon,
  html.force-mobile-header .header .actions > #waBtn .mobile-action-whatsapp-icon,
  html:not(.desktop-view-mode) .header .actions > .mobile-action-social img,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-social img,
  html.mobile-safe-header .header .actions > .mobile-action-social img,
  html.force-mobile-header .header .actions > .mobile-action-social img{
    display:block !important;
    width:37px !important;
    height:37px !important;
    object-fit:contain !important;
    pointer-events:none !important;
    transform-origin:center center !important;
    will-change:transform, filter !important;
    animation:v64IconBreath 1.45s ease-in-out infinite !important;
    -webkit-animation:v64IconBreath 1.45s ease-in-out infinite !important;
  }

  html:not(.desktop-view-mode) .header .actions > .mobile-action-instagram img,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-instagram img,
  html.mobile-safe-header .header .actions > .mobile-action-instagram img,
  html.force-mobile-header .header .actions > .mobile-action-instagram img{
    animation-delay:.14s !important;
    -webkit-animation-delay:.14s !important;
  }

  html:not(.desktop-view-mode) .header .actions > .mobile-action-facebook img,
  html.desktop-view-mode body:not(.home-page) .header .actions > .mobile-action-facebook img,
  html.mobile-safe-header .header .actions > .mobile-action-facebook img,
  html.force-mobile-header .header .actions > .mobile-action-facebook img{
    animation-delay:.28s !important;
    -webkit-animation-delay:.28s !important;
  }

  /* Kill all old shine / ring / black-circle pseudo layers */
  .header .actions > #waBtn::before,
  .header .actions > #waBtn::after,
  .header .actions > .mobile-action-social::before,
  .header .actions > .mobile-action-social::after{
    content:none !important;
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    animation:none !important;
    -webkit-animation:none !important;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  /* Phone desktop homepage ONLY: screenshot style, not icon row */
  html.desktop-view-mode body.home-page .header .actions,
  html.mobile-safe-header.desktop-view-mode body.home-page .header .actions,
  html.force-mobile-header.desktop-view-mode body.home-page .header .actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:10px !important;
    column-gap:10px !important;
    row-gap:0 !important;
    overflow:visible !important;
  }

  html.desktop-view-mode body.home-page .header .actions .mobile-action-social,
  html.mobile-safe-header.desktop-view-mode body.home-page .header .actions .mobile-action-social,
  html.force-mobile-header.desktop-view-mode body.home-page .header .actions .mobile-action-social{
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    min-width:0 !important;
    max-width:0 !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
  }

  html.desktop-view-mode body.home-page .header #langToggle,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #langToggle,
  html.force-mobile-header.desktop-view-mode body.home-page .header #langToggle{
    order:1 !important;
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:72px !important;
    height:38px !important;
    min-height:38px !important;
    padding:0 14px !important;
    border-radius:8px !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  html.desktop-view-mode body.home-page .header #waBtn,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn{
    order:2 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:88px !important;
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    padding:0 14px !important;
    border-radius:8px !important;
    background:#57c96b !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;
    box-shadow:0 8px 18px rgba(87,201,107,.24) !important;
    overflow:visible !important;
    transform-origin:center center !important;
    will-change:transform, filter !important;
    animation:v64ButtonBreath 1.45s ease-in-out infinite !important;
    -webkit-animation:v64ButtonBreath 1.45s ease-in-out infinite !important;
  }

  html.desktop-view-mode body.home-page .header #waBtn .wa-text,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn .wa-text,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn .wa-text{
    display:inline !important;
  }

  html.desktop-view-mode body.home-page .header #waBtn .mobile-action-whatsapp-icon,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn .mobile-action-whatsapp-icon,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn .mobile-action-whatsapp-icon{
    display:none !important;
    animation:none !important;
    -webkit-animation:none !important;
  }
}

@keyframes v64IconBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@-webkit-keyframes v64IconBreath{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{-webkit-transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{-webkit-transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{-webkit-transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@keyframes v64ButtonBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1); box-shadow:0 8px 18px rgba(87,201,107,.24);}
  28%{transform:translate3d(0,-3px,0) scale(1.08); box-shadow:0 14px 28px rgba(87,201,107,.34);}
  56%{transform:translate3d(0,0,0) scale(.98); box-shadow:0 6px 14px rgba(87,201,107,.18);}
  78%{transform:translate3d(0,-1px,0) scale(1.04); box-shadow:0 10px 22px rgba(87,201,107,.28);}
}
@-webkit-keyframes v64ButtonBreath{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); box-shadow:0 8px 18px rgba(87,201,107,.24);}
  28%{-webkit-transform:translate3d(0,-3px,0) scale(1.08); box-shadow:0 14px 28px rgba(87,201,107,.34);}
  56%{-webkit-transform:translate3d(0,0,0) scale(.98); box-shadow:0 6px 14px rgba(87,201,107,.18);}
  78%{-webkit-transform:translate3d(0,-1px,0) scale(1.04); box-shadow:0 10px 22px rgba(87,201,107,.28);}
}


/* v65: phone-desktop homepage WhatsApp runtime breath target.
   This is only for the homepage top WhatsApp text button in mobile desktop mode. */
@media (max-width:1200px){
  html.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:88px !important;
    height:38px !important;
    min-height:38px !important;
    max-height:38px !important;
    padding:0 14px !important;
    border-radius:8px !important;
    background:#57c96b !important;
    color:#fff !important;
    font-size:13px !important;
    font-weight:800 !important;
    line-height:1 !important;
    white-space:nowrap !important;
    transform-origin:center center !important;
    will-change:transform !important;
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    overflow:visible !important;
  }
  html.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::before,
  html.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::after,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::before,
  html.mobile-safe-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::after,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::before,
  html.force-mobile-header.desktop-view-mode body.home-page .header #waBtn.v65-home-wa-breath::after{
    content:none !important;
    display:none !important;
  }
}






/* 2) Normal mobile homepage hero video restore */
@media (max-width:680px){
  html:not(.desktop-view-mode) body.home-page .hero,
  html:not(.desktop-view-mode) body.home-page .hero .container{
    overflow:visible !important;
  }

  html:not(.desktop-view-mode) body.home-page .hero .container{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
  }

  html:not(.desktop-view-mode) body.home-page #heroMedia,
  html:not(.desktop-view-mode) body.home-page .hero-media{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100% !important;
    max-width:100% !important;
    min-height:220px !important;
    height:auto !important;
    overflow:visible !important;
    position:relative !important;
    z-index:1 !important;
  }

  html:not(.desktop-view-mode) body.home-page #heroMedia:empty{
    min-height:220px !important;
    background:#0f172a !important;
    border-radius:18px !important;
  }

  html:not(.desktop-view-mode) body.home-page .hero-video-gallery{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100% !important;
    max-width:100% !important;
    min-height:220px !important;
    overflow:hidden !important;
    border-radius:18px !important;
    background:#0f172a !important;
  }

  html:not(.desktop-view-mode) body.home-page #heroMainVideo,
  html:not(.desktop-view-mode) body.home-page .hero-video-gallery video{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    min-height:220px !important;
    object-fit:cover !important;
    background:#0f172a !important;
    position:relative !important;
    z-index:1 !important;
  }

  html:not(.desktop-view-mode) body.home-page .hero-video-thumbs{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}






/* v72: Products page product-list intro matches homepage product cards.
   Applies to desktop EN/ES, normal mobile EN/ES, phone desktop EN/ES,
   and Facebook / Instagram in-app browsers. */
.products-page-card-body .products-page-best-for,
.products-page-card-body .best-for{
  margin:12px 0 14px !important;
  padding:10px 12px !important;
  border-radius:14px !important;
  background:#f0fdf4 !important;
  border:1px solid #bbf7d0 !important;
  color:#334155 !important;
  line-height:1.55 !important;
  font-size:14px !important;
}
.products-page-card-body .products-page-best-for b,
.products-page-card-body .best-for b{
  color:#16a34a !important;
  margin-right:4px !important;
}
.products-page-card-body .products-page-quick-specs,
.products-page-card-body .quick-specs{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  margin:12px 0 14px !important;
}
.products-page-card-body .products-page-quick-specs span,
.products-page-card-body .quick-specs span{
  display:block !important;
  background:#f8fafc !important;
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  padding:8px 10px !important;
  color:#1f2937 !important;
  font-size:12px !important;
  line-height:1.35 !important;
  min-height:44px !important;
}
.products-page-card-body .products-page-quick-specs em,
.products-page-card-body .quick-specs em{
  display:block !important;
  font-style:normal !important;
  color:#0056D6 !important;
  font-weight:900 !important;
  font-size:11px !important;
  margin-bottom:3px !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}
.products-page-price-row{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  color:#c2410c !important;
  background:#fff7ed !important;
  border:1px solid #fed7aa !important;
  border-radius:12px !important;
  padding:10px !important;
  margin-top:auto !important;
}
.products-page-price-row .label{
  color:#9a3412 !important;
  font-size:12px !important;
  font-weight:700 !important;
  margin-bottom:3px !important;
}
.products-page-price-row .price,
.products-page-price-row b{
  color:#ea580c !important;
  font-weight:900 !important;
  text-decoration:none !important;
}
.products-page-card-body > p{
  display:none !important;
}
.products-page-actions .btn.green{
  box-shadow:0 10px 22px rgba(22,163,74,.22) !important;
  font-weight:900 !important;
}
.products-page-actions .btn.secondary{
  font-weight:800 !important;
}
@media(max-width:680px){
  .products-page-card-body .products-page-best-for,
  .products-page-card-body .best-for{
    font-size:13px !important;
    padding:10px 12px !important;
  }
  .products-page-card-body .products-page-quick-specs,
  .products-page-card-body .quick-specs{
    gap:8px !important;
  }
  .products-page-card-body .products-page-quick-specs span,
  .products-page-card-body .quick-specs span{
    min-height:42px !important;
  }
}


/* v74: Desktop WhatsApp button clean rebuild.
   Applies only to desktop width Home / Products / Projects / About / Contact.
   Fixes the oversized broken WhatsApp block by hiding the mobile icon and rebuilding
   the desktop button as a normal text button with breathing motion. */
@media (min-width:1201px){
  .header .actions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:14px !important;
    overflow:visible !important;
  }

  .header #waBtn,
  .header #waBtn.desktop-wa-clean,
  body.home-page .header #waBtn,
  body.products-page .header #waBtn,
  body.projects-page .header #waBtn,
  body.about-page .header #waBtn,
  body.contact-page .header #waBtn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 auto !important;
    width:auto !important;
    min-width:96px !important;
    max-width:none !important;
    height:48px !important;
    min-height:48px !important;
    max-height:48px !important;
    padding:0 20px !important;
    border-radius:10px !important;
    background:#22c55e !important;
    color:#fff !important;
    border:0 !important;
    font-size:15px !important;
    font-weight:900 !important;
    line-height:1 !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    overflow:visible !important;
    box-shadow:0 12px 26px rgba(34,197,94,.26) !important;
    transform-origin:center center !important;
    will-change:transform, box-shadow !important;
    animation:v74DesktopWaBreath 1.65s ease-in-out infinite !important;
    -webkit-animation:v74DesktopWaBreath 1.65s ease-in-out infinite !important;
  }

  .header #waBtn .wa-text,
  .header #waBtn.desktop-wa-clean .wa-text{
    display:inline !important;
    visibility:visible !important;
    opacity:1 !important;
    color:#fff !important;
    font-size:15px !important;
    font-weight:900 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  .header #waBtn .mobile-action-whatsapp-icon,
  .header #waBtn.desktop-wa-clean .mobile-action-whatsapp-icon,
  .header #waBtn img.mobile-action-whatsapp-icon{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    width:0 !important;
    height:0 !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:0 !important;
    max-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    pointer-events:none !important;
  }

  .header #waBtn::before,
  .header #waBtn::after,
  .header #waBtn.desktop-wa-clean::before,
  .header #waBtn.desktop-wa-clean::after{
    content:none !important;
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    animation:none !important;
    -webkit-animation:none !important;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  .header #waBtn:hover,
  .header #waBtn.desktop-wa-clean:hover{
    background:#16a34a !important;
    color:#fff !important;
    text-decoration:none !important;
  }
}

@keyframes v74DesktopWaBreath{
  0%,100%{
    transform:translate3d(0,0,0) scale(1);
    box-shadow:0 12px 26px rgba(34,197,94,.26);
  }
  30%{
    transform:translate3d(0,-3px,0) scale(1.065);
    box-shadow:0 18px 34px rgba(34,197,94,.36);
  }
  58%{
    transform:translate3d(0,0,0) scale(.99);
    box-shadow:0 9px 20px rgba(34,197,94,.20);
  }
  78%{
    transform:translate3d(0,-1px,0) scale(1.035);
    box-shadow:0 14px 28px rgba(34,197,94,.30);
  }
}
@-webkit-keyframes v74DesktopWaBreath{
  0%,100%{
    -webkit-transform:translate3d(0,0,0) scale(1);
    box-shadow:0 12px 26px rgba(34,197,94,.26);
  }
  30%{
    -webkit-transform:translate3d(0,-3px,0) scale(1.065);
    box-shadow:0 18px 34px rgba(34,197,94,.36);
  }
  58%{
    -webkit-transform:translate3d(0,0,0) scale(.99);
    box-shadow:0 9px 20px rgba(34,197,94,.20);
  }
  78%{
    -webkit-transform:translate3d(0,-1px,0) scale(1.035);
    box-shadow:0 14px 28px rgba(34,197,94,.30);
  }
}


/* v75: Detail popup "View LED Display Products" buttons redirect to Instagram.
   Product list card buttons remain their original behavior. */
.product-detail-modal a.btn.secondary,
.products-detail-modal a.btn.secondary,
.product-detail-panel a.btn.secondary,
.products-detail-panel a.btn.secondary{
  text-decoration:none !important;
  cursor:pointer !important;
}





/* v77: Desktop Products / Projects / About / Contact header two-row restore.
   Based on v76, but removes the failed one-line spacing layout.
   Desktop inner pages should match the old structure:
   Row 1: social + brand + search/actions/trust area
   Row 2: Home / Products / Projects / About / Contact navigation.
   Scope: desktop inner pages only. Homepage and all mobile modes are not changed. */
@media (min-width:1201px){
  body:not(.home-page) .header{
    overflow:visible !important;
  }

  body:not(.home-page) .header .container{
    display:grid !important;
    grid-template-columns:auto auto minmax(320px, 520px) auto auto !important;
    grid-template-rows:auto auto !important;
    align-items:center !important;
    column-gap:18px !important;
    row-gap:14px !important;
    width:min(1180px, calc(100% - 32px)) !important;
    margin:0 auto !important;
  }

  body:not(.home-page) .header .header-social-left{
    grid-column:1 !important;
    grid-row:1 !important;
    justify-self:start !important;
    align-self:center !important;
    display:flex !important;
    gap:12px !important;
    margin:0 !important;
  }

  body:not(.home-page) .header .brand{
    grid-column:2 !important;
    grid-row:1 !important;
    justify-self:start !important;
    align-self:center !important;
    min-width:260px !important;
    margin:0 !important;
  }

  body:not(.home-page) .header .search{
    grid-column:3 !important;
    grid-row:1 !important;
    justify-self:center !important;
    align-self:center !important;
    width:100% !important;
    max-width:520px !important;
    margin:0 !important;
  }

  body:not(.home-page) .header .actions{
    grid-column:4 !important;
    grid-row:1 !important;
    justify-self:end !important;
    align-self:center !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:12px !important;
    column-gap:12px !important;
    width:auto !important;
    max-width:none !important;
    margin:0 !important;
    overflow:visible !important;
    flex-wrap:nowrap !important;
  }

  body:not(.home-page) .header .trust-bar{
    grid-column:5 !important;
    grid-row:1 !important;
    justify-self:end !important;
    align-self:center !important;
    width:auto !important;
    max-width:330px !important;
    margin:0 !important;
  }

  body:not(.home-page) .header .main-nav{
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    justify-self:stretch !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
    width:100% !important;
    margin:0 !important;
    padding:14px 0 0 !important;
    border-top:1px solid rgba(15,23,42,.10) !important;
  }

  body:not(.home-page) .header .main-nav a{
    flex:1 1 0 !important;
    text-align:center !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:42px !important;
    margin:0 !important;
    padding:0 12px !important;
  }

  body:not(.home-page) .header #langToggle{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:92px !important;
    max-width:120px !important;
    height:48px !important;
    padding:0 18px !important;
    margin:0 !important;
    white-space:nowrap !important;
  }

  body:not(.home-page) .header #waBtn,
  body:not(.home-page) .header #waBtn.desktop-wa-clean{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:112px !important;
    max-width:128px !important;
    height:48px !important;
    padding:0 20px !important;
    margin:0 !important;
    white-space:nowrap !important;
  }
}

/* Slightly tighter desktop inner header for medium desktop width */
@media (min-width:1201px) and (max-width:1380px){
  body:not(.home-page) .header .container{
    grid-template-columns:auto auto minmax(280px, 430px) auto auto !important;
    column-gap:14px !important;
  }
  body:not(.home-page) .header .brand{
    min-width:220px !important;
  }
  body:not(.home-page) .header .trust-bar{
    max-width:300px !important;
  }
}


/* Fallback if v64IconBreath was removed by older cache/merge. Keep identical timing. */
@keyframes v78MobileSocialBreathSync{
  0%,100%{transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@-webkit-keyframes v78MobileSocialBreathSync{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{-webkit-transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{-webkit-transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{-webkit-transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}






















/* v90: v83 audit fix for normal mobile homepage social buttons.
   Root cause found: old v71ApplyMobileHomeSocialSpacing() JS changed margins after load,
   causing WhatsApp to jump left and Facebook to jump right once/twice on refresh.
   Fix:
   - Removed old spacing JS.
   - Use pure CSS only for stable initial layout.
   - No dynamic margin-left / margin-right on load.
   - Parent buttons never animate; only icons breathe.
   Scope: normal mobile homepage Home only. */
@media (max-width:1200px){
  html:not(.desktop-view-mode) body.home-page .header .actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:center !important;
    overflow:visible !important;
    gap:18px 48px !important;
    row-gap:18px !important;
    column-gap:48px !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #langToggle{
    order:1 !important;
    flex:0 0 min(100%, 760px) !important;
    width:min(100%, 760px) !important;
    max-width:min(100%, 760px) !important;
    margin:0 auto !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-instagram,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-facebook{
    margin-left:0 !important;
    margin-right:0 !important;
    animation:none !important;
    -webkit-animation:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
    transition:none !important;
    overflow:visible !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn{
    order:2 !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-instagram{
    order:3 !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-facebook{
    order:4 !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn::before,
  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn::after,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-social::before,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-social::after{
    content:none !important;
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    animation:none !important;
    -webkit-animation:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn .mobile-action-whatsapp-icon,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-instagram img,
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-facebook img{
    display:block !important;
    transform-origin:center center !important;
    will-change:transform, filter !important;
    animation:v90StableHomeSocialBreath 1.45s ease-in-out infinite !important;
    -webkit-animation:v90StableHomeSocialBreath 1.45s ease-in-out infinite !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn .mobile-action-whatsapp-icon{
    animation-delay:0s !important;
    -webkit-animation-delay:0s !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-instagram img{
    animation-delay:.14s !important;
    -webkit-animation-delay:.14s !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-facebook img{
    animation-delay:.28s !important;
    -webkit-animation-delay:.28s !important;
  }
}

@media(max-width:560px){
  html:not(.desktop-view-mode) body.home-page .header .actions{
    column-gap:48px !important;
    gap:18px 48px !important;
  }
}

@keyframes v90StableHomeSocialBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@-webkit-keyframes v90StableHomeSocialBreath{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{-webkit-transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{-webkit-transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{-webkit-transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}


/* v91: normal mobile homepage WhatsApp old circle disabled.
   Based on v90 audit.
   Problem: old #waBtn green circle still breathes/shakes.
   Fix:
   - On normal mobile homepage only, old #waBtn is completely hidden.
   - A new independent .home-wa-clean-v91 button is shown in the original actions row.
   - The new button outer circle NEVER animates. Only its img breathes.
   - Instagram/Facebook keep their normal mobile homepage behavior.
   - Desktop / phone-desktop keep old #waBtn. */
.home-wa-clean-v91{
  display:none;
}

@media (max-width:1200px){
  html:not(.desktop-view-mode) body.home-page .header .actions{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    justify-content:center !important;
    gap:18px 48px !important;
    row-gap:18px !important;
    column-gap:48px !important;
    overflow:visible !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #langToggle{
    order:1 !important;
    flex:0 0 min(100%, 760px) !important;
    width:min(100%, 760px) !important;
    max-width:min(100%, 760px) !important;
    margin:0 auto !important;
  }

  /* Hide the old WhatsApp button completely on normal mobile homepage.
     This removes the old green circle from the mobile homepage render tree. */
  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn{
    order:99 !important;
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    width:0 !important;
    height:0 !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:0 !important;
    max-height:0 !important;
    flex:0 0 0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
    animation:none !important;
    -webkit-animation:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
    box-shadow:none !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn::before,
  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn::after{
    content:none !important;
    display:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    animation:none !important;
    -webkit-animation:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
  }

  /* New clean WhatsApp button in the same actions row. Outer circle is static. */
  html:not(.desktop-view-mode) body.home-page .header .actions > .home-wa-clean-v91{
    order:2 !important;
    display:inline-flex !important;
    visibility:visible !important;
    opacity:1 !important;
    align-items:center !important;
    justify-content:center !important;
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    max-width:56px !important;
    max-height:56px !important;
    flex:0 0 56px !important;
    padding:0 !important;
    margin:0 !important;
    border-radius:999px !important;
    background:#22c55e !important;
    box-shadow:0 12px 26px rgba(34,197,94,.24) !important;
    text-decoration:none !important;
    overflow:visible !important;
    pointer-events:auto !important;
    animation:none !important;
    -webkit-animation:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
    transition:none !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .home-wa-clean-v91::before,
  html:not(.desktop-view-mode) body.home-page .header .actions > .home-wa-clean-v91::after{
    content:none !important;
    display:none !important;
  }

  html:not(.desktop-view-mode) body.home-page .header .actions > .home-wa-clean-v91 img{
    display:block !important;
    width:37px !important;
    height:37px !important;
    object-fit:contain !important;
    pointer-events:none !important;
    transform-origin:center center !important;
    will-change:transform, filter !important;
    animation:v91HomeWaIconOnlyBreath 1.45s ease-in-out infinite !important;
    -webkit-animation:v91HomeWaIconOnlyBreath 1.45s ease-in-out infinite !important;
  }

  /* Keep Instagram/Facebook in row after new WhatsApp */
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-instagram{
    order:3 !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  html:not(.desktop-view-mode) body.home-page .header .actions > .mobile-action-facebook{
    order:4 !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
}

@keyframes v91HomeWaIconOnlyBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@-webkit-keyframes v91HomeWaIconOnlyBreath{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{-webkit-transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{-webkit-transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{-webkit-transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}


/* v92: mobile homepage refresh flash fix.
   Based on v91.
   Problem shown in screenshot:
   1) Normal mobile homepage top header block flashes/jumps on refresh.
   2) Normal mobile homepage Desktop Version switch button flashes/jumps on refresh.
   Fix:
   - Disable transition / transform / parent animation on the homepage header area.
   - Disable transition / transform / animation on view-mode switch button.
   - Keep only the social icon image breathing animation.
   - No desktop / phone-desktop / inner-page / product / video changes. */

@media (max-width:1200px){
  html:not(.desktop-view-mode) body.home-page .header,
  html:not(.desktop-view-mode) body.home-page .header .container,
  html:not(.desktop-view-mode) body.home-page .brand,
  html:not(.desktop-view-mode) body.home-page .main-nav,
  html:not(.desktop-view-mode) body.home-page .header .actions,
  html:not(.desktop-view-mode) body.home-page .header .actions > #langToggle{
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
  }

  /* Stop old green WhatsApp button completely on normal mobile homepage */
  html:not(.desktop-view-mode) body.home-page .header .actions > #waBtn{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
    width:0 !important;
    height:0 !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:0 !important;
    max-height:0 !important;
    flex:0 0 0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    overflow:hidden !important;
    pointer-events:none !important;
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
    box-shadow:none !important;
  }

  /* New clean WhatsApp outer circle must stay fixed; only img breathes */
  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91,
  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91:hover,
  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91:active,
  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91:focus{
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
  }

  /* Instagram / Facebook parent buttons also fixed */
  html:not(.desktop-view-mode) body.home-page .mobile-action-instagram,
  html:not(.desktop-view-mode) body.home-page .mobile-action-facebook,
  html:not(.desktop-view-mode) body.home-page .mobile-action-instagram:hover,
  html:not(.desktop-view-mode) body.home-page .mobile-action-facebook:hover,
  html:not(.desktop-view-mode) body.home-page .mobile-action-instagram:active,
  html:not(.desktop-view-mode) body.home-page .mobile-action-facebook:active{
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
  }

  /* Re-enable only icon breathing */
  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91 img,
  html:not(.desktop-view-mode) body.home-page .mobile-action-instagram img,
  html:not(.desktop-view-mode) body.home-page .mobile-action-facebook img{
    transform-origin:center center !important;
    will-change:transform, filter !important;
    animation:v92HomeHeaderIconBreath 1.45s ease-in-out infinite !important;
    -webkit-animation:v92HomeHeaderIconBreath 1.45s ease-in-out infinite !important;
    transition:none !important;
  }

  html:not(.desktop-view-mode) body.home-page .home-wa-clean-v91 img{
    animation-delay:0s !important;
    -webkit-animation-delay:0s !important;
  }
  html:not(.desktop-view-mode) body.home-page .mobile-action-instagram img{
    animation-delay:.14s !important;
    -webkit-animation-delay:.14s !important;
  }
  html:not(.desktop-view-mode) body.home-page .mobile-action-facebook img{
    animation-delay:.28s !important;
    -webkit-animation-delay:.28s !important;
  }

  /* Disable refresh-time flash on the blue Desktop Version / Mobile Version switch button */
  html:not(.desktop-view-mode) body.home-page #viewModeToggle,
  html:not(.desktop-view-mode) body.home-page #desktopModeToggle,
  html:not(.desktop-view-mode) body.home-page .view-mode-toggle,
  html:not(.desktop-view-mode) body.home-page .mode-toggle,
  html:not(.desktop-view-mode) body.home-page .desktop-version-toggle,
  html:not(.desktop-view-mode) body.home-page .mobile-version-toggle,
  html:not(.desktop-view-mode) body.home-page .desktop-switch,
  html:not(.desktop-view-mode) body.home-page .mobile-switch,
  html:not(.desktop-view-mode) body.home-page .view-switch,
  html:not(.desktop-view-mode) body.home-page [data-view-mode],
  html:not(.desktop-view-mode) body.home-page [data-desktop-version],
  html:not(.desktop-view-mode) body.home-page button,
  html:not(.desktop-view-mode) body.home-page a{
    backface-visibility:hidden !important;
    -webkit-backface-visibility:hidden !important;
  }

  html:not(.desktop-view-mode) body.home-page #viewModeToggle,
  html:not(.desktop-view-mode) body.home-page #desktopModeToggle,
  html:not(.desktop-view-mode) body.home-page .view-mode-toggle,
  html:not(.desktop-view-mode) body.home-page .mode-toggle,
  html:not(.desktop-view-mode) body.home-page .desktop-version-toggle,
  html:not(.desktop-view-mode) body.home-page .mobile-version-toggle,
  html:not(.desktop-view-mode) body.home-page .desktop-switch,
  html:not(.desktop-view-mode) body.home-page .mobile-switch,
  html:not(.desktop-view-mode) body.home-page .view-switch,
  html:not(.desktop-view-mode) body.home-page [data-view-mode],
  html:not(.desktop-view-mode) body.home-page [data-desktop-version]{
    animation:none !important;
    -webkit-animation:none !important;
    transition:none !important;
    transform:none !important;
    -webkit-transform:none !important;
    translate:0 0 !important;
    scale:1 !important;
  }

  /* During first load, freeze only the two reported areas to prevent one-frame flash */
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .header,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .header *,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page #viewModeToggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page #desktopModeToggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .view-mode-toggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .mode-toggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .desktop-version-toggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .mobile-version-toggle,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .desktop-switch,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .mobile-switch,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page .view-switch,
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page [data-view-mode],
  html.v92-no-mobile-home-flash:not(.desktop-view-mode) body.home-page [data-desktop-version]{
    transition:none !important;
  }
}

@keyframes v92HomeHeaderIconBreath{
  0%,100%{transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}
@-webkit-keyframes v92HomeHeaderIconBreath{
  0%,100%{-webkit-transform:translate3d(0,0,0) scale(1); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  28%{-webkit-transform:translate3d(0,-4px,0) scale(1.14); filter:drop-shadow(0 8px 8px rgba(15,23,42,.14));}
  56%{-webkit-transform:translate3d(0,0,0) scale(.97); filter:drop-shadow(0 0 0 rgba(0,0,0,0));}
  78%{-webkit-transform:translate3d(0,-2px,0) scale(1.06); filter:drop-shadow(0 5px 6px rgba(15,23,42,.10));}
}


/* v102: desktop browser keep desktop WhatsApp and hide mobile socials.
   Based on v92.
   No Header rebuild. No Hero rebuild.
   Only fixes desktop browser resize showing phone socials and hiding desktop WhatsApp. */

html.v102-desktop-browser body.home-page .header .actions > .home-wa-clean-v91,
html.v102-desktop-browser body.home-page .header .actions > .mobile-action-social,
html.v102-desktop-browser body.home-page .header .actions > .mobile-action-instagram,
html.v102-desktop-browser body.home-page .header .actions > .mobile-action-facebook{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

html.v102-desktop-browser body.home-page .header .actions > #waBtn{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

html.v102-desktop-browser body.home-page .header .actions > #waBtn .wa-text{
  display:inline !important;
  visibility:visible !important;
  opacity:1 !important;
}

html.v102-desktop-browser body.home-page .header .actions > #waBtn .mobile-action-whatsapp-icon{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
}

/* Hide phone-only floating controls on desktop browser, but do not rebuild layout */
html.v102-desktop-browser body.home-page #viewModeToggle,
html.v102-desktop-browser body.home-page .view-mode-toggle,
html.v102-desktop-browser body.home-page .mobile-sticky-whatsapp{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Keep desktop hero video visible */
html.v102-desktop-browser body.home-page .hero-video,
html.v102-desktop-browser body.home-page .hero-video-card,
html.v102-desktop-browser body.home-page .video-shell,
html.v102-desktop-browser body.home-page .hero-media,
html.v102-desktop-browser body.home-page .hero video{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}


/* v103: Projects Request Project Quotation uses the same quote contact modal as Home Get Project Quote.
   Scope: quote-contact-modal on all pages, including projects.html.
   It reuses existing .quote-contact-modal / .quote-contact-panel / .quote-contact-back rules. */
body.quote-contact-modal-open{
  overflow:hidden !important;
  touch-action:none !important;
}

.quote-contact-modal:not(.hide){
  display:flex !important;
}

.quote-contact-modal.hide{
  display:none !important;
}

.quote-contact-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:100500 !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding:24px 14px !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
}

.quote-contact-backdrop{
  position:fixed !important;
  inset:0 !important;
  background:rgba(15,23,42,.54) !important;
  backdrop-filter:blur(3px) !important;
}

.quote-contact-panel{
  position:relative !important;
  z-index:1 !important;
  width:min(1080px, calc(100vw - 28px)) !important;
  max-height:calc(100vh - 48px) !important;
  overflow:auto !important;
  -webkit-overflow-scrolling:touch !important;
  background:#fff !important;
  border:1px solid rgba(226,232,240,.96) !important;
  border-radius:24px !important;
  box-shadow:0 30px 90px rgba(15,23,42,.32) !important;
  padding:28px !important;
}

.quote-contact-back{
  position:sticky !important;
  top:0 !important;
  z-index:3 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:0 18px !important;
  margin:0 0 18px 0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0b63ce !important;
  color:#fff !important;
  font-weight:900 !important;
  font-size:16px !important;
  box-shadow:0 12px 26px rgba(11,99,206,.28) !important;
}

@media(max-width:768px){
  .quote-contact-modal{
    padding:12px 10px !important;
  }
  .quote-contact-panel{
    width:calc(100vw - 20px) !important;
    max-height:calc(100vh - 24px) !important;
    border-radius:20px !important;
    padding:18px !important;
  }
  .quote-contact-grid{
    grid-template-columns:1fr !important;
  }
}


/* v104: Home search recommendation banner.
   When customers search P3.91 / P5 / P2.6 / P2.9, show a recommendation box above product cards,
   same position as solution filter, before the product list. */
.active-solution-filter.search-recommendation-filter{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  width:100% !important;
  margin:0 0 24px 0 !important;
  padding:22px 26px !important;
  border:1px solid #bfdbfe !important;
  border-radius:20px !important;
  background:#eff6ff !important;
  box-shadow:0 14px 40px rgba(15,23,42,.06) !important;
}

.active-solution-filter.search-recommendation-filter b{
  display:block !important;
  margin:0 0 8px 0 !important;
  color:#0056d6 !important;
  font-size:22px !important;
  line-height:1.2 !important;
  font-weight:900 !important;
}

.active-solution-filter.search-recommendation-filter p{
  margin:0 !important;
  color:#486488 !important;
  font-size:17px !important;
  line-height:1.55 !important;
}

.active-solution-filter.search-recommendation-filter button{
  flex:0 0 auto !important;
  min-width:190px !important;
  min-height:52px !important;
  padding:0 24px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#0b63ce !important;
  color:#fff !important;
  font-size:16px !important;
  font-weight:900 !important;
  box-shadow:0 14px 32px rgba(11,99,206,.20) !important;
}

@media(max-width:900px){
  .active-solution-filter.search-recommendation-filter{
    flex-direction:column !important;
    align-items:flex-start !important;
    padding:18px !important;
    border-radius:18px !important;
  }
  .active-solution-filter.search-recommendation-filter button{
    width:100% !important;
    min-width:0 !important;
  }
}

/* 20260606 v114: Top initial navigation banner matches the reference image.
   Scope: Home / Products / Projects / About / Contact header nav only; the scrolled sticky clone is untouched. */
html:not(.nav-clone-active) body.home-page .header .main-nav,
html:not(.nav-clone-active) body.products-page-body .header .main-nav,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
html:not(.nav-clone-active) body.about-page-body .header .main-nav,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:0 !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  padding:14px 0 2px !important;
  margin:0 !important;
  background:transparent !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
  flex:1 1 20% !important;
  width:20% !important;
  max-width:20% !important;
  min-height:42px !important;
  padding:8px 14px !important;
  margin:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#1A1A1A !important;
  background:transparent !important;
  border-radius:999px !important;
  box-shadow:none !important;
  font-size:22px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-align:center !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
  color:#0056D6 !important;
  background:transparent !important;
  box-shadow:none !important;
  position:relative !important;
  isolation:isolate !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"]::before,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active::before{
  content:"" !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  width:clamp(112px,58%,176px) !important;
  height:calc(100% - 10px) !important;
  transform:translate(-50%,-50%) !important;
  border-radius:999px !important;
  background:#fff !important;
  box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  z-index:-1 !important;
}

@media(max-width:920px){
  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav{
    min-height:0 !important;
    padding:9px 6px !important;
    flex-wrap:nowrap !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a{
    min-height:42px !important;
    padding:7px 2px !important;
    font-size:13px !important;
  }

  html:not(.nav-clone-active):not(.desktop-view-mode) body.home-page .header .main-nav a[href="#home"]::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active):not(.desktop-view-mode) body.contact-page-body .header .main-nav a.active::before{
    width:calc(100% - 8px) !important;
    height:calc(100% - 8px) !important;
  }
}

@media(max-width:1200px){
  html:not(.nav-clone-active).desktop-view-mode body.home-page .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a{
    min-height:42px !important;
    font-size:20px !important;
  }

  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active{
    color:#0056D6 !important;
    background:transparent !important;
    box-shadow:none !important;
    position:relative !important;
    isolation:isolate !important;
  }

  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    width:clamp(112px,58%,176px) !important;
    height:calc(100% - 10px) !important;
    transform:translate(-50%,-50%) !important;
    border-radius:999px !important;
    background:#fff !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
    z-index:-1 !important;
  }
}

/* 20260606 v115: Real in-app narrow-screen correction.
   Keeps the initial top nav readable when phone-desktop-safe-page still renders at phone CSS width. */
@media(max-width:920px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    min-height:0 !important;
    padding:9px 6px !important;
    flex-wrap:nowrap !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-height:42px !important;
    padding:7px 2px !important;
    color:#1A1A1A !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
    font-weight:850 !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
    color:#0056D6 !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"]::before,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active::before{
    width:calc(100% - 6px) !important;
    height:calc(100% - 8px) !important;
  }

  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav{
    min-height:0 !important;
    padding:9px 6px !important;
    flex-wrap:nowrap !important;
  }

  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a{
    min-height:42px !important;
    padding:7px 2px !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
  }

  html:not(.nav-clone-active).phone-desktop-safe-page body.products-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.projects-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.about-page-body .header .main-nav a.active::before,
  html:not(.nav-clone-active).phone-desktop-safe-page body.contact-page-body .header .main-nav a.active::before{
    width:calc(100% - 6px) !important;
    height:calc(100% - 8px) !important;
  }
}

/* 20260607 v117 final override: V109 initial top nav sizing wins after v114/v115. */
html:not(.nav-clone-active) body.home-page .header .main-nav,
html:not(.nav-clone-active) body.products-page-body .header .main-nav,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
html:not(.nav-clone-active) body.about-page-body .header .main-nav,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
  justify-content:center !important;
  gap:56px !important;
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
  min-height:0 !important;
  padding:14px 0 2px !important;
  margin-top:4px !important;
  background:transparent !important;
  border-top:1px solid rgba(15,23,42,.08) !important;
  border-bottom:0 !important;
  box-shadow:none !important;
  overflow:visible !important;
  font-size:22px !important;
  font-weight:900 !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
  flex:0 0 auto !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  min-height:42px !important;
  padding:8px 14px !important;
  margin:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:inherit !important;
  font-weight:900 !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
  color:#0056D6 !important;
  background:#fff !important;
  box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
}

html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"]::before,
html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active::before,
html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active::before{
  content:none !important;
}

body:not(.home-page).products-page-body .header .main-nav,
body:not(.home-page).projects-page-body .header .main-nav,
body:not(.home-page).about-page-body .header .main-nav,
body:not(.home-page).contact-page-body .header .main-nav{
  grid-column:1 / -1 !important;
  grid-row:2 !important;
  justify-self:stretch !important;
  gap:0 !important;
  width:100% !important;
  margin:0 !important;
  padding:14px 0 0 !important;
  border-top:1px solid rgba(15,23,42,.10) !important;
}

body:not(.home-page).products-page-body .header .main-nav a,
body:not(.home-page).projects-page-body .header .main-nav a,
body:not(.home-page).about-page-body .header .main-nav a,
body:not(.home-page).contact-page-body .header .main-nav a{
  flex:1 1 0 !important;
  min-height:42px !important;
  padding:0 12px !important;
}

@media(max-width:1200px){
  html.desktop-view-mode:not(.nav-clone-active) body.home-page .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html.desktop-view-mode:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    justify-content:space-between !important;
    gap:0 !important;
    min-height:0 !important;
    overflow:hidden !important;
    padding-left:8px !important;
    padding-right:8px !important;
    background:transparent !important;
    box-shadow:none !important;
  }

  html.desktop-view-mode:not(.nav-clone-active) body.home-page .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html.desktop-view-mode:not(.nav-clone-active) body.contact-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html.phone-desktop-safe-page:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-height:42px !important;
    padding-left:2px !important;
    padding-right:2px !important;
    font-size:13px !important;
  }
}

@media(max-width:920px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    justify-content:space-between !important;
    gap:0 !important;
    min-height:0 !important;
    overflow-x:hidden !important;
    overflow-y:hidden !important;
    padding:9px 6px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
    line-height:1 !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    flex:1 1 20% !important;
    width:20% !important;
    max-width:20% !important;
    min-width:0 !important;
    min-height:42px !important;
    padding:7px 2px !important;
    margin:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    font-size:13px !important;
    line-height:1 !important;
    font-weight:900 !important;
    overflow:hidden !important;
    text-overflow:clip !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a[href="#home"],
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a.active,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a.active{
    background:#fff !important;
    box-shadow:0 0 0 2px rgba(0,86,214,.12), 0 8px 18px rgba(15,23,42,.10) !important;
  }
}

@media(max-width:430px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    padding:8px 3px !important;
    font-size:12px !important;
  }

  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    font-size:12px !important;
    letter-spacing:-.15px !important;
    padding-left:0 !important;
    padding-right:0 !important;
  }
}

/* V119 DESKTOP ONLY: compact proportional nav banner width
   Scope: desktop computer view only. It adjusts only the Home / Products / Projects / About / Contact nav row
   in the original top header and the scrolled fixed clone. No HTML/JS/content changes. */
@media (min-width:921px){
  html:not(.desktop-view-mode) .header .main-nav{
    flex:0 1 960px !important;
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html:not(.desktop-view-mode) .header .main-nav a{
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
  html:not(.desktop-view-mode) .sticky-main-nav{
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    padding:10px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html:not(.desktop-view-mode) .sticky-main-nav a{
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
  html:not(.desktop-view-mode){
    scroll-padding-top:72px !important;
  }
  html:not(.desktop-view-mode) section[id],
  html:not(.desktop-view-mode) div[id],
  html:not(.desktop-view-mode) footer[id]{
    scroll-margin-top:72px !important;
  }
}

/* V119 DESKTOP ONLY LOCK: page-specific override for all five desktop pages */
@media (min-width:921px){
  html body.home-page .header .main-nav,
  html body.products-page-body .header .main-nav,
  html body.projects-page-body .header .main-nav,
  html body.about-page-body .header .main-nav,
  html body.contact-page-body .header .main-nav{
    flex:0 1 960px !important;
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html body.home-page .header .main-nav a,
  html body.products-page-body .header .main-nav a,
  html body.projects-page-body .header .main-nav a,
  html body.about-page-body .header .main-nav a,
  html body.contact-page-body .header .main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
  html body .sticky-main-nav{
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    padding:10px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html body .sticky-main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
}

/* V119 DESKTOP ONLY FINAL PRIORITY: same specificity as previous V118 locks, but narrower */
@media (min-width:921px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  body:not(.home-page).products-page-body .header .main-nav,
  body:not(.home-page).projects-page-body .header .main-nav,
  body:not(.home-page).about-page-body .header .main-nav,
  body:not(.home-page).contact-page-body .header .main-nav{
    flex:0 1 960px !important;
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a,
  body:not(.home-page).products-page-body .header .main-nav a,
  body:not(.home-page).projects-page-body .header .main-nav a,
  body:not(.home-page).about-page-body .header .main-nav a,
  body:not(.home-page).contact-page-body .header .main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
  .sticky-main-nav{
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    padding:10px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  .sticky-main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
}

/* V119 DESKTOP ONLY HOME ALIGNMENT: keep original nav on its own centered row */
@media (min-width:921px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  body:not(.home-page).products-page-body .header .main-nav,
  body:not(.home-page).projects-page-body .header .main-nav,
  body:not(.home-page).about-page-body .header .main-nav,
  body:not(.home-page).contact-page-body .header .main-nav{
    order:99 !important;
    flex:0 0 100% !important;
    width:min(960px, calc(100% - 64px)) !important;
    max-width:960px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
  }
}

/* V119 DESKTOP ONLY INITIAL ROW BREAK: full row, compact centered nav content */
@media (min-width:921px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  body:not(.home-page).products-page-body .header .main-nav,
  body:not(.home-page).projects-page-body .header .main-nav,
  body:not(.home-page).about-page-body .header .main-nav,
  body:not(.home-page).contact-page-body .header .main-nav{
    flex:0 0 100% !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    justify-content:center !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    padding:10px 0 2px !important;
  }
}

/* V120 DESKTOP ONLY: make the two desktop nav banner rows a little narrower than V119.
   Keep V119 font size, link padding and text gap unchanged. Scope: desktop Home / Products / Projects / About / Contact only. */
@media (min-width:921px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  body:not(.home-page).products-page-body .header .main-nav,
  body:not(.home-page).projects-page-body .header .main-nav,
  body:not(.home-page).about-page-body .header .main-nav,
  body:not(.home-page).contact-page-body .header .main-nav{
    order:99 !important;
    flex:0 0 auto !important;
    width:min(840px, calc(100% - 96px)) !important;
    max-width:840px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a,
  body:not(.home-page).products-page-body .header .main-nav a,
  body:not(.home-page).projects-page-body .header .main-nav a,
  body:not(.home-page).about-page-body .header .main-nav a,
  body:not(.home-page).contact-page-body .header .main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
  .sticky-main-nav{
    width:min(840px, calc(100% - 96px)) !important;
    max-width:840px !important;
    padding:10px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }
  .sticky-main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
}

/* V121 DESKTOP ONLY: further narrow the two desktop navigation banner rows.
   Keep the V120 font size, link padding and text spacing unchanged.
   Scope: desktop Home / Products / Projects / About / Contact only. */
@media (min-width:921px){
  html body.home-page .header .main-nav,
  html body.products-page-body .header .main-nav,
  html body.projects-page-body .header .main-nav,
  html body.about-page-body .header .main-nav,
  html body.contact-page-body .header .main-nav,
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav{
    order:99 !important;
    flex:0 0 auto !important;
    width:min(720px, calc(100% - 160px)) !important;
    max-width:720px !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 2px !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  html body.home-page .header .main-nav a,
  html body.products-page-body .header .main-nav a,
  html body.projects-page-body .header .main-nav a,
  html body.about-page-body .header .main-nav a,
  html body.contact-page-body .header .main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }

  html body .sticky-nav-wrap .sticky-main-nav,
  html body.home-page .sticky-main-nav,
  html body.products-page-body .sticky-main-nav,
  html body.projects-page-body .sticky-main-nav,
  html body.about-page-body .sticky-main-nav,
  html body.contact-page-body .sticky-main-nav{
    flex:0 0 auto !important;
    width:min(720px, calc(100% - 160px)) !important;
    max-width:720px !important;
    min-width:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:10px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  html body .sticky-nav-wrap .sticky-main-nav a,
  html body.home-page .sticky-main-nav a,
  html body.products-page-body .sticky-main-nav a,
  html body.projects-page-body .sticky-main-nav a,
  html body.about-page-body .sticky-main-nav a,
  html body.contact-page-body .sticky-main-nav a{
    flex:0 0 auto !important;
    width:auto !important;
    max-width:none !important;
    min-width:0 !important;
    min-height:38px !important;
    padding:7px 10px !important;
    font-size:inherit !important;
  }
}

/* V122 DESKTOP ONLY: narrow ONLY the scrolled sticky navigation banner row.
   Scope: desktop Home / Products / Projects / About / Contact.
   Do not change the original top navigation row, font size, link padding, or text gap. */
@media (min-width:921px){
  html body.home-page .sticky-nav-wrap,
  html body.products-page-body .sticky-nav-wrap,
  html body.projects-page-body .sticky-nav-wrap,
  html body.about-page-body .sticky-nav-wrap,
  html body.contact-page-body .sticky-nav-wrap{
    left:50% !important;
    right:auto !important;
    width:min(720px, calc(100% - 160px)) !important;
    max-width:720px !important;
    transform:translate(-50%, -110%) !important;
    border-left:1px solid rgba(15,23,42,.10) !important;
    border-right:1px solid rgba(15,23,42,.10) !important;
    border-radius:0 0 18px 18px !important;
    overflow:visible !important;
  }
  html body.home-page .sticky-nav-wrap.is-active,
  html body.products-page-body .sticky-nav-wrap.is-active,
  html body.projects-page-body .sticky-nav-wrap.is-active,
  html body.about-page-body .sticky-nav-wrap.is-active,
  html body.contact-page-body .sticky-nav-wrap.is-active,
  html.nav-clone-active body.home-page .sticky-nav-wrap.is-active,
  html.nav-clone-active body.products-page-body .sticky-nav-wrap.is-active,
  html.nav-clone-active body.projects-page-body .sticky-nav-wrap.is-active,
  html.nav-clone-active body.about-page-body .sticky-nav-wrap.is-active,
  html.nav-clone-active body.contact-page-body .sticky-nav-wrap.is-active{
    transform:translate(-50%, 0) !important;
  }
  html body.home-page .sticky-nav-wrap .sticky-main-nav,
  html body.products-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.projects-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.about-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.contact-page-body .sticky-nav-wrap .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
    gap:clamp(28px, 3vw, 42px) !important;
    font-size:20px !important;
    padding:10px 0 !important;
  }
}

/* V122 verification correction: keep sticky banner centered without relying on translateX,
   because older sticky active rules reset transform for the scrolled clone. Desktop sticky row only. */
@media (min-width:921px){
  html body.home-page .sticky-nav-wrap,
  html body.products-page-body .sticky-nav-wrap,
  html body.projects-page-body .sticky-nav-wrap,
  html body.about-page-body .sticky-nav-wrap,
  html body.contact-page-body .sticky-nav-wrap{
    width:720px !important;
    max-width:720px !important;
    left:calc(50% - 360px) !important;
    right:auto !important;
  }
}

/* V123 DESKTOP ONLY: make ONLY the scrolled sticky navigation banner more compact.
   Scope: desktop Home / Products / Projects / About / Contact.
   Changes: sticky font and vertical height reduced; sticky banner width reduced.
   Do not change the original top navigation row or any other site content. */
@media (min-width:921px){
  html body.home-page .sticky-nav-wrap,
  html body.products-page-body .sticky-nav-wrap,
  html body.projects-page-body .sticky-nav-wrap,
  html body.about-page-body .sticky-nav-wrap,
  html body.contact-page-body .sticky-nav-wrap{
    width:640px !important;
    max-width:640px !important;
    left:calc(50% - 320px) !important;
    right:auto !important;
    border-radius:0 0 14px 14px !important;
  }
  html body.home-page .sticky-nav-wrap .sticky-main-nav,
  html body.products-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.projects-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.about-page-body .sticky-nav-wrap .sticky-main-nav,
  html body.contact-page-body .sticky-nav-wrap .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
    font-size:18px !important;
    padding:6px 0 !important;
    gap:clamp(28px, 3vw, 42px) !important;
    align-items:center !important;
  }
  html body.home-page .sticky-nav-wrap .sticky-main-nav a,
  html body.products-page-body .sticky-nav-wrap .sticky-main-nav a,
  html body.projects-page-body .sticky-nav-wrap .sticky-main-nav a,
  html body.about-page-body .sticky-nav-wrap .sticky-main-nav a,
  html body.contact-page-body .sticky-nav-wrap .sticky-main-nav a{
    min-height:30px !important;
    padding:4px 8px !important;
    font-size:inherit !important;
    line-height:1.15 !important;
  }
}

/* V124 DESKTOP ONLY: reduce vertical height of ONLY the original top navigation banner.
   Scope: desktop Home / Products / Projects / About / Contact.
   Do not change the scrolled sticky navigation banner or any other site content. */
@media (min-width:921px){
  html body.home-page .header .main-nav,
  html body.products-page-body .header .main-nav,
  html body.projects-page-body .header .main-nav,
  html body.about-page-body .header .main-nav,
  html body.contact-page-body .header .main-nav{
    padding:4px 0 0 !important;
    align-items:center !important;
    font-size:20px !important;
    gap:clamp(28px, 3vw, 42px) !important;
  }
  html body.home-page .header .main-nav a,
  html body.products-page-body .header .main-nav a,
  html body.projects-page-body .header .main-nav a,
  html body.about-page-body .header .main-nav a,
  html body.contact-page-body .header .main-nav a{
    min-height:30px !important;
    padding:4px 8px !important;
    font-size:inherit !important;
    line-height:1.15 !important;
  }
}

/* V124 correction: match and override the earlier high-specificity original top nav rules. */
@media (min-width:921px){
  html:not(.nav-clone-active) body.home-page .header .main-nav,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav,
  html body.home-page .header .main-nav,
  html body.products-page-body .header .main-nav,
  html body.projects-page-body .header .main-nav,
  html body.about-page-body .header .main-nav,
  html body.contact-page-body .header .main-nav{
    padding:4px 0 0 !important;
    align-items:center !important;
    font-size:20px !important;
    gap:clamp(28px, 3vw, 42px) !important;
  }
  html:not(.nav-clone-active) body.home-page .header .main-nav a,
  html:not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html:not(.nav-clone-active) body.contact-page-body .header .main-nav a,
  html body.home-page .header .main-nav a,
  html body.products-page-body .header .main-nav a,
  html body.projects-page-body .header .main-nav a,
  html body.about-page-body .header .main-nav a,
  html body.contact-page-body .header .main-nav a{
    min-height:30px !important;
    padding:4px 8px !important;
    font-size:inherit !important;
    line-height:1.15 !important;
  }
}

/* V125 MOBILE PHONE ONLY: reduce vertical height of the original top nav banner
   and the scrolled sticky nav banner on Home / Products / Projects / About / Contact.
   Scope lock: mobile-view-mode only; desktop-view-mode is intentionally excluded. */
@media(max-width:920px){
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.home-page .header .main-nav,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.products-page-body .header .main-nav,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.projects-page-body .header .main-nav,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.about-page-body .header .main-nav,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.contact-page-body .header .main-nav{
    padding-top:4px !important;
    padding-bottom:4px !important;
    min-height:0 !important;
  }

  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.home-page .header .main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.products-page-body .header .main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.projects-page-body .header .main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.about-page-body .header .main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode):not(.nav-clone-active) body.contact-page-body .header .main-nav a{
    min-height:32px !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
  }

  html.mobile-view-mode:not(.desktop-view-mode) body.home-page .sticky-nav-wrap .sticky-main-nav,
  html.mobile-view-mode:not(.desktop-view-mode) body.products-page-body .sticky-nav-wrap .sticky-main-nav,
  html.mobile-view-mode:not(.desktop-view-mode) body.projects-page-body .sticky-nav-wrap .sticky-main-nav,
  html.mobile-view-mode:not(.desktop-view-mode) body.about-page-body .sticky-nav-wrap .sticky-main-nav,
  html.mobile-view-mode:not(.desktop-view-mode) body.contact-page-body .sticky-nav-wrap .sticky-main-nav{
    padding-top:4px !important;
    padding-bottom:4px !important;
    min-height:0 !important;
  }

  html.mobile-view-mode:not(.desktop-view-mode) body.home-page .sticky-nav-wrap .sticky-main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode) body.products-page-body .sticky-nav-wrap .sticky-main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode) body.projects-page-body .sticky-nav-wrap .sticky-main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode) body.about-page-body .sticky-nav-wrap .sticky-main-nav a,
  html.mobile-view-mode:not(.desktop-view-mode) body.contact-page-body .sticky-nav-wrap .sticky-main-nav a{
    min-height:28px !important;
    padding-top:3px !important;
    padding-bottom:3px !important;
  }
}

/* V126 DESKTOP SPANISH ONLY: fix the scrolled sticky navigation banner width.
   Scope: Spanish desktop Home / Products / Projects / About / Contact, only after the fixed clone appears. */
@media (min-width:921px){
  html[lang="es"] body.home-page .sticky-nav-wrap.is-active,
  html[lang="es"] body.products-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.projects-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.about-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.contact-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.home-page .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.products-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.projects-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.about-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.contact-page-body .sticky-nav-wrap.is-active{
    width:760px !important;
    max-width:760px !important;
    left:calc(50% - 380px) !important;
    right:auto !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  html[lang="es"] body.home-page .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"] body.products-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"] body.projects-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"] body.about-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"] body.contact-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"].nav-clone-active body.home-page .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"].nav-clone-active body.products-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"].nav-clone-active body.projects-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"].nav-clone-active body.about-page-body .sticky-nav-wrap.is-active .sticky-main-nav,
  html[lang="es"].nav-clone-active body.contact-page-body .sticky-nav-wrap.is-active .sticky-main-nav{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    padding:6px 0 !important;
    gap:clamp(26px, 2.35vw, 36px) !important;
    font-size:18px !important;
    justify-content:center !important;
    overflow:visible !important;
  }

  html[lang="es"] body.home-page .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"] body.products-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"] body.projects-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"] body.about-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"] body.contact-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"].nav-clone-active body.home-page .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"].nav-clone-active body.products-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"].nav-clone-active body.projects-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"].nav-clone-active body.about-page-body .sticky-nav-wrap.is-active .sticky-main-nav a,
  html[lang="es"].nav-clone-active body.contact-page-body .sticky-nav-wrap.is-active .sticky-main-nav a{
    min-height:30px !important;
    padding:4px 8px !important;
    font-size:inherit !important;
    line-height:1.15 !important;
    white-space:nowrap !important;
  }
}

/* V127: Home mobile View Detail product specifications use the same stacked format as mobile Products View Detail. */
@media (max-width:800px){
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    margin:16px 0 0 !important;
    padding:14px !important;
    border:1px solid #e5e7eb !important;
    border-radius:16px !important;
    background:#fff !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs,
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs tbody,
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs tr,
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs th,
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs td{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    white-space:normal !important;
    overflow:visible !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs{
    border-collapse:separate !important;
    border-spacing:0 !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs tr{
    display:block !important;
    margin:0 0 8px !important;
    border:1px solid #e5e7eb !important;
    border-radius:12px !important;
    overflow:hidden !important;
    background:#fff !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs th,
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs td{
    display:block !important;
    border:0 !important;
    padding:9px 10px !important;
    text-align:left !important;
    line-height:1.55 !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs th{
    background:#f8fafc !important;
    color:#334155 !important;
    font-size:12px !important;
    font-weight:900 !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs td{
    color:#0f172a !important;
    font-size:14px !important;
  }
  html.mobile-view-mode .product-detail-modal:not(.hide) .detail-spec-section-wrap .detail-specs .detail-spec-section th{
    background:#fff7ed !important;
    color:#c2410c !important;
    text-transform:uppercase !important;
    letter-spacing:.02em !important;
  }
}

/* v128: mobile Home product-list video uses the same clean playback feel as Home View Detail.
   Scope: only Home #productGrid on mobile / touch browsers. The play button is visible before play,
   disappears while the video is playing, and returns after pause/end. */
@media (hover:none), (pointer:coarse), (max-width:900px){
  #productGrid .media.product-video-playing .product-video-toggle{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translate(-50%,-50%) scale(.88) !important;
  }
  #productGrid .media.product-video-playing .product-video-icon-play{display:block !important;}
  #productGrid .media.product-video-playing .product-video-icon-pause{display:none !important;}
  #productGrid .media.product-video-paused .product-video-toggle,
  #productGrid .media:not(.product-video-playing) .product-video-toggle{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}

/* V130 DESKTOP SPANISH ONLY: moderate correction for the scrolled sticky navigation banner side blank space.
   Scope: Spanish desktop Home / Products / Projects / About / Contact only, only after the sticky clone appears.
   This only shortens the left/right empty edge area; font size, height, link padding and page content remain unchanged. */
@media (min-width:921px){
  html[lang="es"] body.home-page .sticky-nav-wrap.is-active,
  html[lang="es"] body.products-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.projects-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.about-page-body .sticky-nav-wrap.is-active,
  html[lang="es"] body.contact-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.home-page .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.products-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.projects-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.about-page-body .sticky-nav-wrap.is-active,
  html[lang="es"].nav-clone-active body.contact-page-body .sticky-nav-wrap.is-active{
    width:700px !important;
    max-width:700px !important;
    left:calc(50% - 350px) !important;
    right:auto !important;
  }
}

/* V131 DESKTOP HOME ONLY: hide the homepage product-list video play button after playback starts.
   Scope: desktop Home #productGrid only. The button returns automatically after pause/end. */
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  body.home-page #productGrid .media.product-video-playing .product-video-toggle{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translate(-50%,-50%) scale(.88) !important;
  }
  body.home-page #productGrid .media.product-video-playing .product-video-icon-play{display:block !important;}
  body.home-page #productGrid .media.product-video-playing .product-video-icon-pause{display:none !important;}
  body.home-page #productGrid .media.product-video-paused .product-video-toggle,
  body.home-page #productGrid .media:not(.product-video-playing) .product-video-toggle{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}


/* V133 DESKTOP HOME VIEW DETAIL ONLY: product detail video center play button.
   Scope: desktop Home product detail modal only. The button hides during playback and returns after pause/end. */
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .detail-main.home-detail-video-control{
    position:relative !important;
    cursor:pointer !important;
  }
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .detail-main.home-detail-video-control video{
    cursor:pointer !important;
  }
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .home-detail-video-toggle{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
    width:58px !important;
    height:58px !important;
    border:0 !important;
    border-radius:999px !important;
    background:rgba(15,23,42,.78) !important;
    color:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:8 !important;
    cursor:pointer !important;
    box-shadow:0 12px 28px rgba(15,23,42,.32) !important;
    -webkit-tap-highlight-color:transparent !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:opacity .16s ease, transform .16s ease, visibility .16s ease !important;
  }
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .home-detail-video-toggle span{
    display:block !important;
    font-size:27px !important;
    line-height:1 !important;
    margin-left:4px !important;
  }
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .detail-main.home-detail-video-control.detail-video-playing .home-detail-video-toggle{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translate(-50%,-50%) scale(.88) !important;
  }
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .detail-main.home-detail-video-control.detail-video-paused .home-detail-video-toggle,
  body.home-page #productDetailModal.home-product-detail-modal:not(.hide) .detail-main.home-detail-video-control:not(.detail-video-playing) .home-detail-video-toggle{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}


/* V134 DESKTOP PRODUCTS PAGE VIEW DETAIL ONLY: product detail video center play button.
   Scope: desktop Products page detail modal only. The button hides during playback and returns after pause/end. */
@media (hover:hover) and (pointer:fine) and (min-width:901px){
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .detail-main.products-detail-video-control{
    position:relative !important;
    cursor:pointer !important;
  }
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .detail-main.products-detail-video-control video{
    cursor:pointer !important;
  }
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .products-detail-video-toggle{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-50%,-50%) !important;
    width:58px !important;
    height:58px !important;
    border:0 !important;
    border-radius:999px !important;
    background:rgba(15,23,42,.78) !important;
    color:#fff !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:8 !important;
    cursor:pointer !important;
    box-shadow:0 12px 28px rgba(15,23,42,.32) !important;
    -webkit-tap-highlight-color:transparent !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transition:opacity .16s ease, transform .16s ease, visibility .16s ease !important;
  }
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .products-detail-video-toggle span{
    display:block !important;
    font-size:27px !important;
    line-height:1 !important;
    margin-left:4px !important;
  }
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .detail-main.products-detail-video-control.detail-video-playing .products-detail-video-toggle{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translate(-50%,-50%) scale(.88) !important;
  }
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .detail-main.products-detail-video-control.detail-video-paused .products-detail-video-toggle,
  body.products-page-body #productsDetailModal.products-detail-modal:not(.hide) .detail-main.products-detail-video-control:not(.detail-video-playing) .products-detail-video-toggle{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
}


/* V137 home rotating banner visibility + speed fix
   Scope: homepage application rotating banner only.
   Rule: rotate only while the banner is visible on screen; pause when it leaves the screen.
   Phone desktop version uses the desktop horizontal banner rules to avoid blank areas during rotation. */
body.home-page .home-application-track{
  animation-duration: 64s !important;
  animation-play-state: paused !important;
}

body.home-page .home-application-carousel.is-visible-on-screen:not(.mobile-animation-paused) .home-application-track{
  animation-play-state: running !important;
}

body.home-page .home-application-carousel.mobile-animation-paused .home-application-track,
body.home-page .home-application-carousel:not(.is-visible-on-screen) .home-application-track{
  animation-play-state: paused !important;
}

@media (max-width: 900px){
  body.home-page .home-application-track{
    animation-duration: 56s !important;
  }
}

/* Phone + Desktop Version: keep the homepage banner in desktop horizontal mode.
   This prevents the rotating banner from showing one image on the left with a large blank area on the right. */
@media (max-width: 1200px){
  html.desktop-view-mode body.home-page .home-application-gallery{
    width: 1180px !important;
    min-width: 1180px !important;
    max-width: none !important;
    overflow: hidden !important;
  }

  html.desktop-view-mode body.home-page .home-application-gallery .container{
    width: 1180px !important;
    max-width: none !important;
    min-width: 1180px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  html.desktop-view-mode body.home-page .home-application-carousel{
    --gallery-gap: 24px !important;
    width: 1180px !important;
    min-width: 1180px !important;
    max-width: none !important;
    margin-left: 0 !important;
    transform: none !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
  }

  html.desktop-view-mode body.home-page .home-application-track{
    flex-direction: row !important;
    align-items: stretch !important;
    gap: var(--gallery-gap) !important;
    width: max-content !important;
    height: auto !important;
    animation-name: homeApplicationsScrollX !important;
    animation-duration: 72s !important;
  }

  html.desktop-view-mode body.home-page .home-application-slide{
    flex: 0 0 620px !important;
    width: 620px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    display: block !important;
    overflow: hidden !important;
    border-radius: 16px !important;
  }

  html.desktop-view-mode body.home-page .home-application-slide img{
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
    border-radius: 16px !important;
  }
}

/* V138 Project cases update: application-based case cards, no country labels. */
.projects-case .case-quote-link{margin-top:16px}
.projects-case-grid{align-items:stretch}
.projects-case{display:flex;flex-direction:column}
.projects-case>div{display:flex;flex-direction:column;flex:1}
.projects-case .case-quote-link{margin-top:auto;align-self:flex-start}
@media(max-width:1100px){.projects-case{display:grid;grid-template-columns:360px minmax(0,1fr)}.projects-case>div{min-height:100%}}
@media(max-width:680px){.projects-case{display:block}.projects-case .case-quote-link{align-self:stretch}}
/* V139 Project case image fix: show the complete case image inside the frame, no cropping. */
.projects-case img{object-fit:contain;object-position:center center;background:#f4f8ff}

/* V141 Projects mobile/phone-desktop case quote button visibility fix.
   Scope: Projects case cards only. Keep every case CTA visible in mobile version and phone desktop version. */
body.projects-page-body .projects-case .case-quote-link,
body.projects-page-body .projects-case a[data-case-quote-link]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  visibility:visible !important;
  opacity:1 !important;
  pointer-events:auto !important;
  color:#fff !important;
  background:#0056D6 !important;
  text-decoration:none !important;
  font-weight:900 !important;
  border-radius:999px !important;
  min-height:42px !important;
  line-height:1.15 !important;
  white-space:normal !important;
  text-align:center !important;
  box-sizing:border-box !important;
  position:relative !important;
  z-index:5 !important;
  flex:0 0 auto !important;
  transform:none !important;
}

@media(max-width:1100px){
  body.projects-page-body .projects-case-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    align-items:stretch !important;
  }
  body.projects-page-body .projects-case{
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
  body.projects-page-body .projects-case > div{
    display:flex !important;
    flex-direction:column !important;
    flex:0 0 auto !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
  body.projects-page-body .projects-case p{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
  body.projects-page-body .projects-case .case-quote-link,
  body.projects-page-body .projects-case a[data-case-quote-link]{
    margin-top:16px !important;
    align-self:flex-start !important;
  }
}

@media(max-width:680px){
  body.projects-page-body .projects-case-grid{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }
  body.projects-page-body .projects-case{
    border-radius:18px !important;
  }
  body.projects-page-body .projects-case img{
    width:100% !important;
    height:auto !important;
    aspect-ratio:16/10 !important;
    object-fit:contain !important;
    display:block !important;
  }
  body.projects-page-body .projects-case > div{
    padding:18px !important;
  }
  body.projects-page-body .projects-case .case-quote-link,
  body.projects-page-body .projects-case a[data-case-quote-link]{
    width:100% !important;
    max-width:100% !important;
    min-height:44px !important;
    padding:11px 14px !important;
    font-size:14px !important;
    margin-top:16px !important;
    align-self:stretch !important;
  }
}


/* V142 Projects real case thumbnail gallery: show additional thumbnail images inside every case card. */
body.projects-page-body .projects-case-gallery{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:16px 16px 0;
}
body.projects-page-body .projects-case-gallery > img{
  width:100%;
  aspect-ratio:16/10;
  object-fit:contain;
  object-position:center center;
  display:block;
  border-radius:14px;
  background:#f4f8ff;
  border:1px solid #e5edf8;
}
body.projects-page-body .projects-case-thumbs{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
}
body.projects-page-body .projects-case-thumb{
  appearance:none;
  border:2px solid transparent;
  padding:0;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  overflow:hidden;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease;
  box-shadow:0 2px 10px rgba(15,23,42,.08);
}
body.projects-page-body .projects-case-thumb:hover{
  transform:translateY(-1px);
  border-color:#8bb7ff;
}
body.projects-page-body .projects-case-thumb.is-active{
  border-color:#0056D6;
  box-shadow:0 0 0 3px rgba(0,86,214,.12);
}
body.projects-page-body .projects-case-thumb img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  display:block;
  border-radius:8px;
  background:#eef4ff;
}
body.projects-page-body .projects-case > div{
  padding-top:16px;
}
@media(max-width:1100px){
  body.projects-page-body .projects-case-gallery{
    padding:16px;
    padding-bottom:0;
  }
}
@media(max-width:680px){
  body.projects-page-body .projects-case-gallery{
    padding:14px 14px 0;
    gap:8px;
  }
  body.projects-page-body .projects-case-thumbs{
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding-bottom:2px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
  }
  body.projects-page-body .projects-case-thumbs::-webkit-scrollbar{
    height:6px;
  }
  body.projects-page-body .projects-case-thumbs::-webkit-scrollbar-thumb{
    background:#c7d6ee;
    border-radius:999px;
  }
  body.projects-page-body .projects-case-thumb{
    flex:0 0 64px;
  }
  body.projects-page-body .projects-case-thumb img{
    aspect-ratio:1/1;
  }
  body.projects-page-body .projects-case > div{
    padding-top:14px !important;
  }
}


/* V143 Premium Projects gallery style:
   Desktop/phone-desktop: main image + vertical thumbnail column on the right.
   Mobile: thumbnails stay horizontal under the main image for better touch use. */
body.projects-page-body .projects-case{
  border:1px solid rgba(0,86,214,.10);
  box-shadow:0 18px 46px rgba(15,23,42,.09);
}

body.projects-page-body .projects-case-gallery{
  display:grid;
  grid-template-columns:minmax(0,1fr) 64px;
  align-items:stretch;
  gap:10px;
  padding:16px 16px 0;
}

body.projects-page-body .projects-case-gallery > img{
  width:100%;
  height:100%;
  min-height:245px;
  aspect-ratio:16/10;
  object-fit:contain;
  object-position:center center;
  display:block;
  border-radius:16px;
  background:linear-gradient(180deg,#f8fbff 0%,#eef5ff 100%);
  border:1px solid #e3edf9;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
}

body.projects-page-body .projects-case-thumbs{
  display:grid;
  grid-template-columns:1fr;
  grid-template-rows:repeat(5,1fr);
  gap:7px;
  min-width:0;
}

body.projects-page-body .projects-case-thumb{
  appearance:none;
  border:2px solid rgba(148,163,184,.28);
  padding:0;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  overflow:hidden;
  transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  box-shadow:0 3px 12px rgba(15,23,42,.10);
  opacity:.82;
}

body.projects-page-body .projects-case-thumb:hover{
  transform:translateX(-1px);
  border-color:#6aa7ff;
  opacity:1;
}

body.projects-page-body .projects-case-thumb.is-active{
  border-color:#0056D6;
  opacity:1;
  box-shadow:0 0 0 3px rgba(0,86,214,.14), 0 5px 16px rgba(15,23,42,.12);
}

body.projects-page-body .projects-case-thumb img{
  width:100%;
  height:100%;
  aspect-ratio:auto;
  object-fit:cover;
  display:block;
  border-radius:8px;
  background:#eef4ff;
}

body.projects-page-body .projects-case > div{
  padding-top:18px;
}

@media(max-width:1100px){
  body.projects-page-body .projects-case-gallery{
    grid-template-columns:minmax(0,1fr) 74px;
    padding:16px;
    padding-bottom:0;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:260px;
  }
}

@media(max-width:680px){
  body.projects-page-body .projects-case-gallery{
    display:flex;
    flex-direction:column;
    padding:14px 14px 0;
    gap:8px;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:0;
    height:auto;
    aspect-ratio:16/10;
    border-radius:14px;
  }
  body.projects-page-body .projects-case-thumbs{
    display:flex;
    grid-template-columns:none;
    grid-template-rows:none;
    gap:8px;
    overflow-x:auto;
    padding:2px 1px 4px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
  }
  body.projects-page-body .projects-case-thumbs::-webkit-scrollbar{
    height:6px;
  }
  body.projects-page-body .projects-case-thumbs::-webkit-scrollbar-thumb{
    background:#c7d6ee;
    border-radius:999px;
  }
  body.projects-page-body .projects-case-thumb{
    flex:0 0 64px;
    height:64px;
  }
  body.projects-page-body .projects-case-thumb:hover{
    transform:none;
  }
  body.projects-page-body .projects-case-thumb img{
    aspect-ratio:1/1;
  }
}


/* V144 Projects premium gallery spacing fix:
   Enlarge side thumbnails and remove excessive empty space around the thumbnail column. */
body.projects-page-body .projects-case-gallery{
  grid-template-columns:minmax(0,1fr) 86px !important;
  gap:8px !important;
  padding:14px 14px 0 !important;
  align-items:stretch !important;
}

body.projects-page-body .projects-case-gallery > img{
  min-height:255px !important;
  border-radius:15px !important;
}

body.projects-page-body .projects-case-thumbs{
  width:86px !important;
  grid-template-columns:1fr !important;
  grid-template-rows:repeat(5,minmax(0,1fr)) !important;
  gap:6px !important;
  align-self:stretch !important;
}

body.projects-page-body .projects-case-thumb{
  width:86px !important;
  min-width:86px !important;
  height:auto !important;
  min-height:44px !important;
  border-radius:11px !important;
}

body.projects-page-body .projects-case-thumb img{
  width:100% !important;
  height:100% !important;
  min-height:44px !important;
  object-fit:cover !important;
  border-radius:9px !important;
}

body.projects-page-body .projects-case-thumb:hover{
  transform:translateY(-1px) !important;
}

@media(max-width:1100px) and (min-width:681px){
  body.projects-page-body .projects-case-gallery{
    grid-template-columns:minmax(0,1fr) 96px !important;
    gap:8px !important;
    padding:14px 14px 0 !important;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:280px !important;
  }
  body.projects-page-body .projects-case-thumbs{
    width:96px !important;
    gap:7px !important;
  }
  body.projects-page-body .projects-case-thumb{
    width:96px !important;
    min-width:96px !important;
    min-height:50px !important;
  }
  body.projects-page-body .projects-case-thumb img{
    min-height:50px !important;
  }
}

@media(max-width:680px){
  body.projects-page-body .projects-case-gallery{
    display:flex !important;
    flex-direction:column !important;
    padding:14px 14px 0 !important;
    gap:8px !important;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:0 !important;
    height:auto !important;
    aspect-ratio:16/10 !important;
  }
  body.projects-page-body .projects-case-thumbs{
    width:100% !important;
    display:flex !important;
    gap:8px !important;
    overflow-x:auto !important;
  }
  body.projects-page-body .projects-case-thumb{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    height:72px !important;
    min-height:72px !important;
  }
  body.projects-page-body .projects-case-thumb img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    object-fit:cover !important;
  }
}


/* V145 Projects gallery proportion tuning:
   Make the main image area larger and the side thumbnail column smaller. */
body.projects-page-body .projects-case-gallery{
  grid-template-columns:minmax(0,1fr) 72px !important;
  gap:6px !important;
  padding:12px 12px 0 !important;
}
body.projects-page-body .projects-case-gallery > img{
  min-height:285px !important;
}
body.projects-page-body .projects-case-thumbs{
  width:72px !important;
  gap:5px !important;
}
body.projects-page-body .projects-case-thumb{
  width:72px !important;
  min-width:72px !important;
  min-height:40px !important;
  border-radius:10px !important;
}
body.projects-page-body .projects-case-thumb img{
  min-height:40px !important;
  border-radius:8px !important;
}

@media(max-width:1100px) and (min-width:681px){
  body.projects-page-body .projects-case-gallery{
    grid-template-columns:minmax(0,1fr) 80px !important;
    gap:6px !important;
    padding:12px 12px 0 !important;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:300px !important;
  }
  body.projects-page-body .projects-case-thumbs{
    width:80px !important;
    gap:6px !important;
  }
  body.projects-page-body .projects-case-thumb{
    width:80px !important;
    min-width:80px !important;
    min-height:46px !important;
  }
  body.projects-page-body .projects-case-thumb img{
    min-height:46px !important;
  }
}

@media(max-width:680px){
  body.projects-page-body .projects-case-gallery{
    display:flex !important;
    flex-direction:column !important;
    padding:14px 14px 0 !important;
    gap:8px !important;
  }
  body.projects-page-body .projects-case-gallery > img{
    min-height:0 !important;
    height:auto !important;
    aspect-ratio:16/10 !important;
  }
  body.projects-page-body .projects-case-thumbs{
    width:100% !important;
    display:flex !important;
    gap:8px !important;
    overflow-x:auto !important;
  }
  body.projects-page-body .projects-case-thumb{
    flex:0 0 72px !important;
    width:72px !important;
    min-width:72px !important;
    height:72px !important;
    min-height:72px !important;
  }
  body.projects-page-body .projects-case-thumb img{
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
  }
}

/* V146: homepage hero video playlist expanded to 8 videos and shown uncropped */
body.home-page .hero-media,
body.home-page .hero-video-gallery{
  background:#000 !important;
}
body.home-page .hero-media video,
body.home-page .hero-video-gallery video,
body.home-page #heroMainVideo{
  width:100% !important;
  height:420px !important;
  object-fit:contain !important;
  background:#000 !important;
}
@media(max-width:900px){
  body.home-page .hero-media video,
  body.home-page .hero-video-gallery video,
  body.home-page #heroMainVideo{
    height:auto !important;
    aspect-ratio:16 / 10 !important;
    object-fit:contain !important;
  }
}

@media(max-width:680px){
  html:not(.desktop-view-mode) body.home-page #heroMainVideo,
  html:not(.desktop-view-mode) body.home-page .hero-video-gallery video,
  html:not(.desktop-view-mode) body.home-page .hero-media video{
    object-fit:contain !important;
    background:#000 !important;
  }
}


/* V149 product media full-contain update */
#productGrid .card .media img,
#productGrid .card .media video,
#productGrid .card .thumb img,
#productGrid .card .thumb video,
#productDetailModal.product-detail-modal .detail-main img,
#productDetailModal.product-detail-modal .detail-main video,
#productDetailModal.product-detail-modal .detail-thumb img,
#productDetailModal.product-detail-modal .detail-thumb video,
.products-page-media img,
.products-page-media video,
#productsDetailModal.products-detail-modal .detail-main img,
#productsDetailModal.products-detail-modal .detail-main video,
#productsDetailModal.products-detail-modal .detail-thumb img,
#productsDetailModal.products-detail-modal .detail-thumb video {
  object-fit: contain !important;
  object-position: center center !important;
}
#productGrid .card .media,
#productGrid .card .thumb,
#productDetailModal.product-detail-modal .detail-main,
#productDetailModal.product-detail-modal .detail-thumb,
.products-page-media,
#productsDetailModal.products-detail-modal .detail-main,
#productsDetailModal.products-detail-modal .detail-thumb {
  background: #fff !important;
}
#productGrid .card .media video,
#productGrid .card .thumb video,
#productDetailModal.product-detail-modal .detail-main video,
#productDetailModal.product-detail-modal .detail-thumb video,
.products-page-media video,
#productsDetailModal.products-detail-modal .detail-main video,
#productsDetailModal.products-detail-modal .detail-thumb video {
  background: #000 !important;
}

/* V152 product image brightness update */
#productGrid .card .media img,
#productGrid .card .thumb img,
#productDetailModal.product-detail-modal .detail-main img,
#productDetailModal.product-detail-modal .detail-thumb img,
.products-page-media img,
#productsDetailModal.products-detail-modal .detail-main img,
#productsDetailModal.products-detail-modal .detail-thumb img {
  filter: brightness(1.22) contrast(1.06) saturate(1.08) !important;
}

/* V154 product image frame fill update */
#productGrid .card .media,
#productDetailModal.product-detail-modal .detail-main,
.products-page-media,
#productsDetailModal.products-detail-modal .detail-main {
  background: #07111b !important;
}

#productGrid .card .media img,
#productDetailModal.product-detail-modal .detail-main img,
.products-page-media img,
#productsDetailModal.products-detail-modal .detail-main img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: #07111b !important;
}

#productGrid .card .thumb img,
#productDetailModal.product-detail-modal .detail-thumb img,
#productsDetailModal.products-detail-modal .detail-thumb img {
  object-fit: cover !important;
  background: #07111b !important;
}

/* V155 product image full-display frame tuning */
#productGrid .card .media,
#productDetailModal.product-detail-modal .detail-main,
.products-page-media,
#productsDetailModal.products-detail-modal .detail-main {
  background: #07111b !important;
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
}

#productGrid .card .media img,
#productDetailModal.product-detail-modal .detail-main img,
.products-page-media img,
#productsDetailModal.products-detail-modal .detail-main img {
  object-fit: contain !important;
  object-position: center center !important;
  background: #07111b !important;
}

#productGrid .card .media:has(img[src*="p26-500x1000-indoor"]),
#productGrid .card .media:has(img[src*="p26-500x500-indoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p26-500x1000-indoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p26-500x500-indoor"]),
.products-page-media:has(img[src*="p26-500x1000-indoor"]),
.products-page-media:has(img[src*="p26-500x500-indoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p26-500x1000-indoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p26-500x500-indoor"]) {
  aspect-ratio: 4 / 5 !important;
}

#productGrid .card .media:has(img[src*="p29-500x1000-indoor"]),
#productGrid .card .media:has(img[src*="p391-500x500-outdoor"]),
#productGrid .card .media:has(img[src*="p5-960x960-outdoor"]),
#productGrid .card .media:has(img[src*="p5-960x960-fixed-iron-outdoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p29-500x1000-indoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p391-500x500-outdoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p5-960x960-outdoor"]),
#productDetailModal.product-detail-modal .detail-main:has(img[src*="p5-960x960-fixed-iron-outdoor"]),
.products-page-media:has(img[src*="p29-500x1000-indoor"]),
.products-page-media:has(img[src*="p391-500x500-outdoor"]),
.products-page-media:has(img[src*="p5-960x960-outdoor"]),
.products-page-media:has(img[src*="p5-960x960-fixed-iron-outdoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p29-500x1000-indoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p391-500x500-outdoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p5-960x960-outdoor"]),
#productsDetailModal.products-detail-modal .detail-main:has(img[src*="p5-960x960-fixed-iron-outdoor"]) {
  aspect-ratio: 1 / 1 !important;
}

#productGrid .card .media video,
#productDetailModal.product-detail-modal .detail-main video,
.products-page-media video,
#productsDetailModal.products-detail-modal .detail-main video {
  object-fit: contain !important;
}

/* V156 product list card frame alignment update */
body.home-page #productGrid .card .media,
body.home-page #productGrid .card .media.contain-media,
body.home-page #productGrid .card .media.contain-portrait,
body.home-page #productGrid .card .media.contain-balanced,
body.products-page-body .products-page-media {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: #07111b !important;
}

body.home-page #productGrid .card .media img,
body.products-page-body .products-page-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #07111b !important;
}

/* V157 product detail frame alignment: Home View Detail and Products View Detail match product cards. */
.product-detail-grid .detail-main,
.product-detail-grid .detail-main:has(img),
.product-detail-grid .detail-main:has(video),
.product-detail-modal .detail-main,
.product-detail-modal .detail-main:has(img),
.product-detail-modal .detail-main:has(video),
.products-detail-modal .detail-main,
.products-detail-modal .detail-main:has(img),
.products-detail-modal .detail-main:has(video),
#productDetailModal.product-detail-modal .detail-main,
#productDetailModal.product-detail-modal .detail-main:has(img),
#productDetailModal.product-detail-modal .detail-main:has(video),
#productsDetailModal.products-detail-modal .detail-main,
#productsDetailModal.products-detail-modal .detail-main:has(img),
#productsDetailModal.products-detail-modal .detail-main:has(video) {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: #07111b !important;
}

.product-detail-grid .detail-main img,
.product-detail-grid .detail-main video,
.product-detail-modal .detail-main img,
.product-detail-modal .detail-main video,
.products-detail-modal .detail-main img,
.products-detail-modal .detail-main video,
#productDetailModal.product-detail-modal .detail-main img,
#productDetailModal.product-detail-modal .detail-main video,
#productsDetailModal.products-detail-modal .detail-main img,
#productsDetailModal.products-detail-modal .detail-main video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

/* V158 final lock: every product detail/gallery main frame uses the same 4:3 card frame. */
html body .product-detail-modal .product-detail-grid .detail-main,
html body .products-detail-modal .product-detail-grid .detail-main,
html body #productDetailModal.product-detail-modal .product-detail-grid .detail-main,
html body #productsDetailModal.products-detail-modal .product-detail-grid .detail-main,
html body .product-detail-grid .detail-gallery .detail-main {
  aspect-ratio: 4 / 3 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  background: #07111b !important;
}

html body .product-detail-modal .product-detail-grid .detail-main img,
html body .product-detail-modal .product-detail-grid .detail-main video,
html body .products-detail-modal .product-detail-grid .detail-main img,
html body .products-detail-modal .product-detail-grid .detail-main video,
html body .product-detail-grid .detail-gallery .detail-main img,
html body .product-detail-grid .detail-gallery .detail-main video {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  background: #07111b !important;
}