/* Hub V412 — Header Layout Fix
   Fixes the oversized blank header card, search width, and mobile shortcut spacing.
*/

.hub405-global-header{
  width:100% !important;
  max-width:1180px !important;
  margin:0 auto 14px !important;
  gap:12px !important;
}

/* The banner is now a compact brand plate, not a full-width empty slab. */
.hub405-header-banner{
  width:min(100%, 620px) !important;
  max-width:620px !important;
  align-self:flex-start !important;
  border-radius:24px !important;
  background:
    radial-gradient(circle at 18% 50%, rgba(14,165,233,.16), transparent 42%),
    linear-gradient(135deg,#ffffff,#f8fbff 68%,#eef6ff) !important;
  box-shadow:0 14px 36px rgba(15,23,42,.10),0 8px 20px rgba(37,99,235,.08) !important;
}

/* Remove the fade overlay that was making the right side look like empty image space. */
.hub405-header-banner::after{
  display:none !important;
}

.hub405-header-banner img{
  width:100% !important;
  height:auto !important;
  max-height:132px !important;
  object-fit:contain !important;
  object-position:left center !important;
  display:block !important;
}

/* The real controls should own the full row below the brand plate. */
.hub405-toolbar{
  width:100% !important;
  max-width:none !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(280px,380px) !important;
  gap:12px !important;
  align-items:center !important;
}

.hub405-search{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

.hub405-nav{
  width:100% !important;
  box-sizing:border-box !important;
}

.hub405-mobile-nav{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}

/* Mobile/tablet: center the brand plate and make search/buttons full-width. */
@media(max-width:980px){
  .hub405-global-header{
    padding:0 !important;
  }
  .hub405-header-banner{
    width:min(100%, 560px) !important;
    max-width:560px !important;
  }
  .hub405-toolbar{
    display:block !important;
    width:100% !important;
  }
  .hub405-search{
    width:100% !important;
    max-width:none !important;
  }
}

@media(max-width:760px){
  .hub405-global-header{
    gap:10px !important;
    margin-bottom:10px !important;
  }

  .hub405-header-banner{
    width:min(100%, 430px) !important;
    max-width:430px !important;
    border-radius:20px !important;
    align-self:flex-start !important;
  }

  .hub405-header-banner img{
    max-height:104px !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  .hub405-search{
    display:flex !important;
    width:100% !important;
    max-width:none !important;
    min-height:58px !important;
    border-radius:22px !important;
    padding:8px !important;
  }

  .hub405-search input{
    width:100% !important;
    min-width:0 !important;
  }

  .hub405-search button{
    flex:0 0 52px !important;
    width:52px !important;
    height:52px !important;
    min-width:52px !important;
    border-radius:18px !important;
  }

  .hub405-mobile-nav{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
  }

  .hub405-mobile-nav a{
    min-width:0 !important;
    width:100% !important;
    min-height:48px !important;
    border-radius:18px !important;
  }
}

/* Very narrow phones. */
@media(max-width:430px){
  .hub405-header-banner{
    width:100% !important;
  }
  .hub405-header-banner img{
    max-height:92px !important;
  }
  .hub405-mobile-nav{
    gap:8px !important;
  }
  .hub405-mobile-nav a{
    font-size:.72rem !important;
  }
}