@font-face {
  font-family: "Akony";
  src: url("../fonts/AKONY.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --mark10-akony: "Akony", "Arial Black", Impact, sans-serif;
  --mark10-body: Inter, system-ui, sans-serif;
}

/* SPB-4: прелоадер не используем */
.page-load,
.page-load_section {
  display: none !important;
}

html.show-loader .page-load,
html.show-loader .page-load_section {
  display: none !important;
}

/* ——— Wordmark (hero + footer) — plain black, no blocks ——— */
.spb4-wordmark {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 0.28em;
  font-family: var(--mark10-akony);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 0.88;
  text-transform: uppercase;
}

.spb4-wordmark--hero,
.spb4-wordmark--footer {
  color: #000;
}

.spb4-wordmark--hero .spb4-wordmark__left,
.spb4-wordmark--hero .spb4-wordmark__right,
.spb4-wordmark--footer .spb4-wordmark__left,
.spb4-wordmark--footer .spb4-wordmark__right {
  flex: 0 0 auto;
  padding: 0;
  background: transparent !important;
  color: #000 !important;
}

.spb4-wordmark--hero .spb4-wordmark__sep,
.spb4-wordmark--footer .spb4-wordmark__sep {
  flex: 0 0 auto;
  width: 2px;
  height: 0.82em;
  margin: 0 0.06em;
  padding: 0;
  background: #000 !important;
}

.spb4-wordmark--hero {
  font-size: clamp(1.75rem, 5.8vw, 5.25rem);
}

.spb4-wordmark--nav {
  font-size: clamp(0.75rem, 1.1vw, 1.1rem);
  width: auto;
}

.spb4-wordmark--footer {
  font-size: clamp(1.75rem, 5.5vw, 5.5rem);
}

.spb4-wordmark--nav .spb4-wordmark__left,
.spb4-wordmark--nav .spb4-wordmark__right {
  flex: 0 0 auto;
  padding: 0;
  background: transparent !important;
}

.spb4-wordmark--nav .spb4-wordmark__sep {
  flex: 0 0 auto;
  width: 2px;
  height: 0.82em;
  margin: 0 0.06em;
  padding: 0;
}

/* ——— Akony zones ——— */
.home_nav-top .button_text,
.nav .menu_btn,
.nav .logo_link,
.punch_head,
.swipe_head,
.short_paragraph.mark10-akony,
.large_btn .mark10-btn-text,
.watch_showreel-heading,
.footer .footer_link,
.footer .footer_text,
.footer .menu_text,
.menu .menu_button-text,
.menu .menu-text,
.menu .menu_social-link,
.menu .menu-right_link,
.contact_paragraph.mark10-akony {
  font-family: var(--mark10-akony) !important;
  font-weight: 400 !important;
  letter-spacing: -0.035em;
  text-transform: uppercase;
}

.home_nav-top .button_text {
  font-size: clamp(0.85rem, 1.1vw, 1.05rem);
  letter-spacing: -0.03em;
}

/* ——— B4Flow-style intro copy ——— */
.mark10-intro-text {
  margin: 0;
  font-family: var(--mark10-body) !important;
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 0.98;
  font-size: clamp(1.35rem, 2.8vw, 2.35rem);
  text-transform: none;
}

.mark10-intro-text .mark10-intro-text__brand {
  font-weight: 800;
  letter-spacing: -0.06em;
  white-space: nowrap;
}

/* short_paragraph — same scale as intro */
.short_paragraph.mark10-intro-text {
  width: min(100%, 42rem);
  margin-bottom: 20px;
}

/* swipe descriptions — same as mark10-intro-text, white only */
.swipe_text.mark10-desc-text,
.swipe_text.mark10-desc-text.is-black,
.swipe_text.mobile.mark10-desc-text,
.swipe_text.is-black.mobile.mark10-desc-text {
  margin: 0;
  width: min(100%, 42rem);
  font-family: var(--mark10-body) !important;
  font-weight: 700 !important;
  letter-spacing: -0.045em !important;
  line-height: 0.98 !important;
  font-size: clamp(1.35rem, 2.8vw, 2.35rem) !important;
  text-transform: none !important;
  color: #fff !important;
}

/* жёлтый слайд — чёрный текст */
.swipe_card-last.card-4 .swipe_text.mark10-desc-text,
.swipe_card-last.card-4 .swipe_text.mark10-desc-text.is-black,
.swipe_card-last.card-4 .swipe_text.mobile.mark10-desc-text,
.swipe_card-last.card-4 .swipe_text.is-black.mobile.mark10-desc-text {
  color: #000 !important;
}

.swipe_img-holder,
.contact_image-holder {
  overflow: hidden;
}

/* Swipe: карточки не должны оставаться невидимыми без ScrollTrigger */
@media only screen and (min-width: 991px) {
  [swipe-card] {
    opacity: 1 !important;
    visibility: visible !important;
  }
}

.swipe_card.card-2,
.swipe_card.card-3,
.swipe_card-last.card-4 {
  display: flex;
  flex-direction: column;
}

.swipe_card .container.is-swipe {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}

.swipe_head {
  color: #fff !important;
  position: relative;
  z-index: 2;
}

.swipe_head.is-black {
  color: #000 !important;
}

.swipe_img-holder .image_fill {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 1 !important;
  visibility: visible !important;
}

.swipe_img-holder .spb4-stretch-canvas {
  display: none !important;
}

/* ——— Header: fixed bar + negative blend (вне smooth-content) ——— */
#smooth-wrapper {
  isolation: auto;
}

