@import "@/styles/mixins.scss";
@import "@/styles/variables.scss";

.inner {
  display: flex;
  flex-direction: column;
  color: $black;
  padding: $hl-6 $hl-8 $hl-7 $hl-8;

  .logo {
    border-radius: 100%;
    width: 5rem;
    height: 5rem;
  }

  h4 {
    @include h4();
    margin: $hl-9 0;
  }

  p {
    flex: 1;
    @include p1();
    opacity: 0.6;
    overflow: hidden;
  }

  .BtnContent {
    margin-top: $hl-8;

    a, button {
      border-color: rgba($black, 15%);
      color: rgba($black, 80%);
      margin-top: $hl-10;
      padding-left: calc(1rem - 1px);
      padding-right: calc(1rem - 1px);
      transition: all 0.2s;

      &:not(:last-child) {
        margin-right: $hl-10;
      }

      &:hover {
        background: $blue;
        border-color: $blue;
        color: $white;
      }

      &:global(.button):focus:not(:active) {
        box-shadow: none;
      }
    }
  }
}