@media (min-width:62rem) {
  #primary-sidebar-menu {
    min-width: 25rem;
    max-width: 36rem;
  }

}

@media (max-width:62rem) {
  h1 {
    font-size: var(--solo-px26);
    line-height: calc(2 * var(--solo-px15));
  }

  h2 {
    font-size: var(--solo-px22);
    line-height: var(--solo-px26);
  }

  h3 {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  h4 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px22);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 32rem;
  }

}

@media (max-width:48rem) {
  .node--view-mode-teaser .field--name-field-image {
    min-width: 100%;
  }

  .view .node--view-mode-teaser .node__title,
  .view .node--view-mode-teaser .node__content .field--name-field-image {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }

  h1 {
    font-size: var(--solo-px22);
    line-height: var(--solo-px26);
  }

  h2 {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  h3 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px22);
  }

  h4 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 25rem;
  }

}

@media (max-width:36rem) {
  .header-inner #block-solo-branding {
    width: 100%;
  }

  .header-inner .branding-wrapper {
    display: grid;
    gap: var(--solo-px8);
    margin-top: var(--solo-px8);
  }

  .site-name {
    font-size: var(--solo-px26);
    line-height: calc(2 * var(--solo-px15));
  }

  .site-slogan {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  .header-inner .branding-wrapper>* {
    width: 100%;
  }

  .header-inner .branding-wrapper .branding-first,
  .header-inner .branding-wrapper .branding-first a,
  .header-inner .branding-wrapper h1.site-name,
  .header-inner .branding-wrapper h1.site-name a,
  .header-inner .branding-wrapper h3.site-slogan {
    justify-content: center;
    text-align: center;
  }

  h1 {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  h2 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px22);
  }

  h3 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  h4 {
    font-size: var(--solo-px14);
    line-height: var(--solo-px18);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 22rem;
  }

}

@media (max-width:20rem) {
  h1 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px20);
  }

  h2 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  h3 {
    font-size: var(--solo-px14);
    line-height: var(--solo-px18);
  }

  h4 {
    font-size: var(--solo-px12);
    line-height: var(--solo-px16);
  }

  #primary-sidebar-menu {
    min-width: 12rem;
    max-width: 16rem;
  }

}