.nav,
.nav.show-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none;
  z-index: 1000;
  overflow: visible;
  background: transparent !important;
  padding: 1.25rem 1.25em;
  box-sizing: border-box;
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  isolation: auto;
}

.nav > .logo_link {
  width: auto !important;
  max-width: none;
  flex: 0 1 auto;
  position: relative;
  top: auto;
  left: auto;
  z-index: 1001;
  pointer-events: auto;
  background: transparent !important;
  color: #000 !important;
  mix-blend-mode: normal !important;
  filter: none !important;
  -webkit-text-fill-color: #000 !important;
}

.nav > .logo_link * {
  mix-blend-mode: normal !important;
  color: inherit !important;
  -webkit-text-fill-color: currentColor !important;
  background: transparent !important;
}

.nav > .logo_link .spb4-wordmark__left,
.nav > .logo_link .spb4-wordmark__right {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}

.nav > .logo_link .spb4-wordmark__sep {
  background: #000 !important;
}

.nav a,
.nav .menu_btn-holder,
.nav .menu {
  pointer-events: auto;
}

.nav .menu_btn-holder {
  cursor: pointer;
  position: relative;
  top: auto;
  right: auto;
  z-index: 1001;
  flex: 0 0 auto;
  background: transparent !important;
  color: #000 !important;
  mix-blend-mode: normal !important;
  filter: none !important;
  -webkit-text-fill-color: #000 !important;
}

.nav .menu_btn {
  position: static;
  top: auto;
  right: auto;
  z-index: 1002;
  pointer-events: auto;
  background: transparent !important;
  mix-blend-mode: normal !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}

/* Desktop: только .nav в хеддере, hero-wordmark поверх видео */
@media only screen and (min-width: 768px) {
  .home_hero > .home_nav-top {
    display: none !important;
  }

  .home_hero {
    padding-top: 0;
  }

  .home_hero > .container {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    padding-top: clamp(4.5rem, 7vw, 5.75rem);
    position: relative;
    z-index: 2;
  }

  .logo_large-height.is-svg {
    grid-area: 1 / 1;
    z-index: 3;
    align-self: start;
    width: 100%;
    margin: 0 0 clamp(0.75rem, 2vw, 1.25rem);
    padding: 0;
    pointer-events: none;
  }

  .logo_large-height.is-svg .spb4-wordmark--hero,
  .logo_large-height.is-svg .spb4-wordmark--hero .spb4-wordmark__left,
  .logo_large-height.is-svg .spb4-wordmark--hero .spb4-wordmark__right {
    color: #000 !important;
    mix-blend-mode: normal !important;
    filter: none !important;
    background: transparent !important;
    -webkit-text-fill-color: #000 !important;
  }

  .logo_large-height.is-svg .spb4-wordmark--hero .spb4-wordmark__sep {
    background: #000 !important;
    mix-blend-mode: normal !important;
  }

  .home_hero-img-holder {
    grid-area: 1 / 1;
    z-index: 1;
    align-self: stretch;
    min-height: clamp(18rem, 42vw, 34rem);
    margin-top: clamp(3.5rem, 8vw, 6.5rem);
  }

  .spb4-wordmark--nav {
    white-space: nowrap;
    flex-wrap: nowrap;
    line-height: 1;
    font-size: clamp(0.85rem, 1.25vw, 1.2rem) !important;
  }
}

