:root {
  --brand-pink: #FF3B8D;
  --brand-black: #0B0B0B;
  --brand-white: #FFFFFF;
  --brand-light-gray: #F7F7F8;
  --brand-medium-gray: #C4C4C4;
  --swiper-theme-color: var(--brand-pink);
  color-scheme: light;
}

body {
  background: var(--brand-white);
  color: var(--brand-black);
}

::selection {
  background: var(--brand-pink);
  color: var(--brand-black);
}

:focus-visible {
  outline: 2px solid var(--brand-pink);
  outline-offset: 5px;
}

.header.bg {
  background-image: none;
}

:root .btn-primary,
:root .menu-btn,
:root .play-button,
:root .modal-cross,
:root .resume-modal__close-btn,
:root .whyus__content-button {
  background: var(--brand-pink);
  color: var(--brand-black);
  transition: background-color .25s, box-shadow .25s, opacity .25s;
}

:root .btn-default {
  background: var(--brand-white);
  color: var(--brand-black);
  box-shadow: inset 0 0 0 1px var(--brand-medium-gray);
}

:root :is(.btn-primary, .btn-default, .whyus__content-button):hover {
  background: var(--brand-black);
  color: var(--brand-white);
  -webkit-text-fill-color: currentColor;
}

:root :is(.btn-primary, .btn-default, .whyus__content-button):active {
  opacity: .8;
}

:root .menu-btn-wrapper span,
:root .menu-btn .cross::before,
:root .menu-btn .cross::after,
:root .play-icon {
  background: var(--brand-black);
}

/* The original local animation files keep playing in the new light palette. */
video[autoplay] {
  filter: invert(1) hue-rotate(65deg) saturate(.85);
  mix-blend-mode: multiply;
}

.single__bg {
  background: none;
}

.single__bg-placeholder {
  background: var(--brand-white);
}

:root :is(.stats__bg, .steps__bg, .vacancies__bg,
  .keyFocus__content-item__img, .keyFocus__mob-item__img) {
  filter: invert(1) hue-rotate(65deg) saturate(.85);
}

.teamHistory::before {
  filter: invert(1) grayscale(1);
  opacity: .4;
}

:root .whyus .whyus__content .whyus__content-item {
  background-image: none;
  background-color: var(--brand-light-gray);
  border: 1px solid var(--brand-medium-gray);
}

:root .teamHistory__slider-container .slide-text,
:root .photolessSlide,
:root .vacancy-card,
:root .vacancy-modal__cards-item.default {
  background: var(--brand-light-gray);
  border-color: var(--brand-medium-gray);
}

:root .teamHistory__slider-container .slide-text h4 {
  color: var(--brand-pink);
}

:root .vacancy-card {
  box-shadow: 0 8px 32px #0B0B0B0D;
  -webkit-box-shadow: 0 8px 32px #0B0B0B0D;
  border: 1px solid var(--brand-medium-gray);
}

:root .culture-vacancies {
  background-image: none;
}

.slide-img img,
.blog-preview {
  filter: grayscale(1);
}

:root .video-player .video-container video {
  filter: grayscale(1);
}

:root .video-player.is-paused .video-container video {
  filter: grayscale(1) blur(7px);
}

.stats__content-item__mid img {
  filter: brightness(0);
}

:root .culture-value,
:root .culture-whois {
  background-image: none;
  background-color: var(--brand-light-gray);
}

:root .modal-overlay {
  background: #0B0B0B66;
  backdrop-filter: blur(12px);
}

:root .modal-overlay .modal {
  background: var(--brand-white);
  color: var(--brand-black);
  box-shadow: 0 24px 80px #0B0B0B26;
  border: 1px solid var(--brand-medium-gray);
}

:root .resume-modal__form-group :is(input, textarea),
:root .resume-modal__file-upload {
  background: var(--brand-light-gray);
  border-color: var(--brand-medium-gray);
}

:root .resume-modal__form-group :is(input, textarea):focus,
:root .resume-modal__file-upload.--dragover {
  border-color: var(--brand-pink);
}

.form-local-note {
  font: 12px/1.5 Cygre, sans-serif;
  color: var(--brand-black);
  opacity: .65;
}

:root .footer {
  background: var(--brand-black);
  color: var(--brand-white);
}

:root .footer :is(h3, h4, p, span, a) {
  color: var(--brand-white) !important;
  -webkit-text-fill-color: currentColor;
}

:root .footer a:hover {
  color: var(--brand-pink) !important;
  -webkit-text-fill-color: var(--brand-pink);
}

:root .footer-social__icons {
  max-width: 180px;
}

.footer-brand-note {
  font: 14px/1.5 Cygre, sans-serif;
}

:root .footer :is(.footer-social, .footer-navigation)::after {
  background: #C4C4C433;
}

:root .swiper-pagination-bullet {
  background: var(--brand-medium-gray);
}

:root .swiper-pagination-bullet-active {
  background: var(--brand-pink) !important;
}
