/**
 * Standard logo sizes (navbar / footer / hero)
 */
:root {
  --kay-logo-h-header: 52px;
  --kay-logo-h-footer: 64px;
  --kay-logo-h-hero: 56px;
  --kay-logo-max-w-header: 200px;
  --kay-logo-max-w-footer: 220px;
  --kay-logo-max-w-hero: 200px;
}

/* V1 */
.logo-img {
  height: var(--kay-logo-h-header);
  max-width: var(--kay-logo-max-w-header);
}
.logo-img--header {
  height: var(--kay-logo-h-header);
  max-width: var(--kay-logo-max-w-header);
}
.logo-img--footer {
  height: var(--kay-logo-h-footer);
  max-width: var(--kay-logo-max-w-footer);
}
.logo-img--hero {
  height: var(--kay-logo-h-hero);
  max-width: var(--kay-logo-max-w-hero);
}

/* V2 */
.k2-logo__img {
  height: var(--kay-logo-h-header);
  max-width: var(--kay-logo-max-w-header);
}
.k2-logo__img--header {
  height: var(--kay-logo-h-header);
  max-width: var(--kay-logo-max-w-header);
}
.k2-logo__img--footer {
  height: var(--kay-logo-h-footer);
  max-width: var(--kay-logo-max-w-footer);
}
.k2-logo__img--hero {
  height: var(--kay-logo-h-hero);
  max-width: var(--kay-logo-max-w-hero);
}

@media (max-width: 560px) {
  :root {
    --kay-logo-h-header: 44px;
    --kay-logo-h-footer: 56px;
    --kay-logo-h-hero: 48px;
    --kay-logo-max-w-header: 168px;
    --kay-logo-max-w-footer: 188px;
  }
}