@layer component.layout {
  .tricolor {
    display: grid;
    grid-template: "image main rest" auto / 10.88889rem 1fr auto;
    align-items: center;
    gap: 1.33333rem;
    @media (max-width: 800px) {
      grid-template:
        "image image" auto
        "main rest" auto /
        1fr auto;
    }
  }

  .tricolor__image {
    grid-area: image;
    img {
      width: 100%;
      vertical-align: bottom;
    }
  }

  .tricolor__body {
    height: 100%;
    display: flex;
    align-items: anchor-center;
  }
}