.brand{min-width:0}.brand .brandLogo{display:block;width:48px;height:48px;object-fit:contain;flex:0 0 48px}.brand .brandText{min-width:0}@media(max-width:600px){.brand .brandLogo{width:40px;height:40px;flex-basis:40px}}

/* Wider masthead and hero, with the content panels kept on their existing grid. */
.budget-home{--masthead-width:1544px}
.budget-home header .nav{max-width:var(--masthead-width);padding-inline:32px;flex-wrap:wrap;row-gap:16px}
.budget-home .navlinks{flex-wrap:wrap;align-items:center}
.budget-home .hero{width:min(1480px,calc(100vw - 64px));max-width:none;position:relative;left:50%;transform:translateX(-50%);grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(32px,5vw,80px)}
.budget-home .hero>*{min-width:0}
@media(max-width:1100px){.budget-home header .nav{gap:18px}.budget-home .navlinks{gap:18px}.budget-home .brandText{max-width:310px}}
@media(max-width:800px){.budget-home header .nav{padding-inline:18px}.budget-home .navlinks{gap:12px}.budget-home .hero{width:100%;left:auto;transform:none;grid-template-columns:1fr;gap:20px}.budget-home .brandText{max-width:none}}
