/* Team TararBari - Mobile Responsive FIX V12
   Mobile/tablet presentation only. Desktop layout is intentionally preserved. */

*{box-sizing:border-box}
img{max-width:100%}

@media (max-width:900px){
  html,body{max-width:100%;overflow-x:hidden}

  .container{
    width:min(100% - 28px,var(--content-width))!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  /* Header / brand */
  .nav-inner{gap:10px!important;padding-left:0!important;padding-right:0!important}
  .brand{min-width:0!important;gap:10px!important;max-width:calc(100% - 64px)!important}
  .brand img{width:48px!important;height:48px!important;object-fit:contain!important;flex:0 0 48px!important}
  .brand>span{min-width:0!important;font-size:clamp(17px,5.2vw,24px)!important;line-height:1.05!important}
  .brand small{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:clamp(10px,3.1vw,14px)!important;line-height:1.2!important;margin-top:5px!important}
  .menu-btn{flex:0 0 52px!important;width:52px!important;height:52px!important;min-width:52px!important}

  /* Generic responsive grids */
  .grid,.grid-2,.grid-3,.grid-4,.project-grid,.achievement-grid,.stats-grid,.contact-grid,.footer-grid{
    grid-template-columns:1fr!important;
  }
  .dynamic-cols{grid-template-columns:1fr!important}

  section{overflow:visible!important}
  .card{min-width:0!important;max-width:100%!important}

  /* Page hero */
  .page-hero{padding-left:0!important;padding-right:0!important}
  .page-hero h1{font-size:clamp(34px,10vw,58px)!important;line-height:1.02!important;overflow-wrap:anywhere}
  .page-hero p{font-size:clamp(16px,4.6vw,23px)!important;line-height:1.55!important}
  .eyebrow{max-width:100%!important}

  /* Homepage hero */
  .block-hero .hero-grid{min-width:0!important}
  .block-hero .hero-grid>div:first-child{max-width:100%!important}
  .block-hero .hero-grid .block-title{overflow-wrap:normal!important;word-break:normal!important}
  .block-hero .hero-grid .actions{
    display:grid!important;
    grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    align-items:stretch!important;
  }
  .block-hero .hero-grid .actions .btn{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    padding-left:8px!important;
    padding-right:8px!important;
    white-space:nowrap!important;
    word-break:keep-all!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    font-size:clamp(8px,2.65vw,12px)!important;
    letter-spacing:0!important;
  }

  /* Project cards: show the COMPLETE uploaded photo, never crop it. */
  .entity-card>a:first-child{display:block!important;width:100%!important;background:#07111f!important}
  .entity-card .card-cover,
  .project-grid .card-cover,
  .news-card .card-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#07111f!important;
    border-radius:14px 14px 0 0!important;
  }
  .entity-card .card-body{padding:22px 18px 24px!important}
  .entity-card .card-body h3{font-size:clamp(28px,8vw,38px)!important;line-height:1.12!important;text-align:center!important}
  .entity-card .card-body .muted{font-size:clamp(16px,4.8vw,22px)!important;line-height:1.55!important}
  .entity-card .row-between{gap:10px!important;align-items:center!important}
  .entity-card .badge,.entity-card .status-dot{font-size:clamp(12px,3.4vw,16px)!important;white-space:nowrap!important}
  .entity-card .entity-meta{display:flex!important;flex-wrap:wrap!important;gap:14px!important}
  .entity-card .text-link{display:block!important;text-align:center!important;font-size:clamp(16px,4.5vw,20px)!important;margin-top:18px!important}

  /* Achievement / activity photos: complete image */
  .achievement-card .achievement-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    margin:0!important;
    background:#07111f!important;
  }

  /* About / generic cards: complete image */
  .box-image,.about-row-image,.image-panel img,.detail-cover{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#07111f!important;
  }
  .about-row{grid-template-columns:1fr!important;display:grid!important}
  .about-row-content{padding-left:0!important;padding-right:0!important}
  .about-row-content h2{font-size:clamp(27px,8vw,40px)!important;line-height:1.15!important}
  .about-row-content .rich-output{font-size:clamp(16px,4.7vw,21px)!important;line-height:1.7!important}

  /* Public gallery: complete photos and natural aspect ratio */
  .gallery-grid,.unified-gallery{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .gallery-item{overflow:hidden!important;margin:0!important}
  .gallery-item a{display:block!important;background:#07111f!important}
  .gallery-item img,
  .preview-gallery img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center center!important;
    background:#07111f!important;
  }
  .preview-gallery{display:grid!important;grid-template-columns:1fr!important;gap:14px!important}

  /* Team cards: do not cut member photos on mobile */
  .team-card .avatar{
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    object-fit:contain!important;
    object-position:center!important;
    border-radius:14px!important;
    background:#07111f!important;
  }

  /* Buttons globally: readable, no ugly two-line labels */
  .btn{
    max-width:100%!important;
    min-height:44px!important;
    line-height:1.15!important;
  }
  .center-actions{display:flex!important;justify-content:center!important;flex-wrap:wrap!important;gap:10px!important}
  .center-actions .btn{white-space:nowrap!important}

  /* Long text should stay inside the viewport */
  h1,h2,h3,p,.rich-output,.muted{max-width:100%!important}
  .rich-output,.muted,p{overflow-wrap:break-word}
}

@media (max-width:560px){
  .container{width:calc(100% - 24px)!important}

  .brand img{width:44px!important;height:44px!important;flex-basis:44px!important}
  .brand>span{font-size:clamp(17px,5vw,21px)!important}
  .brand small{font-size:clamp(10px,2.9vw,12px)!important}
  .menu-btn{width:48px!important;height:48px!important;min-width:48px!important;flex-basis:48px!important}

  .page-hero{padding-top:46px!important;padding-bottom:38px!important}
  .page-hero h1{font-size:clamp(32px,10vw,48px)!important}

  .block-hero .hero-grid .actions{gap:6px!important}
  .block-hero .hero-grid .actions .btn{
    min-height:32px!important;
    padding-left:5px!important;
    padding-right:5px!important;
    font-size:clamp(7.5px,2.55vw,10.5px)!important;
  }

  .card{border-radius:16px!important}
  .entity-card .card-body{padding:18px 15px 22px!important}
  .entity-card .card-body h3{font-size:clamp(25px,8vw,34px)!important}
}

@media (max-width:390px){
  /* Very narrow phones: keep both hero CTA labels on one line. */
  .block-hero .hero-grid .actions{
    grid-template-columns:minmax(0,1.42fr) minmax(0,.92fr)!important;
    gap:5px!important;
  }
  .block-hero .hero-grid .actions .btn{
    font-size:clamp(7px,2.45vw,9.5px)!important;
    padding-left:4px!important;
    padding-right:4px!important;
  }
}