/* Shared responsive safety layer for every public page. */
html{max-width:100%}
body{min-width:0!important;max-width:100%;overflow-x:visible!important}
img,svg,video,canvas,iframe{max-width:100%;height:auto}
input,textarea,select,button{max-width:100%;font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
.hd>*{min-width:0}
.logo img{width:auto;max-width:min(210px,100%);object-fit:contain}
.mobile-nav-toggle{display:none;width:44px;height:44px;flex:0 0 44px;border:1px solid rgba(255,255,255,.28);border-radius:7px;background:transparent;color:#fff;cursor:pointer;align-items:center;justify-content:center;position:relative}
.mobile-nav-toggle span,.mobile-nav-toggle::before,.mobile-nav-toggle::after{content:"";display:block;position:absolute;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .2s,opacity .2s}
.mobile-nav-toggle::before{transform:translateY(-6px)}
.mobile-nav-toggle::after{transform:translateY(6px)}
.mobile-nav-toggle[aria-expanded="true"] span{opacity:0}
.mobile-nav-toggle[aria-expanded="true"]::before{transform:rotate(45deg)}
.mobile-nav-toggle[aria-expanded="true"]::after{transform:rotate(-45deg)}
.mobile-nav{display:none;flex-basis:100%;width:100%;background:#0c2460;border-top:1px solid rgba(255,255,255,.12)}
.mobile-nav[hidden]{display:none!important}
.mobile-nav-inner{max-width:1240px;margin:auto;padding:10px 14px 16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.mobile-nav a{display:flex;align-items:center;min-height:44px;padding:10px 12px;border-radius:6px;color:rgba(255,255,255,.88);font-size:13px;font-weight:700;background:rgba(255,255,255,.06)}
.table-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;margin:16px 0;border-radius:8px}
.table-scroll>table{margin:0!important;min-width:600px}
.table-scroll:focus-visible{outline:3px solid #f47920;outline-offset:2px}
main,.main,.main-wrap,.page,.pb,.art-content,.card,.widget,.ac,.art-card,.art-hero,.partner-card,.cta-w,.menu-item,.compare-box,.compare-grid{min-width:0;max-width:100%}
.page,.pb,.main-wrap{grid-template-columns:minmax(0,1fr) minmax(0,320px)}
.art-content p,.art-content li,.art-title,.ac-title,.menu-desc,.pc-desc,.cta-desc{overflow-wrap:anywhere}
.art-content pre,.art-content code{white-space:pre-wrap;overflow-wrap:anywhere}

@media(max-width:900px){
  .hd{gap:12px}
  .hd-nav{display:none!important}
  .header-inner>nav,header>nav:not(.mobile-nav){display:none!important}
  .mobile-nav-toggle{display:flex}
  .mobile-nav{display:block}
  .sidebar{display:block}
  .page,.pb,.main-wrap{grid-template-columns:minmax(0,1fr)!important}
}

@media(max-width:640px){
  .hd{height:62px;padding-inline:14px}
  .logo{flex:1;overflow:hidden}
  .logo img{height:36px!important;max-width:156px}
  .hd-cta{min-height:40px;display:flex;align-items:center;padding:8px 10px!important;font-size:10.5px!important}
  .mobile-nav-toggle{width:40px;height:40px;flex-basis:40px}
  .hero,.about-hero,.blog-hero,.cat-hero{padding-block:38px 32px}
  .hi,.pb,.page,.wrap,.blog-grid,.arts,.bh-inner,.ch-in{padding-left:16px!important;padding-right:16px!important}
  .h-stats{gap:20px}
  .h-stat-num{font-size:26px}
  .h-pick{display:block}
  .art-content{padding:24px 18px}
  .art-content h2{font-size:18px;line-height:1.5;margin-top:28px}
  .art-content h3{font-size:15px;line-height:1.55}
  .art-content p{font-size:15px;line-height:1.9}
  .art-content li{font-size:14px;line-height:1.8}
  .art-content ul,.art-content ol{margin-left:18px}
  .art-hero{grid-template-columns:1fr}
  .art-grid,.articles,.arts,.criteria-grid,.menu-grid,.solution-grid,.pros-cons,.compare-grid{grid-template-columns:1fr!important}
  .ah-thumb{min-height:150px}
  .ac-thumb,.ac-th{height:150px}
  .bl-title,.rel-title{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
  .partner-card,.cta-big,.story-box{padding:24px 18px!important}
  .pc-btn,.cta-btn,.cta-big-btn{width:100%;min-height:48px;justify-content:center;text-align:center}
  .ft-nav{display:grid;grid-template-columns:1fr 1fr;gap:28px 20px;padding-inline:16px}
  .ft-bot{padding:20px 16px;flex-direction:column;align-items:flex-start;gap:10px;line-height:1.6}
  .bc{padding-inline:16px;overflow-x:auto;white-space:nowrap}
  .tbl-wrap{overflow-x:auto}
  .tbl-wrap table{min-width:600px}
  .jump-nav,.filter-bar,.cat-nav{max-width:100%;overflow-x:auto}
  .compare-header{flex-wrap:wrap;gap:8px}
  input,textarea,select{width:100%;font-size:16px!important}
  button,input[type="submit"],.btn,.cta-btn,.pc-btn,.cta-big-btn{min-height:44px}
}

@media(max-width:430px){
  .hd{gap:8px;padding-inline:10px}
  .logo img{height:32px!important;max-width:132px}
  .hd-cta{padding:7px 8px!important;font-size:9.5px!important}
  .mobile-nav-inner{grid-template-columns:1fr}
  .hero h1,.about-hero h1,.blog-hero h1,.cat-hero h1{font-size:clamp(22px,7vw,28px)!important;line-height:1.4}
  .h-lead{font-size:13.5px;margin-bottom:26px}
  .h-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
  .sh{align-items:flex-start;flex-wrap:wrap}
  .sh-more{margin-left:0}
  .art-content{padding:22px 16px}
  .art-head{margin-bottom:20px}
  .card{padding:20px 16px!important}
  .ft-nav{grid-template-columns:1fr}
  .ticker{height:32px}
}

@media(max-width:350px){
  .logo img{max-width:108px}
  .hd-cta{display:none}
  .mobile-nav-toggle{margin-left:auto}
  .hi,.pb,.page,.wrap,.blog-grid,.arts,.bh-inner,.ch-in{padding-left:12px!important;padding-right:12px!important}
  .art-content{padding:20px 14px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}