/* Final brand placement owner: artwork stays unchanged; only scale and layout are controlled here. */
.top{
  min-height:92px!important;
  height:auto!important;
  gap:24px;
  padding:10px clamp(16px,2.4vw,32px)!important;
}
.brand-home{
  flex:0 1 auto;
  min-width:0;
  max-width:min(610px,calc(100% - 330px))!important;
  padding:5px 12px 5px 2px!important;
}
.brand-home .brand-lockup{
  display:grid!important;
  grid-template-columns:68px minmax(0,1fr);
  align-items:center;
  gap:15px!important;
  min-width:0;
  text-align:left;
}
.brand-home .brand-mark{
  width:68px!important;
  height:68px!important;
  min-width:68px;
  object-fit:contain;
}
.brand-home .brand-copy{
  display:grid!important;
  gap:5px!important;
  min-width:0;
}
.brand-home .brand-title{
  display:block;
  overflow:visible;
  font-size:clamp(1.75rem,2.25vw,2.45rem)!important;
  line-height:.92!important;
  letter-spacing:-.035em!important;
  white-space:nowrap;
}
.brand-home .brand-tagline{
  display:block!important;
  overflow:hidden;
  color:var(--ct-muted)!important;
  font-size:clamp(.7rem,.9vw,.88rem)!important;
  line-height:1.2!important;
  letter-spacing:.015em;
  text-overflow:ellipsis;
  white-space:nowrap!important;
}
.brand-home:hover .brand-title{color:var(--ct-accent)}
.top .actions{flex:0 0 auto;margin-left:auto}

/* The separate Home hero uses the same title/slogan relationship without repeating either. */
#home .home-app-title{margin-bottom:0!important}
#home .home-brand-tagline{margin:10px 0 18px!important;max-width:38ch}

@media(max-width:900px){
  .top{min-height:82px!important;gap:12px;padding:8px 12px!important}
  .brand-home{max-width:calc(100% - 230px)!important}
  .brand-home .brand-lockup{grid-template-columns:54px minmax(0,1fr);gap:11px!important;justify-content:start!important}
  .brand-home .brand-mark{width:54px!important;height:54px!important;min-width:54px}
  .brand-home .brand-title{font-size:1.45rem!important}
  .brand-home .brand-tagline{display:block!important;font-size:.65rem!important}
}

@media(max-width:620px){
  .top{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    min-height:0!important;
    gap:7px 10px;
    padding:7px 10px 8px!important;
  }
  .brand-home{max-width:none!important;padding:2px!important}
  .brand-home .brand-lockup{grid-template-columns:44px minmax(0,1fr);gap:9px!important}
  .brand-home .brand-mark{width:44px!important;height:44px!important;min-width:44px}
  .brand-home .brand-title{font-size:clamp(1.04rem,5vw,1.3rem)!important}
  .brand-home .brand-tagline{display:block!important;font-size:.57rem!important;line-height:1.15!important}
  .top .actions{gap:5px}
  .top .actions .pill{display:none}
  .top .actions .btn{min-width:42px;min-height:42px;padding:8px 9px}
}

@media(max-width:390px){
  .brand-home .brand-lockup{grid-template-columns:40px minmax(0,1fr);gap:7px!important}
  .brand-home .brand-mark{width:40px!important;height:40px!important;min-width:40px}
  .brand-home .brand-title{font-size:1rem!important}
  .brand-home .brand-tagline{max-width:25ch;font-size:.53rem!important;white-space:normal!important}
}

@media(prefers-reduced-motion:reduce){.brand-home .brand-title{transition:none}}
