/* Mobile responsive fix: keep desktop unchanged, correct narrow viewport overflow. */
html{-webkit-text-size-adjust:100%;scroll-padding-top:80px}*,*::before,*::after{box-sizing:border-box}body{max-width:100%;overflow-x:hidden}img,svg,video,canvas,iframe{max-width:100%;height:auto}table{max-width:100%}
@media (max-width:1024px){
  header,.site-header,.topbar{padding-left:24px!important;padding-right:24px!important}
  .container,.research-container,.article-wrap,main>section>div,[style*="max-width:1200"],[style*="max-width: 1200"],[style*="max-width:1180"],[style*="max-width: 1180"],[style*="max-width:1120"],[style*="max-width: 1120"]{max-width:100%!important}
  .hero-grid,.home-geo-grid,.article-layout,[style*="grid-template-columns"]{grid-template-columns:1fr!important}
  [style*="width:1200px"],[style*="width: 1200px"],[style*="width:1180px"],[style*="width: 1180px"],[style*="width:1120px"],[style*="width: 1120px"]{width:100%!important}
}
@media (max-width:768px){
  body{min-width:0!important;font-size:15px;line-height:1.75;overflow-x:hidden!important}
  header,.site-header{height:auto!important;min-height:64px!important;padding:12px 16px!important;gap:12px!important;align-items:center!important;position:relative!important;z-index:20}
  header img,.site-header img,.logo img{max-height:38px!important;width:auto!important}
  header nav,.site-header nav,.nav,.navlinks{display:flex!important;gap:14px!important;overflow-x:auto!important;overflow-y:hidden!important;white-space:nowrap!important;max-width:100%!important;padding-bottom:2px!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  header nav::-webkit-scrollbar,.site-header nav::-webkit-scrollbar,.nav::-webkit-scrollbar,.navlinks::-webkit-scrollbar{display:none}
  header nav a,.site-header nav a,.nav a,.navlink{flex:0 0 auto!important;font-size:13px!important;line-height:1!important;padding:10px 0!important}
  header nav .btn,.site-header .btn,.nav .btn{padding:9px 12px!important;border-radius:6px!important}
  section{max-width:100%!important;overflow:hidden}
  .container,.research-container,.article-wrap,main>section>div,[style*="max-width"]{max-width:100%!important;width:100%!important}
  [style*="padding:96px"],[style*="padding: 96px"],[style*="padding:90px"],[style*="padding: 90px"],[style*="padding:80px"],[style*="padding: 80px"],[style*="padding:76px"],[style*="padding: 76px"]{padding:48px 18px!important}
  .hero,.research-hero,.product-geo-hero,.page-hero,.cases-hero,.about-hero{min-height:auto!important;padding:54px 18px!important;background-size:cover!important;background-position:center center!important}
  .research-hero{padding:44px 18px!important;background:#f7f8fa!important}
  .research-hero-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center right!important;opacity:.42!important}
  .research-hero-shade{background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.9) 45%,rgba(255,255,255,.5) 100%)!important}
  .hero-grid,.home-geo-grid,.article-layout,[style*="display:grid"],[style*="display: grid"]{display:grid!important;grid-template-columns:1fr!important;gap:20px!important}
  [style*="display:flex"],[style*="display: flex"]{max-width:100%!important}
  h1{font-size:clamp(28px,8vw,38px)!important;line-height:1.25!important;letter-spacing:0!important;word-break:normal!important;overflow-wrap:anywhere!important}
  h2{font-size:clamp(22px,6.6vw,30px)!important;line-height:1.35!important;letter-spacing:0!important;overflow-wrap:anywhere!important}
  h3{font-size:clamp(18px,5.2vw,24px)!important;line-height:1.45!important}
  p,li{font-size:15px!important;line-height:1.85!important;overflow-wrap:anywhere!important}
  .research-card,.list-item,[class*="card"],[style*="border-radius:16px"],[style*="border-radius: 16px"]{padding:22px 18px!important;min-width:0!important}
  .tabs,.filter-tabs,.platform-list,[class*="tag"],[class*="chip"]{max-width:100%!important;overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .tabs::-webkit-scrollbar,.filter-tabs::-webkit-scrollbar,.platform-list::-webkit-scrollbar{display:none}
  .tabs a,.filter-tabs a,.platform-chip,[class*="chip"]{flex:0 0 auto!important;white-space:nowrap!important}
  .article-wrap{padding:34px 16px 48px!important}
  .article-layout{display:block!important}
  .article-toc{position:relative!important;top:auto!important;width:100%!important;max-height:none!important;margin:0 0 18px!important;order:-1!important}
  .content,.article-content,.article-body{padding:24px 18px!important;font-size:16px!important;line-height:1.9!important;max-width:100%!important;overflow:hidden!important}
  .content img,.article-content img,.article-body img{width:100%!important;height:auto!important;margin:16px auto!important}
  .content table,.article-content table,.article-body table,table{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;white-space:nowrap!important;-webkit-overflow-scrolling:touch}
  .content th,.content td,th,td{white-space:normal!important;min-width:120px!important}
  footer{padding:34px 18px!important;display:block!important;text-align:left!important}
  footer>div,footer [style*="grid"],footer [style*="flex"]{max-width:100%!important;width:100%!important;margin-bottom:22px!important}
}
@media (max-width:430px){
  header,.site-header{padding-left:12px!important;padding-right:12px!important}
  header img,.site-header img,.logo img{max-height:34px!important}
  header nav a,.site-header nav a,.nav a,.navlink{font-size:12px!important}
  .hero,.research-hero,.product-geo-hero,.page-hero,.cases-hero,.about-hero{padding:42px 14px!important}
  .content,.article-content,.article-body{padding:22px 14px!important}
  .research-card,.list-item,[class*="card"]{padding:20px 15px!important}
}
@media (max-width:768px){
  header,.site-header{flex-wrap:wrap!important;justify-content:flex-start!important}
  header>a:first-child,header .logo,.site-header>a:first-child,.site-header .logo{display:flex!important;align-items:center!important;flex:0 0 auto!important;max-width:170px!important;min-width:0!important;order:1!important}
  header nav,.site-header nav,.nav,.navlinks{order:2!important;flex:1 0 100%!important;width:100%!important;min-width:0!important;margin-top:4px!important}
}
@media (max-width:430px){
  header>a:first-child,header .logo,.site-header>a:first-child,.site-header .logo{max-width:154px!important}
}
/* 2026-07-04: actual Sanhex pages use a fixed top-level nav instead of header. */
@media (max-width:768px){
  body > div[style*="overflow-x:hidden"] > nav,
  body > div[style*="overflow-x: hidden"] > nav,
  body > nav{
    height:auto!important;
    min-height:74px!important;
    padding:10px 14px 12px!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
  }
  body > div[style*="overflow-x:hidden"] > nav > a:first-child,
  body > div[style*="overflow-x: hidden"] > nav > a:first-child,
  body > nav > a:first-child{
    display:flex!important;
    align-items:center!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:170px!important;
    min-width:0!important;
    order:1!important;
  }
  body > div[style*="overflow-x:hidden"] > nav > a:first-child img,
  body > div[style*="overflow-x: hidden"] > nav > a:first-child img,
  body > nav > a:first-child img{
    display:block!important;
    height:34px!important;
    width:auto!important;
    max-width:156px!important;
    object-fit:contain!important;
  }
  body > div[style*="overflow-x:hidden"] > nav > div,
  body > div[style*="overflow-x: hidden"] > nav > div,
  body > nav > div{
    order:2!important;
    flex:1 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    padding:2px 0 0!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  body > div[style*="overflow-x:hidden"] > nav > div::-webkit-scrollbar,
  body > div[style*="overflow-x: hidden"] > nav > div::-webkit-scrollbar,
  body > nav > div::-webkit-scrollbar{display:none!important}
  body > div[style*="overflow-x:hidden"] > nav > div > a,
  body > div[style*="overflow-x: hidden"] > nav > div > a,
  body > nav > div > a{
    flex:0 0 auto!important;
    font-size:13px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  body > div[style*="overflow-x:hidden"] > nav + main,
  body > div[style*="overflow-x: hidden"] > nav + main,
  body > nav + main{padding-top:86px!important}
}
@media (max-width:430px){
  body > div[style*="overflow-x:hidden"] > nav,
  body > div[style*="overflow-x: hidden"] > nav,
  body > nav{padding-left:12px!important;padding-right:12px!important}
  body > div[style*="overflow-x:hidden"] > nav > a:first-child img,
  body > div[style*="overflow-x: hidden"] > nav > a:first-child img,
  body > nav > a:first-child img{height:32px!important;max-width:148px!important}
}
@media (max-width:768px){
  body > div[style*="overflow-x:hidden"] > nav + main,
  body > div[style*="overflow-x: hidden"] > nav + main,
  body > nav + main{padding-top:0!important}
}
@media (max-width:768px){
  .article-wrap > article > h1,
  .article-wrap h1{
    max-width:100%!important;
    font-size:clamp(25px,7vw,32px)!important;
    line-height:1.28!important;
    letter-spacing:0!important;
    word-break:break-word!important;
    overflow-wrap:anywhere!important;
  }
  .article-wrap .meta{flex-wrap:wrap!important;gap:8px 12px!important;font-size:13px!important}
  .article-wrap .summary{width:100%!important;max-width:100%!important;box-sizing:border-box!important;overflow-wrap:anywhere!important}
}