/* Responsive layout & image handling */
html{scroll-behavior:smooth;overflow-x:hidden}
body{overflow-x:hidden}
img{max-width:100%;height:auto}
.hero-card{display:flex;align-items:center;justify-content:center;min-width:0}
.hero-card img{height:auto;max-height:560px;width:100%;object-fit:contain;object-position:center}
.card img{aspect-ratio:16/10;height:auto;object-fit:cover;object-position:center}
.gallery{align-items:start}
.gallery img{height:auto;aspect-ratio:auto;object-fit:contain;background:#fff}
.article-content img{height:auto;max-height:none;object-fit:contain;background:#fff}
.responsive-image{width:100%;height:auto;display:block;object-fit:contain}

@media (max-width: 1100px){
  .container{width:min(94%,1120px)}
  .hero-grid{gap:28px}
  .main-nav{gap:12px}
  .main-nav a{font-size:14px}
}
@media (max-width: 850px){
  .site-header{position:sticky}
  .nav-wrap{min-height:68px}
  .brand img{width:50px;height:50px}
  .brand strong{font-size:15px}
  .hero-grid{grid-template-columns:1fr;gap:24px}
  .hero{padding:34px 0}
  .hero-card{padding:8px;border-radius:18px}
  .hero-card img{max-height:none}
  .section h2{font-size:30px}
  .article-content,.sidebar-box{padding:20px}
  .gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery img{width:100%;border-radius:14px}
}
@media (max-width: 560px){
  .container{width:calc(100% - 28px)}
  .nav-wrap{gap:10px}
  .brand{min-width:0}
  .brand span{min-width:0}
  .brand strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:205px}
  .main-nav{top:68px}
  .hero h1{font-size:clamp(30px,9vw,42px)}
  .hero p{font-size:16px}
  .hero-card{margin-top:2px}
  .hero-card img{width:100%;max-height:none}
  .section{padding:36px 0}
  .section h2{font-size:26px}
  .gallery{grid-template-columns:1fr}
  .gallery img{max-height:none}
  .article-content,.sidebar-box{padding:17px}
  .cta{padding:25px 20px}
  .footer{padding-top:35px}
  .whatsapp-float{right:14px;bottom:14px}
}
@media (max-width: 380px){
  .brand img{width:44px;height:44px}
  .brand strong{max-width:165px}
  .hero .btn{display:block;text-align:center;margin:8px 0;width:100%}
}