/*
 * ВКС — первый экран во всю ширину окна + единая левая линия, v1.5.4.
 * Разработчик: Мосалев Иван.
 * Сохраняем исходную сетку .hero.wrap и высоту блока;
 * расширяются только светлая подложка слева и фото справа.
 */
@media (min-width: 1101px) {
  .hero.wrap {
    /* .wrap после desktop-scale.css = min(100vw - 112px, 1560px). */
    --vks-hero-edge: max(56px, calc((100vw - 1560px) / 2));
    position: relative;
  }

  .hero .hero-copy {
    position: relative;
    background: var(--pale, #f4f7fa);
    /* Align all left-column content with .section-kicker in .wrap sections.
       The full-bleed background is a separate pseudo-element; no offset
       is required on the text column itself. */
    padding-left: 0;
  }

  .hero .hero-copy::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    right: 100%;
    width: var(--vks-hero-edge);
    background: inherit;
    pointer-events: none;
  }

  /* Negative margin grows only the image column to the viewport edge. */
  .hero .hero-visual {
    margin-right: calc(-1 * var(--vks-hero-edge));
  }

  .hero .hero-side-caption {
    font-size: 17px;
    line-height: 1.2;
    letter-spacing: .12em;
    right: clamp(18px, 2vw, 38px);
  }
}

/* At narrower desktop widths, leave the vertical label comfortable margins. */
@media (min-width: 1101px) and (max-width: 1279px) {
  .hero .hero-side-caption { font-size: 15px; letter-spacing: .09em; }
}

/* <= 1100px: keep the existing tablet/mobile layout and its own breakpoints. */

/* Compact desktop / landscape tablet still uses two hero columns.
   Match the shared .wrap content line without changing background behaviour. */
@media (min-width: 921px) and (max-width: 1100px) {
  .hero .hero-copy { padding-left: 0; }
}