.home_nav-top {
  opacity: 1 !important;
  position: relative;
  z-index: 6;
  background: transparent !important;
}

.home_hero > .home_nav-top {
  pointer-events: auto;
}

.home_nav-top .home_nav_top-link,
.home_nav-top .home_nav_ext-link {
  pointer-events: auto;
  background: transparent !important;
}

.footer .home_nav-top {
  display: none !important;
}

/* Mobile nav links in hero row */
.home_nav-top .button_text {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
  mix-blend-mode: normal !important;
  filter: none !important;
  background: transparent !important;
}

/* Тёмные секции — белый текст */
.nav.is-light > .logo_link,
.nav.is-light > .menu_btn-holder {
  mix-blend-mode: normal !important;
  filter: none !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.nav.is-light > .logo_link .spb4-wordmark__left,
.nav.is-light > .logo_link .spb4-wordmark__right {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

.nav.is-light > .logo_link .spb4-wordmark__sep {
  background: #fff !important;
}

.nav.is-light .menu_btn {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Меню открыто — «закрыть» читаемо на цветном фоне */
.nav .menu_btn-holder:has(.menu_btn.open) {
  mix-blend-mode: normal !important;
  filter: none !important;
  color: #fff !important;
}

.nav .menu_btn.open {
  mix-blend-mode: normal !important;
  filter: none !important;
  color: inherit !important;
}

.nav .menu_btn.open.is-black {
  color: #000 !important;
}

.watch_showreel-heading {
  position: relative;
  z-index: 8;
  color: #fff !important;
  mix-blend-mode: difference !important;
  filter: contrast(1.25);
  background: transparent !important;
}

/* Showreel — видео как было, клик не открывает попап */
.mark10-showreel-holo {
  pointer-events: none;
  cursor: default;
}

.mark10-showreel-holo .watch_showreel-heading {
  pointer-events: none;
}

.watch_showreel-media {
  overflow: hidden;
}

.watch_showreel-media .watch_showreel-img {
  display: none !important;
}

.watch_showreel-media .w-background-video > video {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Hero video: Webflow тянет inset:-100% — сильный зум; возвращаем нормальный cover */
.home_hero-img-holder .background_vid.w-background-video {
  overflow: hidden;
}

.home_hero-img-holder .w-background-video > video {
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center;
  transform: scale(0.92);
  transform-origin: center center;
}

/* view more → все работы */
.large_btn .button_svg-height {
  padding-top: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.large_btn .button_svg {
  display: none !important;
}

.mark10-btn-text {
  font-size: clamp(2.5rem, 5.5vw, 5rem);
  line-height: 0.9;
  text-decoration: underline;
  text-underline-offset: 0.12em;
}

/* punch headline */
.punch_head {
  font-size: clamp(2rem, 4.2vw, 4.25rem) !important;
  line-height: 0.82 !important;
}

/* swipe slide titles (3 cards) */
.swipe_head,
.swipe_head.is-black {
  font-size: clamp(2rem, 4.5vw, 4.5rem) !important;
  line-height: 0.82 !important;
  padding-top: clamp(1.5rem, 3vh, 3rem) !important;
}

/* footer — белый текст на чёрном фоне */
.footer .spb4-wordmark__left,
.footer .spb4-wordmark__right {
  color: #fff !important;
  mix-blend-mode: normal !important;
  filter: none;
}

.footer .spb4-wordmark__sep {
  background: #fff !important;
}

.footer .spb4-wordmark {
  mix-blend-mode: normal !important;
  filter: none;
}

/* hide old svg logos */
.logo_large-height.is-svg svg,
.logo_link svg,
.footer_logo-top svg {
  display: none !important;
}

.logo_link {
  width: auto;
  max-width: 14rem;
}

.logo_large-height.is-svg {
  width: 100%;
  max-width: 100%;
}

.logo_large-height.is-svg .spb4-wordmark--hero {
  max-width: 100%;
}

.mark10-contact-cta,
.mark10-clients-heading {
  font-family: var(--mark10-akony) !important;
  font-weight: 400 !important;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  line-height: 0.88;
}

.mark10-contact-cta {
  display: block;
  font-size: clamp(2.5rem, 6vw, 6.5rem);
  color: currentColor;
}

.large_text-img {
  display: none !important;
}

/* Clients: убрать артефакты stretch-canvas на общем .container */
.home_clients .spb4-stretch-canvas {
  display: none !important;
}

.home_clients .container.spb4-media-frame {
  overflow: visible !important;
}

.mark10-clients-heading {
  font-size: clamp(2rem, 4.5vw, 4.5rem);
  margin: 0 0 0.5rem;
  padding-top: clamp(2rem, 4vw, 4rem);
  line-height: 0.88;
}

.home_clients .clients_small-text {
  margin-bottom: 1.25rem;
}

.home_clients .client_logo-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 14rem;
  max-height: 3.375rem;
  object-fit: contain;
  opacity: 1 !important;
  visibility: visible !important;
}

.home_clients .client_list-holder,
.home_clients .client_row {
  position: relative;
  z-index: 1;
}

.project_thumb_title {
  font-family: var(--mark10-akony) !important;
  font-weight: 400 !important;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.project_thumb_title-client {
  font-family: var(--mark10-body) !important;
  font-weight: 500 !important;
  text-transform: none;
  letter-spacing: -0.02em;
}

@media only screen and (max-width: 991px) {
  .home_swipe {
    height: auto !important;
    overflow: visible !important;
  }

  .swipe_card,
  .swipe_card-last {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .swipe_card.card-1 {
    min-height: 70vh;
  }
}

@media only screen and (max-width: 767px) {
  html,
  body,
  #smooth-wrapper,
  .main-wrapper,
  .content-wrapper {
    overflow-x: clip;
    max-width: 100%;
  }

  /* Дублирующий ряд ссылок в hero — не показываем на мобилке */
  .home_hero > .home_nav-top {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  .home_hero {
    margin-top: 4.25rem !important;
  }

  /* Второй wordmark в hero — только fixed .nav */
  .home_hero > .container > .logo_large-height.is-svg {
    display: none !important;
  }

  .nav,
  .nav.show-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem;
    width: 100% !important;
    max-width: 100vw !important;
    padding: 1rem 1.25rem !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .nav > .menu {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
  }

  .nav > .logo_link {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 6.5rem) !important;
    width: auto !important;
    overflow: hidden !important;
  }

  .nav > .menu_btn-holder {
    flex: 0 0 auto !important;
    margin-left: auto !important;
  }

  .spb4-wordmark--nav {
    width: auto !important;
    max-width: 100% !important;
    font-size: clamp(1.35rem, 7vw, 2.1rem) !important;
    line-height: 0.88 !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }

  .spb4-wordmark--nav .spb4-wordmark__left,
  .spb4-wordmark--nav .spb4-wordmark__sep {
    display: none !important;
  }

  .nav .menu_btn {
    position: static !important;
    top: auto !important;
    right: auto !important;
    font-size: clamp(0.95rem, 4.2vw, 1.25rem) !important;
  }

  .logo_large-height.is-svg {
    padding-top: 0 !important;
    margin-bottom: 0.75rem;
    overflow: hidden;
  }

  .logo_large-height.is-svg .spb4-wordmark--hero {
    font-size: clamp(1.1rem, 8.5vw, 2rem);
    max-width: 100%;
    flex-wrap: wrap;
  }

  .punch_head {
    font-size: clamp(1.35rem, 6.5vw, 2rem) !important;
    line-height: 0.92 !important;
    letter-spacing: -0.04em !important;
  }

  .swipe_head,
  .swipe_head.is-black {
    font-size: clamp(1.45rem, 8vw, 2.4rem) !important;
    line-height: 0.9 !important;
    padding-top: 1rem !important;
  }

  /* swipe: обычный скролл вместо sticky-стека */
  .mark10-intro-text,
  .short_paragraph.mark10-intro-text {
    font-size: clamp(1.1rem, 4.5vw, 1.45rem) !important;
  }

  .video_height .spb4-stretch-canvas {
    display: none !important;
  }

  .video_height.spb4-media-frame img {
    opacity: 1 !important;
    visibility: visible !important;
  }

  .project_thumb_title {
    font-size: clamp(1.1rem, 5vw, 1.5rem) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.03em !important;
    white-space: normal !important;
  }

  .video_detail-holder.mobile {
    flex-wrap: wrap;
    gap: 0.25rem 0.75rem;
  }
}
