@use 'abstracts';

.footer {
  background-color: var(--text-main);
  color: var(--bg-surface);
  padding-top: calc(var(--space-4) * 2);

  &__wrapper {
    @include abstracts.container-wrapper;
  }

  &__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: calc(var(--space-4) * 1.5);
    padding-bottom: calc(var(--space-4) * 1.5);

    @include abstracts.breakpoint('md') {
      grid-template-columns: 2fr 1fr 1fr;
    }
  }

  &__col-title {
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: var(--space-3);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--accent);
  }

  &__logo {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    font-size: var(--font-size-lg);
    font-weight: 700;
    margin-bottom: var(--space-3);
    color: var(--bg-surface);
  }

  &__logo-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: abstracts.rem(36);
    height: abstracts.rem(36);
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-hover) 100%);
    border-radius: 8px;
    font-weight: 700;
    color: var(--text-on-accent);
  }

  &__logo-accent {
    color: var(--accent);
  }

  &__tagline {
    font-size: var(--font-size-base);
    line-height: 1.7;
    margin-bottom: var(--space-3);
    max-width: 34ch;
    color: var(--bg-muted);
  }

  &__address {
    font-size: var(--font-size-base);
    font-style: normal;
    line-height: 1.7;
    color: var(--bg-muted);
  }

  &__links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);

    a {
      font-size: var(--font-size-base);
      color: var(--bg-muted);
      transition: color 0.2s ease;

      &:hover {
        color: var(--accent);
      }
    }
  }

  &__bottom {
    border-top: 1px solid var(--border-color);
    padding-block: var(--space-3);
    text-align: center;
    color: var(--text-muted);

    p {
      font-size: 0.85rem;
      color: var(--text-muted);
    }
  }
}
