.budget-highlight-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.budget-highlight {
  /* max-width: 300px; */
  display: grid;

  grid-template-columns: min-content min-content 1fr;
  grid-template-rows: min-content 1fr;
  grid-template-areas:
    "ic nb sb"
    "ic tx tx";

  font-family: sans-serif;
  color: #2c2c2c;
  margin: 16px 12px;
  line-height: normal;
}

.budget-highlight .icon-container {
  grid-area: ic;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0 16px 0 8px;
}

.budget-highlight > div {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.budget-highlight .icon {
  --size: 36px;
  width: var(--size);
  height: var(--size);
  border-radius: var(--size);

  background-color: #2c2c2c;
}
.budget-highlight .icon.spending {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23191919;opacity:0;%7D.cls-2%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ebudget-icons%3C/title%3E%3Cg id='Circle'%3E%3Ccircle class='cls-1' cx='18' cy='18' r='18'/%3E%3C/g%3E%3Cg id='piggy'%3E%3Cpath class='cls-2' d='M27.26,14.51a8.23,8.23,0,0,0-1.17-1.85,3.14,3.14,0,0,1,.93-2.4l.61-.58L27,9.15a4.35,4.35,0,0,0-3.31-.92,4.79,4.79,0,0,0-2.74,1.26A11.78,11.78,0,0,0,18,9.12a10.81,10.81,0,0,0-7,2.44,8.73,8.73,0,0,0-1.92,2.27A1.71,1.71,0,0,1,7.87,13a2.13,2.13,0,0,1,0-2l-1.27-.77a3.61,3.61,0,0,0,0,3.52A3.21,3.21,0,0,0,8.5,15.21a7.34,7.34,0,0,0-.4,2.38,8,8,0,0,0,3.59,6.52l1,3.7h2.59L16.51,26a11.74,11.74,0,0,0,3,0l1.22,1.85h2.6l1-3.7a8.57,8.57,0,0,0,2.92-3.44h1.52l1.11-6.16Zm-9.09,2.35a4,4,0,0,1,1.38.48A1.91,1.91,0,0,1,20.39,19a2.21,2.21,0,0,1-1.63,2.08v1H17.27v-1A2.22,2.22,0,0,1,15.64,19h1.49a.92.92,0,0,0,1.78,0c0-.41-.08-.51-1.05-.71a4,4,0,0,1-1.37-.49,1.89,1.89,0,0,1-.85-1.69,2.21,2.21,0,0,1,1.63-2.07v-1h1.49v1a2.2,2.2,0,0,1,1.63,2.07H18.91a.92.92,0,0,0-1.78,0C17.13,16.56,17.21,16.66,18.17,16.86Z'/%3E%3C/g%3E%3C/svg%3E");
}
.budget-highlight .icon.tech {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23191919;opacity:0;%7D.cls-2%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ebudget-icons%3C/title%3E%3Cg id='Circle'%3E%3Ccircle class='cls-1' cx='18' cy='18' r='18'/%3E%3C/g%3E%3Cg id='Tech'%3E%3Crect class='cls-2' x='19.81' y='20.4' width='1.47' height='4.09'/%3E%3Crect class='cls-2' x='14.6' y='20.4' width='1.47' height='4.09'/%3E%3Cpath class='cls-2' d='M30.14,20.53c0,.19-.08.37-.13.56A12.45,12.45,0,0,1,5.88,15L8,15.51a10.22,10.22,0,0,0,19.81,5c0-.16.07-.3.1-.46a15.67,15.67,0,0,0-.8-9,4.06,4.06,0,0,0-7.74.68h.77a2.39,2.39,0,0,1,2.4,2.39V18h1v1.66H12.34V18h1v-3.9a2.39,2.39,0,0,1,2.39-2.39h1.45a6.28,6.28,0,0,1,12.07-1.51A18,18,0,0,1,30.14,20.53Z'/%3E%3C/g%3E%3C/svg%3E");
}
.budget-highlight .icon.travel {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23191919;opacity:0;%7D.cls-2%7Bfill:%23fff;fill-rule:evenodd;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ebudget-icons%3C/title%3E%3Cg id='Circle'%3E%3Ccircle class='cls-1' cx='18' cy='18' r='18'/%3E%3C/g%3E%3Cg id='Travel'%3E%3Cpath class='cls-2' d='M30.85,23.42a.82.82,0,0,1-.53.45,1,1,0,0,1-.81-.17c-.34-.17-.71-.46-1.14-.69l-8.13-4.44h0a.48.48,0,0,0-.63.17L14.21,27a.46.46,0,0,0-.08.34l.61,3.13L8.37,26.74l3-1a.43.43,0,0,0,.27-.24l4.41-8.76a.5.5,0,0,0-.18-.64L8,11.23c-.42-.26-.84-.44-1.16-.64s-.49-.37-.54-.62h0a.78.78,0,0,1,.14-.67.46.46,0,0,1,.53-.19l11.17,2.55h0a.49.49,0,0,0,.52-.22L21,7.24a2.84,2.84,0,0,1,2.4-1.66,2.47,2.47,0,0,1,1.22.32c1.06.61,1.69,2,.65,3.82L22.88,13.9a.51.51,0,0,0-.07.24.51.51,0,0,0,.13.33l7.79,8.4A.48.48,0,0,1,30.85,23.42Z'/%3E%3C/g%3E%3C/svg%3E");
}

.budget-highlight .icon.alcohol {
  background-image: url("data:image/svg+xml,%3Csvg id='Circle' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23191919;opacity:0;%7D.cls-2%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ebudget-icons%3C/title%3E%3Ccircle class='cls-1' cx='18' cy='18' r='18'/%3E%3Cpath class='cls-2' d='M22.76,21.39v5.82c1,.05,1.76.3,1.76.59s-.92.59-2.06.59-2.05-.25-2.05-.59.76-.54,1.76-.59V21.39a3,3,0,0,1-2.64-2.93V14.69a.65.65,0,0,1,.63-.63h4.57a.65.65,0,0,1,.62.63v3.77h0A3,3,0,0,1,22.76,21.39Z'/%3E%3Cpath class='cls-2' d='M17,27.51a1,1,0,0,1-1,1H12.16a1,1,0,0,1-1.05-1v-15a2.77,2.77,0,0,1,1.26-2.3v-3a.5.5,0,0,1-.42-.5V6.06a.55.55,0,0,1,.55-.54h3.09a.55.55,0,0,1,.55.54v.59a.5.5,0,0,1-.42.5v3A2.77,2.77,0,0,1,17,12.47v15Z'/%3E%3C/svg%3E");
}
.budget-highlight .icon.grocery {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23191919;%7D.cls-2%7Bfill:none;stroke:%23fff;stroke-linecap:round;stroke-linejoin:round;%7D.cls-3%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ebudget-icons%3C/title%3E%3Cg id='Circle'%3E%3C/g%3E%3Cg id='Grocery'%3E%3Cpath class='cls-2' d='M4.35,6.12S6.59,6,7.06,7.67s4.56,14.27,4.56,14.27L9.4,26.11l17.14.22s.43.15.58.89'/%3E%3Cpolyline class='cls-2' points='7.58 9.4 29.04 10.78 29.56 11.57 27.7 20.78 27.12 21.37 11.62 21.94'/%3E%3Ccircle class='cls-3' cx='9.4' cy='29.76' r='1.45'/%3E%3Ccircle class='cls-3' cx='14.35' cy='18.94' r='1.11'/%3E%3Ccircle class='cls-3' cx='17.72' cy='18.94' r='1.11'/%3E%3Ccircle class='cls-3' cx='21.05' cy='18.94' r='1.11'/%3E%3Ccircle class='cls-3' cx='24.34' cy='18.94' r='1.11'/%3E%3Ccircle class='cls-3' cx='26.01' cy='15.79' r='1.11'/%3E%3Ccircle class='cls-3' cx='22.68' cy='15.83' r='1.11'/%3E%3Ccircle class='cls-3' cx='19.35' cy='15.83' r='1.11'/%3E%3Ccircle class='cls-3' cx='16.02' cy='15.83' r='1.11'/%3E%3Ccircle class='cls-3' cx='12.73' cy='15.83' r='1.11'/%3E%3Ccircle class='cls-3' cx='14.39' cy='12.68' r='1.11'/%3E%3Ccircle class='cls-3' cx='17.68' cy='12.64' r='1.11'/%3E%3Ccircle class='cls-3' cx='21.01' cy='12.68' r='1.11'/%3E%3Ccircle class='cls-3' cx='24.35' cy='12.68' r='1.11'/%3E%3Ccircle class='cls-3' cx='25.09' cy='29.76' r='1.45'/%3E%3C/g%3E%3C/svg%3E");
}

.budget-highlight .icon.housing {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M13.5,12.5h10c1.1,0,2,0.9,2,2v10c0,1.1-0.9,2-2,2h-10c-1.1,0-2-0.9-2-2v-10C11.5,13.4,12.4,12.5,13.5,12.5z'/%3E%3Cpath fill='%23fff' d='M19.9,8l7.1,7.1c0.8,0.8,0.8,2,0,2.8L19.9,25c-0.8,0.8-2,0.8-2.8,0L10,17.9c-0.8-0.8-0.8-2,0-2.8L17.1,8C17.9,7.2,19.1,7.2,19.9,8z'/%3E%3C/svg%3E");
}

.budget-highlight .icon.health {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M17.5,7.5h2c1.1,0,2,0.9,2,2v16c0,1.1-0.9,2-2,2h-2c-1.1,0-2-0.9-2-2v-16C15.5,8.4,16.4,7.5,17.5,7.5z'/%3E%3Cpath fill='%23fff' d='M28.5,16.5v2c0,1.1-0.9,2-2,2h-16c-1.1,0-2-0.9-2-2v-2c0-1.1,0.9-2,2-2h16C27.6,14.5,28.5,15.4,28.5,16.5z'/%3E%3C/svg%3E");
}

.budget-highlight .icon.dental {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M27.2,13.8c0,2.3-2.7,6-2.7,8.7S23,26.5,21,27c-0.3,0.1-0.5-0.2-0.5-0.5c0-1.2,0-5.2-1.2-6.4l-0.5-0.5c-0.8-0.8-0.8-0.8-1.6,0l-0.5,0.5c-1.4,1.4-1.2,5.2-1.2,6.4c0.1,0.3-0.2,0.6-0.5,0.5c-1.9-0.5-3.4-0.7-3.4-4.4s-2.7-7.4-2.7-8.7s1.3-5,4.1-5h0.3c0.1,0,0.2,0,0.3,0.1l0,0c0.8,0.8,8.1,0.8,8.9,0l0,0c0.1-0.1,0.2-0.1,0.3-0.1h0.3C25.8,8.8,27.2,11.5,27.2,13.8z'/%3E%3C/svg%3E");
}

.budget-highlight .icon.climate {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M21,19.8V13h-3v-1h3v-2h-3V9h3V8c0-1.7-1.3-3-3-3s-3,1.3-3,3v11.8c-1.8,1-3,3-3,5.2c0,3.3,2.7,6,6,6c3.3,0,6-2.7,6-6C24.1,22.8,22.8,20.8,21,19.8z M18,29.1c-2.2,0-4-1.8-4-4c0-1,0.4-1.9,1-2.6c0.5-0.6,1.2-1,2-1.2V16c0-0.5,0.5-1,1-1s1,0.5,1,1v5.1c0.8,0.2,1.5,0.6,2,1.2c0.7,0.7,1.1,1.7,1.1,2.7C22.1,27.3,20.3,29.1,18,29.1z'/%3E%3C/svg%3E");
}

.budget-highlight .icon.ukraine {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M18.4,6c-6-0.3-10.9,4.5-10.9,10.4c0,1.9,0.5,3.7,1.4,5.2c0.3,0.5,0.6,0.9,0.9,1.3L18,31l7.1-7c2-1.9,3.3-4.6,3.3-7.6C28.4,10.9,24,6.2,18.4,6z M22.4,20.1c-1.2,1.1,0.7,1.5,1.5,1.5c-1,1.9-4.4,0.3-4.3-0.1c0.1,0,1.2-0.7,1.1-0.8c-0.1-0.5-2.3-0.1-2.2-0.8c0.3,0.1,0.7,0.1,1-0.1c-0.6,0.1-0.5-0.2-0.7-0.5c0,0.7-2.6,0.9-2.3,2.4c-0.6-0.2-1.1,0.1-1.6-0.2c0,0,0.9-1.4,0.9-1.5c0.1-0.1,0.9,0.4,1.1,0.1c-1.9-1-0.5-2.4-3.3-2.8c-1.3-0.2-4,1.9-5.1,0c0,0.1,1.7-4.8,1.5-4.8c1.7-1.4,3.6,0,5.5-0.1c1.8-0.1,2.5-1.3,4.4-1.3c1.9,0,1.1,1.1,2,1.7c1.2,0.9,5.2,1.6,5.9,3C28.5,17.6,23.1,20.8,22.4,20.1z'/%3E%3C/svg%3E");
}

.budget-highlight .icon.defence {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpolygon fill='%23fff' points='23.2,26.7 26.9,25.1 22.8,29.2 22.7,28 21.7,26.6 20.9,27.4 20.9,25.4 18,21.3 14.8,22.8 14.6,28.9 11.4,24.4 9.9,25.1 10.6,23.6 6.1,20.4 12.2,20.2 13.7,17 9.6,14.1 7.6,14.1 8.4,13.3 7,12.3 5.8,12.2 6.3,11.8 9.9,8.1 8.3,11.8 9.8,11.9 11.7,9.9 10.9,11.9 18,12.2 19.5,9.4 20.5,10.4 28.1,6.9 24.6,14.5 25.6,15.5 22.8,17 23.1,24.1 25.1,23.3 23.1,25.2'/%3E%3C/svg%3E");
}

.budget-highlight .icon.money {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M19.6,7.9c0,0.4,0.3,0.7,0.7,0.8c0.4,0.1,0.8,0.2,1.2,0.3c0.8,0.3,1.5,0.6,2.1,1c0.4,0.3,0.5,0.8,0.2,1.1 l-1.1,1.4c-0.2,0.3-0.7,0.4-1.1,0.2c-0.4-0.3-0.9-0.5-1.4-0.7c-0.2-0.1-0.4-0.1-0.6-0.2v3.8l0.1,0c0.8,0.2,1.5,0.4,2.3,0.7 c0.7,0.3,1.3,0.7,1.8,1.2c0.7,0.8,1.2,1.8,1.2,3.1c0,1.3-0.4,2.5-1.4,3.5c-0.7,0.7-1.8,1.2-3.2,1.5c-0.4,0.1-0.7,0.4-0.7,0.8V27 c0,0.4-0.4,0.8-0.8,0.8h-1.5c-0.4,0-0.8-0.4-0.8-0.8v-0.5c0-0.4-0.3-0.7-0.7-0.8c-0.7-0.1-1.3-0.2-1.9-0.4 c-0.9-0.3-1.8-0.7-2.6-1.2c-0.4-0.2-0.5-0.8-0.2-1.1l1.1-1.6c0.2-0.3,0.7-0.4,1.1-0.2c0.6,0.4,1.2,0.7,1.9,0.9 c0.4,0.1,0.9,0.3,1.4,0.3v-3.7c0-0.4-0.2-0.7-0.6-0.8c-0.6-0.2-1.1-0.3-1.6-0.6c-0.7-0.3-1.3-0.7-1.8-1.2c-0.7-0.7-1.1-1.7-1.1-3 c0-1.2,0.5-2.4,1.5-3.3c0.7-0.7,1.7-1.2,3-1.4c0.4-0.1,0.7-0.4,0.7-0.8V7.5c0-0.4,0.4-0.8,0.8-0.8h1.5c0.4,0,0.8,0.4,0.8,0.8V7.9z M15.9,14.7c0.2,0.1,1.4,0.2,1.6,0.2v-3c-0.4,0.1-1.7,0.2-1.9,0.3C15.1,12.6,15,13,15,13.4C15,13.9,15.3,14.4,15.9,14.7z M18.6,19 v3.4c0.5-0.1,1.8-0.2,2.1-0.4c0.4-0.3,0.6-0.7,0.6-1.2c0-0.6-0.3-1-0.8-1.3C20.3,19.3,19,19.2,18.6,19z'/%3E%3C/svg%3E");
}
.icon.reconciliation {
  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 36' %3E%3Cpath fill='%23fff' d='M27,9.8c0,0.6,0,1.3-0.1,1.8c-0.1,0.5-0.2,1-0.4,1.5L26,14.4c-0.2,0.4-0.3,0.8-0.5,1.1 c-0.2,0.3-0.3,0.6-0.5,0.9c-1.6,0.8-4.5,2.3-3.2,2.1c1-0.2,1.5,0,1.7,0.2c-0.2,0.2-0.3,0.5-0.5,0.7c-0.9,1.2-1.8,2.3-2.8,3.3 c-0.5,0.5-1,1-1.5,1.5c-0.4,0.3-2.4,0.7-4,0.9c1.1-1,2-2,2.3-2.6c0.9-1.8,0-1.8,0-1.8s0,0-0.1,0.1c-0.1,0.2-0.2,0.5-0.3,0.8 c-0.4,0.8-1.6,2-3,3.1c-0.2,0.2-0.4,0.3-0.6,0.5C11.1,26.7,9,28,8,28c-1.9,0,0-0.9,0-0.9c1.1,0,2.5-1,4-2.3 c-0.5-0.7,0.4-2.2,0.1-3.9l-0.2-1.1c-0.2-1,0.4-1.3,0.8-1.8s0.9-0.9,1.3-1.3c0.1-0.1,0.3-0.3,0.4-0.4c0.3,0.2,0.7,0.7,0.7,2 c0,1.9,1.6-3.5,2-5v0c0.5-0.6,1-1.3,1.5-1.9c0.1-0.2,0.3-0.4,0.4-0.6c0,0,0,0,0.1-0.1c0.3,0.1,0.6,0.6,0.6,1.7 c0,1.4,1.1-2.2,1.6-3.8l1.5-1.1c1.2-0.8,2.8-0.5,3.7,0.7C26.8,8.8,27,9.3,27,9.8z'/%3E%3C/svg%3E");
}

.budget-highlight .number {
  grid-area: nb;
  /* letter-spacing: -0.2px; */

  font-family: "ÐÇ¿Õ´«Ã½ Sans Black", sans-serif;
  font-size: 32px;
  white-space: nowrap;
}

.budget-highlight .subtext {
  grid-area: sb;

  font-family: "ÐÇ¿Õ´«Ã½ Sans", sans-serif;
  font-size: 13px;
  margin-left: 5px;
  margin-bottom: 5px;

  font-style: italic;
}

.budget-highlight .text {
  grid-area: tx;

  font-size: 16px;
  margin-top: 1px;
}