/* Grid + gap: @sem may obfuscate Tailwind grid/gap */
.compact-manifesto-grid {
    display: grid;
    width: 100%;
    gap: 1.5rem;
    grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 768px) {
    .compact-manifesto-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .compact-manifesto-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Badge: w-12 = 3rem — align with v4 (bs had top-0) */
.philosophy-v5-badge-decor {
    top: -2.25rem;
}

.philosophy-compact-badge {
    width: 3rem;
    height: 3rem;
}

.philosophy-bg__img {
    object-fit: cover;
}

.steps-tip-cards__col {
    max-width: 20rem;
}

.steps-tip-cards__badge-circle {
    width: 4rem;
    height: 4rem;
}

.content-col-grow {
    flex: 1 1 0%;
    min-width: 0;
}

.content-base-height {
    display: block;
    width: 100%;
    height: 16rem;
    min-height: 16rem;
    flex-shrink: 0;
    object-fit: cover;
}

/* Layout parity: Bootstrap bs: branch — values match theme/tailwind spacing (see v11 tw:) */
.content-v11-bs--root {
    padding-top: 6rem;
    padding-bottom: 6rem;
}

.content-v11-bs--area {
    max-width: 80rem;
    margin-left: auto;
    margin-right: auto;
}

.content-v11-bs--row {
    gap: 2rem;
}

@media (min-width: 992px) {
    .content-v11-bs--col-copy {
        max-width: 42rem;
    }
}

.content-v11-bs--panel-mb {
    margin-bottom: 2rem;
}

.content-v11-bs--col-visual {
    position: relative;
}

.content-v11-bs--media-back {
    position: absolute;
    top: 10rem;
    left: 1.25rem;
    width: 80%;
    pointer-events: none;
}

.content-v11-bs--media-front {
    position: relative;
    z-index: 10;
    margin-bottom: 5rem;
    margin-left: 2rem;
    width: 50%;
}

/* Bootstrap: сетка + зазор; пропорции как md:w-1/2 и lg: 2/3 + 1/3 */
.values-bento-split__bs-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    width: 100%;
}

@media (min-width: 768px) {
    .values-bento-split__bs-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .values-bento-split__bs-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .values-bento-split__bs-grid .values-bento-split__bs-item--0 {
        grid-column: span 2;
    }

    .values-bento-split__bs-grid .values-bento-split__bs-item--1 {
        grid-column: span 1;
    }

    .values-bento-split__bs-grid .values-bento-split__bs-item--2 {
        grid-column: span 1;
    }

    .values-bento-split__bs-grid .values-bento-split__bs-item--3 {
        grid-column: span 2;
    }
}

.values-bento-split__subtitle-max {
    max-width: 48rem;
}

/* Текст под абсолютным кругом: отступы сильнее, чем были в bs (избегаем перекрытия) */
.values-bento-split__body {
    min-width: 0;
    margin-top: 6rem;
    margin-left: 0;
}

@media (min-width: 768px) {
    .values-bento-split__body {
        margin-top: 2rem;
        margin-left: 6rem;
    }
}

.values-bento-split__thumb {
    width: 4rem;
    height: 4rem;
}

@media (min-width: 768px) {
    .values-bento-split__thumb {
        width: 5rem;
        height: 5rem;
    }
}

.cta-services-split__marquee {
  overflow: hidden;
  pointer-events: none;
  mask-image: linear-gradient(to bottom, black 20%, transparent 95%);
}

.cta-services-split__marquee-inner {
  display: inline-flex;
  align-items: center;
  gap: 3rem;
  white-space: nowrap;
  animation: cta-services-split__marquee 28s linear infinite;
}

@keyframes cta-services-split__marquee {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.cta-services-split__cta {
  transition: filter 0.2s ease, transform 0.15s ease;
}

.cta-services-split__cta:hover,
.cta-services-split__cta:focus-visible {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.cta-services-split__cta:hover .cta-services-split__cta-icon,
.cta-services-split__cta:focus-visible .cta-services-split__cta-icon {
  transform: translate(2px, -2px);
}

.cta-services-split__cta-icon {
  transition: transform 0.2s ease;
}

.cta-services-split__item-hov {
  transition: border-color 0.2s ease, padding-inline-start 0.2s ease;
}

@media (prefers-reduced-motion: reduce) {
  .cta-services-split__marquee-inner {
    animation: none;
  }

  .cta-services-split__cta:hover,
  .cta-services-split__cta:focus-visible {
    transform: none;
  }
}