/* Mobile overrides v4: tighter header + hero, fix social icons overflow */
@media (max-width: 860px){
  .brand-inner{padding:10px 12px; gap:8px; flex-direction:column; align-items:flex-start;}
  .brand-left{display:flex; gap:10px; align-items:center; width:100%;}
  .brand-logo-img{height:64px !important;}
  .brand-text{max-width:calc(100% - 72px);}
  .brand-title{font-size:20px; line-height:1.05; letter-spacing:.2px; margin:0;}
  .brand-sub{font-size:12px;}
  .brand-handle{font-size:12px;}
  .social-icons{gap:8px; width:100%; align-items:center; flex-wrap:wrap; overflow:hidden;}
  .social-icons svg{display:inline-block; vertical-align:middle;}

  .container{padding:0 12px;}
  .hero{padding:8px 0 0;}
  .hero-title{font-size:22px; line-height:1.2; margin:8px 0;}
  .hero-date{font-size:12px; margin-bottom:6px;}
  .hero-sub{font-size:14px;}

  .card{padding:10px; margin:10px 0; border-radius:14px;}
}