/* Тема «Касса»: чёрно-белая, в стиле комикса — жирные обводки и жёсткие тени. */
:root {
  --c-ink: #0a0a0a;
  --c-primary: #0a0a0a;
  --c-accent-dark: #000000;
  --c-muted: #6a6a6a;
  --c-muted-light: #a8a8a8;
  --c-on-dark-muted: #bdbdbd;
  --c-on-accent-muted: #c9c9c9;
  --c-line: #e4e4e4;
  --c-surface: #f4f4f1;
  --c-accent-pin: #ffffff;

  --grad-promo: #0a0a0a;
  --shadow-card: 5px 5px 0 #0a0a0a;
  --comic-border: 2px solid #0a0a0a;
}

/* --- Логотип-плашка --- */
.logo__img {
  width: auto;
  height: 44px;
}

@media (max-width: 959px) {
  .header__logo .logo__img {
    height: 36px;
  }
}

.header.is-scrolled {
  border-bottom: var(--comic-border);
}

.section-title {
  font-weight: 700;
}

/* --- Карточки с обводкой и жёсткой тенью --- */
.dir,
.calc,
.country,
.xr__info {
  border: var(--comic-border);
  box-shadow: var(--shadow-card);
}

.stat,
.xr__date {
  border: var(--comic-border);
}

.coin {
  border: 2px solid #0a0a0a;
}

.dir--accent .coin {
  border-color: #ffffff;
  box-shadow: none;
}

.dir__tag--muted {
  border: 1.5px solid #0a0a0a;
  color: var(--c-ink);
}

.calc__tabs {
  border: var(--comic-border);
}

.perk__icon {
  background: #0a0a0a;
  color: #ffffff;
}

.filter-btn {
  border: var(--comic-border);
}

.office__courier {
  border: 1.5px solid #0a0a0a;
  background: #ffffff;
  color: var(--c-ink);
}

.country--featured .office__courier {
  border-color: #ffffff;
  background: transparent;
  color: #ffffff;
}

/* --- Персонажи --- */
.xr__info {
  position: relative;
  grid-template-columns: 1fr auto auto;
  overflow: visible;
}

.xr__person {
  align-self: end;
  width: auto;
  height: 250px;
  margin: -90px -8px -29px 0;
}

.footer__person {
  grid-column: 4;
  grid-row: 1 / span 2;
  align-self: end;
  width: auto;
  height: 230px;
}

@media (max-width: 959px) {
  .xr__info {
    grid-template-columns: 1fr;
    padding-right: 200px;
  }

  .xr__person {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 230px;
    margin: 0;
  }

  .footer__person {
    display: none;
  }
}

@media (max-width: 639px) {
  .xr__info {
    padding-right: 24px;
    padding-bottom: 210px;
  }

  .xr__person {
    right: 0;
    height: 200px;
  }
}