/* Approved BILLingsly homepage composition: compact reference layout */
#onboardingOverlay{padding:12px!important;align-items:flex-start!important;background:radial-gradient(circle at 82% 8%,rgba(94,44,255,.20),transparent 25%),#020713!important}
#onboardingOverlay .onboardingCard{width:min(820px,100%)!important;max-width:820px!important;margin:auto!important;padding:14px 18px 16px!important;border-radius:24px!important;overflow:hidden!important}

.billLanding{gap:10px!important}
.billLandingTop{min-height:34px!important}
.billLandingBrand{font-size:20px!important;letter-spacing:-.5px!important}
.billLandingPrefs{gap:5px!important}
.billLandingPrefs select,.billLandingPrefs button{height:30px!important;min-height:30px!important;border-radius:7px!important;font-size:10px!important}
.billLandingPrefs select{min-width:58px!important;padding:0 22px 0 8px!important}
.billLandingPrefs #billWelcomeCurrency{min-width:66px!important}
.billLandingPrefs button{padding:0 9px!important}

.billLandingHero{grid-template-columns:minmax(0,.92fr) minmax(300px,1.08fr)!important;gap:8px!important;min-height:278px!important;align-items:center!important}
.billLandingHeroCopy{padding:2px 0 0 10px!important}
.billCuteLogoBars{height:25px!important;gap:4px!important;margin-bottom:12px!important}
.billCuteLogoBars i{width:7px!important}
.billCuteLogoBars i:nth-child(1){height:12px!important}.billCuteLogoBars i:nth-child(2){height:16px!important}.billCuteLogoBars i:nth-child(3){height:21px!important}.billCuteLogoBars i:nth-child(4){height:25px!important}
.billLandingHeroCopy h1{font-size:40px!important;line-height:.98!important;letter-spacing:-1.9px!important;margin:0 0 12px!important}
.billLandingHeroCopy p{font-size:11.5px!important;line-height:1.42!important;margin:0 0 14px!important}
.billCuteActions{max-width:330px!important;gap:7px!important}
.billCutePrimary,.billCuteSecondary{min-height:37px!important;height:37px!important;border-radius:9px!important;padding:7px 12px!important;font-size:11.5px!important}
.billCutePrimary b{font-size:14px!important;margin-left:6px!important}

.billLandingMascot{min-height:272px!important;overflow:visible!important;background:url('/billingsly-home-waving-v2.svg?v=20260827-01') center/238px auto no-repeat!important}
.billLandingMascot:before{display:none!important}
.billLandingMascot:after{display:none!important}
.billLandingMascot .heroRobot{opacity:0!important;width:min(238px,78%)!important;max-height:278px!important;object-fit:contain!important;filter:none!important;animation:none!important;border-radius:0!important}
.billLandingSpark{display:none!important}

.billMeetSection{padding:2px 10px 0!important}
.billMeetIntro{max-width:500px!important;margin:0 auto 10px!important;text-align:center!important}
.billMeetIntro h2{font-size:16px!important;margin:0 0 4px!important;letter-spacing:.035em!important;text-align:center!important}
.billMeetIntro p{font-size:12.5px!important;line-height:1.35!important;text-align:center!important}
.billMeetGrid{max-width:700px!important;gap:8px 12px!important}
.billMeetGrid article{grid-template-columns:38px 1fr!important;gap:8px!important;min-height:68px!important;padding:8px 10px!important;border-radius:12px!important}
.billMeetGrid i{width:36px!important;height:36px!important;border-radius:10px!important;font-size:18px!important}
.billMeetGrid b{font-size:13.5px!important;margin-bottom:2px!important}
.billMeetGrid span{font-size:11.5px!important;line-height:1.28!important}

.billLandingTrust{margin:2px 10px 0!important;padding:10px 0 0!important;border-top:1px solid #1e314b!important}
.billLandingTrust>div{gap:7px!important;padding:4px 10px!important}
.billLandingTrust i{font-size:18px!important}
.billLandingTrust b{font-size:12.5px!important;line-height:1.15!important}
.billLandingTrust span{font-size:11px!important;line-height:1.15!important}

@media(max-width:700px){
  #onboardingOverlay{padding:0!important}
  #onboardingOverlay .onboardingCard{width:100%!important;max-width:none!important;min-height:100vh!important;border-radius:0!important;border-left:0!important;border-right:0!important;padding:14px 14px 18px!important}
  .billLandingTop{display:flex!important;justify-content:space-between!important;gap:8px!important}
  .billLandingBrand{font-size:19px!important}
  .billLandingHero{grid-template-columns:1fr!important;gap:0!important}
  .billLandingHeroCopy{padding:8px 4px 0!important;text-align:center!important}
  .billCuteLogoBars{justify-content:center!important}
  .billLandingHeroCopy h1{font-size:42px!important}
  .billLandingHeroCopy p{font-size:12px!important}
  .billCuteActions{margin:0 auto!important;width:min(100%,350px)!important}
  .billLandingMascot{min-height:250px!important;background-size:220px auto!important}
  .billLandingMascot .heroRobot{width:min(220px,68%)!important;max-height:260px!important}
  .billMeetGrid{grid-template-columns:1fr!important;max-width:430px!important}
  .billLandingTrust{grid-template-columns:repeat(3,1fr)!important}
  .billLandingTrust>div{border-right:1px solid #263752!important;border-bottom:0!important;justify-content:center!important;padding:5px!important}
  .billLandingTrust>div:last-child{border-right:0!important}
}

@media(max-width:430px){
  .billLandingTop{flex-wrap:wrap!important;justify-content:center!important}
  .billLandingBrand{width:100%!important;text-align:center!important}
  .billLandingPrefs select,.billLandingPrefs button{height:32px!important;min-height:32px!important;font-size:10px!important}
  .billLandingHeroCopy h1{font-size:38px!important}
  .billMeetIntro p{font-size:12px!important}
  .billMeetGrid b{font-size:13px!important}
  .billMeetGrid span{font-size:11px!important}
  .billLandingTrust{grid-template-columns:1fr!important;gap:0!important}
  .billLandingTrust>div{border-right:0!important;border-bottom:1px solid #263752!important;justify-content:flex-start!important;padding:7px 10px!important}
  .billLandingTrust>div:last-child{border-bottom:0!important}
  .billLandingTrust b{font-size:12.5px!important}
  .billLandingTrust span{font-size:11px!important}
}
