/* ========================================================
   Seenonim Display Font Integration
   ======================================================== */
@font-face {
  font-family: 'Seenonim';
  src: url('../fonts/seenonim-v1.woff2') format('woff2'),
       url('../fonts/seenonim-v1.otf') format('opentype'),
       url('../fonts/seenonim-v1.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* ========================================================
   Guidy Secondary & Interface Font Integration
   ======================================================== */
@font-face {
  font-family: 'Guidy';
  src: url('../fonts/guidy.woff2') format('woff2'),
       url('../fonts/guidy.otf') format('opentype'),
       url('../fonts/guidy.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --_typography---font-family--headding-font: 'Seenonim', sans-serif !important;
  --font-seenonim: 'Seenonim', sans-serif !important;
  --_typography---font-family--body-font: 'Guidy', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  --_typography---font-family--third-font: 'Guidy', sans-serif !important;
  --_typography---font-family--four-font: 'Guidy', sans-serif !important;
  --font-body: 'Guidy', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

body, html {
  font-family: 'Guidy', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-text-one, .display-text-two, .display-text-three,
.display-six,
.kubik-logo,
.services-counter-cur, .services-counter-all,
.kubik-cases-counter-cur, .kubik-cases-counter-all {
  font-family: 'Seenonim', sans-serif !important;
}

html, body { overflow-x: clip; }
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 96px; }
.kubik-logo { font-weight: 700; letter-spacing: -0.02em; color: currentColor; font-size: 1.25rem; white-space: nowrap; }
.agency-hero-text-image-wrap .h1 { max-width: 100%; }

.agency-hero-text-wrap {
  position: relative !important;
  z-index: 3 !important;
  max-width: 1120px !important;
}
.bg-image-right-wrap,
.bg-image-left-wrap {
  z-index: 1 !important;
  pointer-events: none !important;
}
.agency-hero-fast-text-wrap {
  white-space: nowrap !important;
  flex-wrap: nowrap !important;
}
.agency-hero-fast-text-wrap .h1,
.agency-hero-text-image-wrap .h1 {
  white-space: nowrap !important;
  text-transform: uppercase !important;
  font-size: clamp(19px, 6vw, 92px) !important;
  line-height: 1.05 !important;
}
.agency-hero-image-wrap.one,
.agency-hero-image-wrap.two {
  width: clamp(26px, 4.2vw, 58px) !important;
  height: clamp(26px, 4.2vw, 58px) !important;
  flex-shrink: 0 !important;
}

/* Hero Subtitle Polish */
.agency-dectlies-wrap {
  position: relative !important;
  z-index: 3 !important;
  max-width: 820px !important;
  margin: 22px auto 0 auto !important;
}

.agency-dectlies-wrap .text-default {
  font-size: clamp(16px, 1.25vw, 18.5px) !important;
  line-height: 1.55 !important;
  color: rgba(12, 13, 14, 0.78) !important;
  font-weight: 450 !important;
  letter-spacing: -0.01em !important;
  text-wrap: balance;
}

@media (max-width: 991px) {
  .agency-dectlies-wrap {
    max-width: 660px !important;
    margin-top: 18px !important;
  }
}

@media (max-width: 767px) {
  .agency-dectlies-wrap {
    max-width: 100% !important;
    margin-top: 16px !important;
    padding: 0 12px !important;
  }
  .agency-dectlies-wrap .text-default {
    font-size: 15px !important;
    line-height: 1.48 !important;
  }
}

.featured-collection-list { row-gap: 2rem; }
.featured-work-header-text-dectlies .text-medium { overflow-wrap: anywhere; }
.our-packages-box { min-width: 0; }
#modules { padding-top: clamp(60px, 7vw, 100px) !important; }
.section-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 18px 8px 14px !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  border-radius: 100px !important;
  background: rgba(255, 255, 255, 0.8) !important;
}
.section-label .text-icon-box {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 4px !important;
  flex-shrink: 0 !important;
}
.section-label .text-icon {
  width: 8px !important;
  height: 8px !important;
  display: block !important;
}
.section-label .text-block-name {
  margin: 0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  letter-spacing: 0.03em !important;
  line-height: 1 !important;
  color: #111316 !important;
}
.section-labbal-text-wrap {
  margin-bottom: 16px !important;
}

.kubik-field { width: 100%; }
.kubik-field .emal-text-field { width: 100%; min-height: 52px; }
.kubik-consent { display: flex; align-items: flex-start; gap: 8px; font-size: 13px; line-height: 1.45; opacity: .75; }
.kubik-consent input { margin-top: 3px; flex: 0 0 16px; width: 16px; height: 16px; }
.kubik-consent > span { min-width: 0; }
.kubik-consent a { color: #9c3500; text-decoration: underline; }
.kubik-submit {
  min-height: 54px;
  border: 0;
  border-radius: 100px;
  padding: 0 28px;
  cursor: pointer;
  font: inherit;
  font-weight: 600;
  background: #111316;
  color: #fff;
  justify-self: start;
  transition: all 0.25s ease;
  box-shadow: 0 8px 24px rgba(17, 19, 22, 0.18);
}
.kubik-submit:hover {
  background: #ff5500;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(255, 85, 0, 0.35);
}
.kubik-form-note { font-size: 13px; line-height: 1.5; opacity: .7; max-width: 650px; }
.kubik-legal { padding: 24px 0 4px; font-size: 12px; line-height: 1.5; opacity: .55; }
@media (max-width: 991px) {
  .featured-collection-list { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 767px) {
  .featured-collection-list { grid-template-columns: 1fr; }
  .kubik-submit { width: 100%; }
}

/* Reviews proof screenshots */
.client-stories-screenshot-wrap {
  width: 100%;
  height: 200px;
  border-radius: 14px;
  overflow: hidden;
  margin: 14px 0 16px;
  background: #f0f0f0;
  border: 1px solid rgba(0, 0, 0, 0.08);
}
.client-stories-proof-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}

/* Central hero orbit round avatar */
.hero-intro-meddle-image-wrap,
.single-image-wrap {
  border-radius: 50% !important;
  overflow: hidden !important;
}
.single-image-wrap .cover-size-image,
.single-image-wrap img {
  border-radius: 50% !important;
  overflow: hidden !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
}

/* Black header logo */
.kubik-logo,
.nav-logo-link .kubik-logo,
.w-nav-brand .kubik-logo,
.nav-logo-link,
.w-nav-brand {
  color: #0c0d0e !important;
  font-weight: 800 !important;
  font-size: 1.25rem !important;
  letter-spacing: -0.03em !important;
}

/* Hero Target Lead Pill */
/* Hero Agency Wrapper & Target Lead Pill */
.agency-hero-secend-wrapper {
  align-items: center !important;
  gap: 16px !important;
}
.agency-hero-text-samall-wrap {
  display: inline-flex !important;
  align-items: center !important;
  margin-bottom: 0 !important;
}
.target-lead-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-family: 'Seenonim', sans-serif !important;
  font-size: clamp(14px, 1.8vw, 21px) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  padding: clamp(13px, 1.6vw, 20px) clamp(20px, 2.2vw, 32px) !important;
  border-radius: 20px !important;
  background-image: linear-gradient(167deg, #ff7f00, #f55c36) !important;
  border: 3px solid #ffce0096 !important;
  box-shadow: inset 0 0 20px 0 rgba(255, 206, 0, 0.35), 0 4px 20px 0 rgba(247, 119, 43, 0.3) !important;
  color: #ffffff !important;
  line-height: 1.15 !important;
  text-align: center !important;
  white-space: nowrap !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}
.target-lead-pill:hover {
  transform: translateY(-2px) !important;
  box-shadow: inset 0 0 20px 0 rgba(255, 206, 0, 0.4), 0 6px 26px 0 rgba(247, 119, 43, 0.45) !important;
}
.target-lead-dot {
  display: none !important;
}

@media (max-width: 1280px) {
  .decorated-title-style-wrap {
    transform: translate(0, 8px) rotate(4deg) !important;
  }
}

/* About Section Channel & Card Icons */
.hero-intro-right-wrap {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  gap: 8px !important;
  display: flex !important;
  align-items: center !important;
}
.hero-intro-right-wrap .social-icon-wrap {
  width: 36px !important;
  height: 36px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  padding: 0 !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s ease !important;
}
.hero-intro-right-wrap .social-icon-wrap:hover {
  transform: translateY(-2px) scale(1.08) !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.1) !important;
}
.hero-intro-right-wrap .social-icon-wrap img {
  width: 22px !important;
  height: 22px !important;
  object-fit: contain !important;
}
.hero-intro-card-social-box {
  background: rgba(0, 0, 0, 0.05) !important;
  transition: background .2s ease, transform .2s ease !important;
}
.hero-intro-card-social-wrap:hover .hero-intro-card-social-box {
  background: #000000 !important;
  transform: scale(1.05) !important;
}
.hero-intro-card-social-wrap:hover .hero-intro-card-social-box img {
  filter: brightness(0) invert(1) !important;
}

/* Hide Webflow badge and awkward forehead love-box */
.w-webflow-badge,
.hero-intro-meddle-love-box {
  display: none !important;
}

/* Card subtitle icon & text spacing, and remove card thumbnail images */
.hero-intro-card-image-wrap {
  display: none !important;
}
.hero-intro-card-box {
  padding: 20px 24px !important;
  min-height: 84px !important;
}
.hero-intro-card-image-text-wrap {
  gap: 0 !important;
}
.hero-intro-card-text-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 5px !important;
}
.hero-intro-card-text-wrap .h6 {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin: 0 !important;
}
.hero-intro-card-icon-text-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
}
.hero-intro-card-icon {
  width: 14px !important;
  height: 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.hero-intro-card-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* "5 лет" single-line compact typography */
.hero-intro-left-wrap {
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  gap: 14px !important;
}
.hero-intro-left-wrap .redal-text-wrap {
  width: auto !important;
  max-width: none !important;
  display: inline-flex !important;
  align-items: center !important;
}
.hero-intro-left-wrap .display-text-two {
  font-size: clamp(2.2rem, 3.2vw, 2.75rem) !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  letter-spacing: -0.02em !important;
  text-transform: uppercase !important;
}
.hero-intro-left-wrap .hero-intro-line {
  display: block !important;
  width: 1.5px !important;
  height: 36px !important;
  background-color: rgba(0, 0, 0, 0.15) !important;
  transform: none !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}
.agency-hero-dectlies-box {
  width: auto !important;
  max-width: none !important;
}
.agency-hero-dectlies-box .text-small {
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  font-weight: 500 !important;
  color: rgba(0, 0, 0, 0.72) !important;
}

/* Meta icons: 'практического опыта' and 'Каналы привлечения' */
.kubik-exp-text-wrap,
.kubik-channel-text-wrap {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
}
.kubik-meta-icon {
  width: 14px !important;
  height: 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  opacity: 0.8 !important;
}
.kubik-meta-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* ========================================================
   Preserved Visual Block & Interactive Quiz (#quiz)
   ======================================================== */

/* Hint pill under "Чем занимается бизнес?" */
.our-creators-text-wrap {
  flex-direction: column !important;
  gap: 16px !important;
  max-width: 680px !important;
  z-index: 12 !important;
}
.our-creators-text-wrap .h2 {
  font-size: clamp(32px, 3.8vw, 48px) !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
}

.our-creators-quiz-hint {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  padding: 6px 14px !important;
  border-radius: 100px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #0c0d0e !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05) !important;
  pointer-events: none !important;
}

.our-creators-quiz-hint .hint-pulse {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  background: #ff5d2a !important;
  display: inline-block !important;
  animation: kubikDotPulse 1.8s infinite ease-in-out !important;
}

@keyframes kubikDotPulse {
  0% { transform: scale(0.9); opacity: 0.8; }
  50% { transform: scale(1.3); opacity: 1; }
  100% { transform: scale(0.9); opacity: 0.8; }
}

/* Interactive Card & Pill Hover States */
.our-creators-box {
  cursor: pointer !important;
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease !important;
}

.our-creators-box:hover {
  transform: translateY(-4px) scale(1.02) !important;
}

.our-creators-box:active {
  transform: translateY(-1px) scale(0.99) !important;
}

.our-creators-item-box {
  cursor: pointer !important;
  transition: all 0.22s ease !important;
}

.our-creators-item-box:hover {
  background-color: #0c0d0e !important;
  color: #ffffff !important;
  border-color: #0c0d0e !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
  transform: scale(1.04) !important;
}

.our-creators-item-box:hover .text-medium {
  color: #ffffff !important;
}

.our-creators-item-box:hover img {
  filter: brightness(0) invert(1) !important;
}

/* Positioning for single pill on box-four */
.our-creators-item-box.minis {
  inset: auto -36px -16px auto !important;
}

/* Remove orange outline/border on card click and focus */
.our-creators-box,
.our-creators-box:focus,
.our-creators-box:active,
.our-creators-box:focus-visible,
.our-creators-box.is-selected,
.our-creators-item-box,
.our-creators-item-box:focus,
.our-creators-item-box:active,
.our-creators-item-box:focus-visible,
.crad-all-box div,
.crad-all-box a {
  outline: none !important;
  outline-style: none !important;
  outline-color: transparent !important;
  -webkit-tap-highlight-color: transparent !important;
}

.our-creators-box.is-selected {
  outline: none !important;
}

/* ========================================================
   Quiz Modal & Multi-Step Engine
   ======================================================== */
.kubik-quiz-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
  animation: kubikFadeIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.kubik-quiz-modal.is-active {
  display: flex !important;
}

@keyframes kubikFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.kubik-quiz-modal-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(8, 10, 14, 0.75) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}

.kubik-quiz-modal-card {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 740px !important;
  max-height: min(92vh, 860px) !important;
  overflow-y: auto !important;
  background: #ffffff !important;
  border-radius: 28px !important;
  box-shadow: 0 36px 90px -15px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
  border: none !important;
  padding: 34px 42px 30px !important;
  animation: kubikCardPop 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-sizing: border-box !important;
}

@keyframes kubikCardPop {
  from { transform: scale(0.97) translateY(8px); opacity: 0; }
  to { transform: scale(1) translateY(0); opacity: 1; }
}

/* Header: Back, Sphere Tag, Step count, Close */
.kubik-quiz-modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 14px !important;
}

.kubik-quiz-head-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.kubik-quiz-modal-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #f4f5f7 !important;
  border: 1px solid rgba(0, 0, 0, 0.05) !important;
  border-radius: 100px !important;
  padding: 7px 16px 7px 12px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  line-height: 1 !important;
}

.kubik-quiz-modal-back:hover {
  background: #0f172a !important;
  color: #ffffff !important;
}

.kubik-quiz-tag {
  display: inline-flex !important;
  align-items: center !important;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  color: #334155 !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  padding: 5px 14px !important;
  border-radius: 100px !important;
  letter-spacing: 0.01em !important;
}

.kubik-quiz-head-right {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
}

.kubik-quiz-progress-text {
  font-family: 'Seenonim', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: normal !important;
  color: #94a3b8 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.kubik-quiz-modal-close {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  background: #f1f5f9 !important;
  border: none !important;
  cursor: pointer !important;
  color: #64748b !important;
  line-height: 1 !important;
  transition: all 0.2s ease !important;
}

.kubik-quiz-modal-close:hover {
  background: #0f172a !important;
  color: #ffffff !important;
  transform: rotate(90deg) !important;
}

/* Progress Track */
.kubik-quiz-progress-track {
  width: 100% !important;
  height: 4px !important;
  background: #f1f5f9 !important;
  border-radius: 100px !important;
  overflow: hidden !important;
  margin-bottom: 20px !important;
}

.kubik-quiz-progress-bar {
  height: 100% !important;
  background: linear-gradient(90deg, #ff5500, #ff7a1a) !important;
  border-radius: 100px !important;
  box-shadow: 0 0 10px rgba(255, 85, 0, 0.45) !important;
  transition: width 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Heading & Subtitle in BRAND FONTS */
.kubik-quiz-heading-wrap {
  margin-bottom: 20px !important;
}

.kubik-quiz-question {
  font-family: 'Seenonim', sans-serif !important;
  font-size: clamp(24px, 2.4vw, 29px) !important;
  font-weight: normal !important;
  line-height: 1.25 !important;
  color: #111316 !important;
  letter-spacing: -0.01em !important;
  margin: 0 0 6px 0 !important;
}

.kubik-quiz-desc {
  font-family: 'Guidy', sans-serif !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  color: #64748b !important;
  margin: 0 !important;
}

/* Options List (Airy, spacious, premium) */
.kubik-quiz-options-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.kubik-quiz-opt {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 13px 20px !important;
  background: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 16px !important;
  cursor: pointer !important;
  text-align: left !important;
  font-family: 'Guidy', sans-serif !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-sizing: border-box !important;
  position: relative !important;
}

.kubik-quiz-opt:hover {
  background: #ffffff !important;
  border-color: #ff5500 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 28px -6px rgba(255, 85, 0, 0.14), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}

.kubik-quiz-opt.is-selected {
  background: #0f172a !important;
  border-color: #0f172a !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.25) !important;
}

/* Option Icon Badge */
.kubik-quiz-opt-icon {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.04) !important;
  flex-shrink: 0 !important;
  transition: all 0.2s ease !important;
}

.kubik-quiz-opt-icon svg {
  width: 22px !important;
  height: 22px !important;
  stroke: #0f172a !important;
  transition: stroke 0.2s ease !important;
}

.kubik-quiz-opt:hover .kubik-quiz-opt-icon {
  background: #ff5500 !important;
  border-color: #ff5500 !important;
}

.kubik-quiz-opt:hover .kubik-quiz-opt-icon svg {
  stroke: #ffffff !important;
}

.kubik-quiz-opt.is-selected .kubik-quiz-opt-icon {
  background: rgba(255, 255, 255, 0.16) !important;
  border-color: transparent !important;
}

.kubik-quiz-opt.is-selected .kubik-quiz-opt-icon svg {
  stroke: #ffffff !important;
}

/* Option Text Info */
.kubik-quiz-opt-info {
  flex-grow: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.kubik-quiz-opt-title {
  font-family: 'Guidy', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  line-height: 1.3 !important;
  transition: color 0.2s ease !important;
}

.kubik-quiz-opt:hover .kubik-quiz-opt-title {
  color: #000000 !important;
}

.kubik-quiz-opt.is-selected .kubik-quiz-opt-title {
  color: #ffffff !important;
}

.kubik-quiz-opt-sub {
  font-family: 'Guidy', sans-serif !important;
  font-size: 13.5px !important;
  color: #64748b !important;
  line-height: 1.35 !important;
  font-weight: 400 !important;
  transition: color 0.2s ease !important;
}

.kubik-quiz-opt.is-selected .kubik-quiz-opt-sub {
  color: #94a3b8 !important;
}

/* Option Action / Arrow */
.kubik-quiz-opt-action {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #94a3b8 !important;
  flex-shrink: 0 !important;
  transition: all 0.2s ease !important;
}

.kubik-quiz-opt:hover .kubik-quiz-opt-action {
  background: #ff5500 !important;
  border-color: #ff5500 !important;
  color: #ffffff !important;
  transform: translateX(4px) !important;
}

.kubik-quiz-opt.is-selected .kubik-quiz-opt-action {
  background: #ff5500 !important;
  border-color: #ff5500 !important;
  color: #ffffff !important;
}

/* Step 5: Final Summary Box */
.kubik-quiz-summary-box {
  background: #f8fafc !important;
  border: 1.5px solid #e2e8f0 !important;
  border-radius: 20px !important;
  padding: 20px 24px !important;
  margin-bottom: 22px !important;
}

.kubik-quiz-summary-title {
  font-family: 'Guidy', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #64748b !important;
  margin-bottom: 12px !important;
}

.kubik-quiz-summary-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.kubik-quiz-summary-item {
  font-family: 'Guidy', sans-serif !important;
  font-size: 14px !important;
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  padding: 7px 14px !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.quiz-sum-label {
  color: #64748b !important;
  font-weight: 500 !important;
}

.quiz-sum-val {
  color: #0f172a !important;
  font-weight: 700 !important;
  margin-left: 5px !important;
}

/* Step 5: Lead Form */
.kubik-quiz-lead-form {
  margin-top: 14px !important;
}

.kubik-quiz-input-row {
  display: flex !important;
  gap: 12px !important;
  margin-bottom: 18px !important;
}

.kubik-quiz-input {
  flex-grow: 1 !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 20px !important;
  background: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 16px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 15px !important;
  color: #0f172a !important;
  outline: none !important;
  transition: all 0.2s ease !important;
  box-sizing: border-box !important;
}

.kubik-quiz-input:focus {
  border-color: #ff5500 !important;
  box-shadow: 0 0 0 4px rgba(255, 85, 0, 0.12) !important;
}

.kubik-quiz-submit-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 28px !important;
  background: #ff5500 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 16px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 8px 22px rgba(255, 85, 0, 0.3) !important;
  white-space: nowrap !important;
}

.kubik-quiz-submit-btn:hover {
  background: #e04a00 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 30px rgba(255, 85, 0, 0.4) !important;
}

.kubik-quiz-btn-arrow {
  font-size: 17px !important;
  transition: transform 0.2s ease !important;
}

.kubik-quiz-submit-btn:hover .kubik-quiz-btn-arrow {
  transform: translate(2px, -2px) !important;
}

.kubik-quiz-messenger-choice {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
}

.kubik-quiz-messenger-label {
  font-family: 'Guidy', sans-serif !important;
  font-size: 14px !important;
  color: #64748b !important;
  font-weight: 500 !important;
}

.kubik-quiz-radio {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  cursor: pointer !important;
}

.kubik-quiz-radio input {
  accent-color: #ff5500 !important;
}

.kubik-quiz-form-status {
  padding: 12px 16px !important;
  border-radius: 12px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 14px !important;
  margin-bottom: 12px !important;
}

.kubik-quiz-form-status.is-error {
  background: #fee2e2 !important;
  color: #b91c1c !important;
}

.kubik-quiz-form-status.is-success {
  background: #dcfce7 !important;
  color: #15803d !important;
}

.kubik-quiz-form-sub {
  font-family: 'Guidy', sans-serif !important;
  font-size: 13.5px !important;
  color: #64748b !important;
  text-align: center !important;
  margin-top: 14px !important;
}

@media (max-width: 768px) {
  .kubik-quiz-modal {
    padding: 14px !important;
  }
  .kubik-quiz-modal-head {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px !important;
  }
  .kubik-quiz-head-left {
    min-width: 0;
    gap: 8px !important;
  }
  .kubik-quiz-head-right {
    flex-direction: column;
    gap: 8px !important;
  }
  .kubik-quiz-progress-text {
    white-space: nowrap;
    font-size: 11px !important;
  }
  .kubik-quiz-modal-card {
    padding: 24px 20px 22px !important;
    border-radius: 24px !important;
    max-height: calc(100vh - 28px) !important;
    max-height: calc(100dvh - 28px) !important;
  }
  .kubik-quiz-question {
    font-size: 23px !important;
  }
  .kubik-quiz-opt {
    padding: 12px 16px !important;
    gap: 12px !important;
  }
  .kubik-quiz-opt-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
  }
  .kubik-quiz-opt-title {
    font-size: 15px !important;
  }
  .kubik-quiz-opt-sub {
    font-size: 12.5px !important;
  }
  .kubik-quiz-input-row {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .kubik-quiz-submit-btn {
    width: 100% !important;
  }
}

/* Quiz section cards reveal and dispersion polish (#quiz) */
@media (min-width: 992px) {
  .our-creators-section .crad-all-box {
    will-change: opacity, transform, filter;
    transform-origin: center center;
    transition: none !important;
  }
}

@media screen and (max-width: 991px) {
  .our-creators-all-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    height: auto !important;
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }
  .our-creators-text-wrap {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    margin: 0 auto 32px auto !important;
    width: 100% !important;
    text-align: center !important;
    z-index: 5 !important;
  }
  .our-creators-text-wrap .h2 {
    font-size: clamp(28px, 4vw, 38px) !important;
    line-height: 1.15 !important;
  }
  .our-creators-section .crad-all-box {
    position: relative !important;
    height: auto !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    gap: 20px !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    pointer-events: auto !important;
  }
  .our-creators-box {
    max-width: 320px !important;
    margin: 0 auto !important;
  }
  .our-creators-image-wrap {
    max-width: 100% !important;
    height: 220px !important;
  }
}

/* Mobile responsive for quiz modal and cards */
@media (max-width: 767px) {
  .our-creators-item-box.minis {
    inset: auto auto -16px 0 !important;
  }
  .kubik-quiz-options-grid {
    grid-template-columns: 1fr !important;
  }
  .kubik-quiz-input-row {
    flex-direction: column !important;
  }
  .kubik-quiz-submit-btn {
    width: 100% !important;
  }
  .kubik-quiz-modal-card {
    padding: 20px 16px !important;
    border-radius: 20px !important;
  }
}

/* ==========================================================================
   Comprehensive Landing Polish Overrides (18 Targeted Fixes)
   ========================================================================== */

/* 1. Services Section Heading & Width */
#services .text-creats-wrap {
  display: block !important;
  grid-template-columns: none !important;
  max-width: 1080px !important;
  width: 100% !important;
}
#services .creators-text-wrap {
  max-width: 100% !important;
}
#services h2.h3 {
  font-size: clamp(26px, 3.2vw, 42px) !important;
  line-height: 1.25 !important;
  max-width: 100% !important;
}


/* 2. Offer / Accent Transition Section removed by user request */






/* 3. Cases Section styles consolidated in Section 3 below (line ~1450+) */
.kubik-case-structured-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: rgba(0, 0, 0, 0.72) !important;
}
.kubik-case-detail-row {
  display: block !important;
}
.kubik-case-lbl {
  font-weight: 700 !important;
  color: #0c0d0e !important;
}
.kubik-case-stats-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 8px !important;
}
.kubik-case-stat-badge {
  background: rgba(0, 0, 0, 0.05) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  padding: 4px 10px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #0c0d0e !important;
}

/* 4. Analytics & Fit Dynamic Pills Grid */
#fit .our-work-grdden-image-text-wrapper {
  position: relative !important;
  min-height: 380px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

#fit .our-work-grdden-text-wrapper {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  min-height: 380px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

#analytics .our-work-grdden-image-text-wrapper {
  position: relative !important;
  min-height: 430px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

#analytics .our-work-grdden-text-wrapper {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  min-height: 430px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  padding: 30px 20px !important;
}
.kubik-analytics-pills-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.kubik-pill {
  background: #ffffff !important;
  color: #0c0d0e !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08) !important;
  border: 1.5px solid transparent !important;
  white-space: nowrap !important;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s ease !important;
}
.kubik-pill:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12) !important;
}
.kubik-pill.pill-green {
  border-color: rgba(34, 197, 94, 0.3) !important;
  color: #15803d !important;
}
.kubik-pill.pill-red {
  border-color: rgba(239, 68, 68, 0.25) !important;
  color: #b91c1c !important;
}
.kubik-pill.pill-blue {
  border-color: rgba(59, 130, 246, 0.25) !important;
  color: #1d4ed8 !important;
}
.kubik-pill.pill-gray {
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: #374151 !important;
}

/* 5. Process Section Heading */
#process h2.h2 {
  font-size: clamp(26px, 3.2vw, 42px) !important;
  line-height: 1.25 !important;
  margin-bottom: 24px !important;
}

/* 6. Support Guarantee Cards Grid */
.kubik-support-cards-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 18px !important;
  width: 100% !important;
  margin-top: 24px !important;
}
@media (max-width: 991px) {
  .kubik-support-cards-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 575px) {
  .kubik-support-cards-grid {
    grid-template-columns: 1fr !important;
  }
}
.kubik-support-card {
  background: #0c0d0e !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 20px !important;
  padding: 28px 24px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14) !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
}
.kubik-support-card:hover {
  transform: translateY(-4px) !important;
  border-color: #ff5d2a !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.25) !important;
}
.kubik-support-card-num {
  display: none !important;
}
.kubik-support-card-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}
.kubik-support-card-desc {
  font-size: 14px !important;
  color: rgba(255, 255, 255, 0.72) !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}

/* 7. Reports Screenshots Overlay Badges */
.worked-image-box {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 18px !important;
}
.kubik-report-badge {
  position: absolute !important;
  bottom: 12px !important;
  left: 12px !important;
  right: 12px !important;
  background: rgba(12, 13, 14, 0.88) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-radius: 12px !important;
  padding: 10px 14px !important;
  color: #ffffff !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
  pointer-events: none !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
.kubik-report-badge-niche {
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: rgba(255, 255, 255, 0.6) !important;
  font-weight: 700 !important;
}
.kubik-report-badge-result {
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
}

/* 8. Pricing Section Container & Cards Equalization */
#pricing .w-layout-blockcontainer.container,
#modules .w-layout-blockcontainer.container {
  max-width: 1280px !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}
#pricing .our-packages-wrapper,
#modules .our-packages-wrapper {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  align-items: stretch !important;
}
@media (max-width: 991px) {
  #pricing .our-packages-wrapper,
  #modules .our-packages-wrapper {
    grid-template-columns: 1fr !important;
  }
}
/* Consolidated into Section 7 & 8 below */


/* FAQ section removed per user request */




/* ========================================================
   KUBIK.DM 2.0 VISUAL & FUNCTIONAL OVERHAUL
   ======================================================== */

/* 0. Global Typography (Guidy for readable interface text, Seenonim for display) */
body, html, p, button, a, input, textarea, select,
.text-default, .text-small, .text-medium, .text-mediums,
.nav-link, .services-header-desc, .faq-item,
.kubik-service-pill, .kubik-case-tag, .our-creators-quiz-hint {
  font-family: 'Guidy', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Ensure Seenonim priority for headings, logo, pill text */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.display-text-one, .display-text-two, .display-text-three,
.display-six,
.kubik-logo,
.target-lead-pill, .target-lead-text,
.services-counter-cur, .services-counter-all,
.kubik-cases-counter-cur, .kubik-cases-counter-all {
  font-family: 'Seenonim', sans-serif !important;
}

/* 1. Quiz Cards (#quiz) - Full Card Interactivity */
.our-creators-box,
.our-creators-image-wrap {
  cursor: pointer !important;
}
.our-creators-box:hover .our-creators-image-wrap img {
  transform: scale(1.05) !important;
}
.our-creators-image-wrap img {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.our-creators-item-icon img {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
}

/* 2. Services Section (#services) - Bullets & Slider Polish */
#services .slide-creators-wrapper {
  height: 100% !important;
  min-height: 590px !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
#services .slide-creators-wrap {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
}
#services .slide-creators-text-wrapper {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
#services .slide-creators-text-wrap .h5 {
  letter-spacing: -0.015em !important;
  word-spacing: 0.08em !important;
  line-height: 1.25 !important;
  margin-top: 10px !important;
  margin-bottom: 14px !important;
}
#services .slide-creators-text-dectlies-wrap p.text-default.rbg8 {
  font-size: 15px !important;
  line-height: 1.55 !important;
  color: #4b5563 !important;
  margin-bottom: 16px !important;
}
#services .slide-creators-text-dectlies-wrap p.text-default.rbg8 strong {
  color: #111827 !important;
  font-weight: 700 !important;
  background: rgba(255, 93, 42, 0.08) !important;
  padding: 1px 3px !important;
  border-radius: 4px !important;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.kubik-service-bullets {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-top: 14px !important;
}
.kubik-service-pill {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #1f2937 !important;
  line-height: 1.45 !important;
  backdrop-filter: none !important;
}
.kubik-service-pill::before {
  content: "";
  display: block;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 4.5L6.75 12.75L3 9' stroke='%23111827' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: 1px;
}
#services .slide-creators-button-wrap {
  margin-top: 20px !important;
}
#services .slide-creators-button-wrap {
  margin-top: 20px !important;
}

/* ============================================================
   SERVICES SECTION (#services) - SLIDER ARROWS & HEADER NAV
   ============================================================ */
.services-header-row {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
}
.services-header-text {
  max-width: 820px !important;
}
.services-header-desc {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
  font-size: clamp(14px, 1.2vw, 16px) !important;
  color: rgba(17, 24, 39, 0.65) !important;
  line-height: 1.5 !important;
}
.services-header-nav {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
  background: #ffffff !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04) !important;
}
.services-nav-arrow {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: #0c0d0e !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  padding: 0 !important;
  line-height: 1 !important;
}
.services-nav-arrow:hover {
  background: #ff5d2a !important;
  border-color: #ff5d2a !important;
  transform: scale(1.06) !important;
}
.services-nav-arrow:active {
  transform: scale(0.95) !important;
}
.services-nav-counter {
  font-family: 'Guidy', -apple-system, sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  padding: 0 8px !important;
  letter-spacing: -0.01em !important;
  min-width: 58px !important;
  text-align: center !important;
  user-select: none !important;
}
.services-counter-cur {
  color: #ff5d2a !important;
  font-weight: 800 !important;
}
.services-counter-sep {
  color: rgba(0, 0, 0, 0.25) !important;
  margin: 0 3px !important;
}
.services-counter-all {
  color: rgba(0, 0, 0, 0.5) !important;
}

/* Align services slider to the left edge of container instead of centering */
.services-mask {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Hide duplicate bottom slider arrows per user request; navigation is handled by header controls */
#services .kubik-services-arrow,
#services .left-arrow.w-slider-arrow-left,
#services .right-arrow.w-slider-arrow-right {
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  display: none !important;
}

@media (max-width: 991px) {
  .services-header-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }
  .services-header-nav {
    align-self: flex-start !important;
  }
}

/* 3. Cases Section (#cases) - Horizontal Scroll & Header */
.featured-work-section-custom {
  position: relative !important;
  padding: 80px 0 60px !important;
  overflow: hidden !important;
}
.featured-work-header-custom {
  margin-bottom: 36px !important;
}
.featured-work-title-row {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 0 !important;
}
.featured-work-title-col {
  max-width: 760px !important;
}
.featured-work-title-col .h2 {
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.2 !important;
  margin-bottom: 8px !important;
}
.featured-work-nav-arrows,
.kubik-reports-nav-arrows {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
}
/* ========================================================
   Fix Webflow capitalize bug on all badges and labels
   ======================================================== */
.text-block-name,
.text-block-name:where(.w-variant-0e6766d8-b805-913b-d4e9-8050c5c31653) {
  text-transform: none !important;
}

/* ========================================================
   3. Cases Section (#cases) - Authentic Relab Style & Seenonim Typography
   ======================================================== */
.featured-work-section-custom {
  position: relative !important;
  padding: 72px 0 60px !important;
  overflow: hidden !important;
}

#cases .featured-work-header-custom {
  margin-bottom: 24px !important;
}

.featured-work-title-row {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.featured-work-title-col {
  max-width: 860px !important;
}

.featured-work-title-col .h2 {
  font-family: 'Seenonim', sans-serif !important;
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.18 !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 8px !important;
  color: #0c0d0e !important;
}

.featured-work-title-col .text-default {
  font-size: 16px !important;
  line-height: 1.55 !important;
  color: #64748b !important;
  margin-bottom: 0 !important;
}

/* Hide scrollbar completely - clean presentation without gray lines */
#cases .featured-collection-list::-webkit-scrollbar,
#cases .featured-work-wrap .featured-collection-list::-webkit-scrollbar,
.featured-collection-list::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

#cases .featured-collection-list,
#cases .featured-work-wrap .featured-collection-list,
.featured-collection-list {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

#cases .featured-work-wrap .featured-collection-list {
  display: flex !important;
  flex-flow: row nowrap !important;
  overflow-x: auto !important;
  scroll-snap-type: none !important;
  gap: 24px !important;
  padding: 12px 6px 20px 6px !important;
  margin: 0 !important;
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;
  align-items: stretch !important;
}

/* Individual Case Card - Generous Width & Native Template Proportions */
#cases .featured-collection-list > .w-dyn-item {
  flex: 0 0 420px !important;
  width: 420px !important;
  max-width: 420px !important;
  min-width: 0 !important;
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
}

#cases .featured-work-card-box {
  width: 100% !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  border-radius: 32px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  padding: 32px 30px 28px 30px !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.04) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s ease, border-color 0.28s ease !important;
}

#cases .featured-work-card-box:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.09) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
}

#cases .featured-work-card-text-box {
  padding: 0 !important;
  margin: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
  gap: 0 !important;
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Header with Number and Category badge */
#cases .featured-work-header-text-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  width: 100% !important;
}

#cases .kubik-case-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: #f4f5f8 !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 9999px !important;
  padding: 7px 16px !important;
  font-size: 13.5px !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
  max-width: calc(100% - 40px) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#cases .kubik-case-tag .kubik-case-num {
  font-family: 'Seenonim', sans-serif !important;
  font-weight: 700 !important;
  color: #0c0d0e !important;
  font-size: 15px !important;
  flex-shrink: 0 !important;
}

#cases .kubik-case-tag .kubik-case-sep {
  opacity: 0.3 !important;
  font-weight: 600 !important;
  flex-shrink: 0 !important;
}

#cases .kubik-case-tag .kubik-case-category {
  font-weight: 600 !important;
  color: #374151 !important;
  font-size: 13.5px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

#cases .featured-work-header-text-icon-wrap {
  flex-shrink: 0 !important;
}

#cases .featured-work-header-text-name h3.h4 {
  font-family: 'Seenonim', sans-serif !important;
  font-size: 23px !important;
  line-height: 1.25 !important;
  font-weight: 700 !important;
  color: #0c0d0e !important;
  margin-top: 16px !important;
  margin-bottom: 12px !important;
  letter-spacing: -0.01em !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  min-height: 58px !important;
}

#cases .featured-work-header-text-dectlies {
  flex: 0 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

#cases .kubik-case-structured-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

#cases .kubik-case-detail-row {
  font-size: 14.5px !important;
  line-height: 1.55 !important;
  color: #4b5563 !important;
  margin: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

#cases .kubik-case-lbl {
  font-size: 14.5px !important;
  font-weight: 700 !important;
  color: #111827 !important;
  margin-right: 4px !important;
}

/* Organic Metrics Pills (Matching Site Aesthetic, NOT a dry dashboard) */
#cases .kubik-case-stats-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-top: 14px !important;
}

#cases .kubik-stat-item {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px !important;
  background: #f6f7fa !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 9999px !important;
  padding: 6px 14px !important;
  transition: background 0.2s ease, transform 0.2s ease !important;
}

#cases .kubik-stat-item:hover {
  background: #eef1f6 !important;
  transform: translateY(-1px) !important;
}

#cases .kubik-stat-label {
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #64748b !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  line-height: 1.2 !important;
}

#cases .kubik-stat-label::after {
  content: ':';
}

#cases .kubik-stat-val {
  font-family: 'Seenonim', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  color: #0c0d0e !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
  letter-spacing: -0.01em !important;
}

/* Remove button */
#cases .featured-work-card-button-wrap {
  display: none !important;
}

/* High-impact, elegant case preview image */
#cases .featured-work-card-image-box {
  margin-top: 18px !important;
  width: 100% !important;
  height: 220px !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  background: #f8fafc !important;
  flex-shrink: 0 !important;
}

#cases .featured-work-card-image-wrap {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  cursor: zoom-in !important;
}

#cases .featured-work-card-image-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#cases .featured-work-card-image-wrap:hover img {
  transform: scale(1.04) !important;
}

/* Bottom Navigation Controls */
.kubik-cases-nav-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 16px !important;
  margin-top: 32px !important;
  margin-bottom: 0 !important;
}

.kubik-cases-nav-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  color: #0c0d0e !important;
  cursor: pointer !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.kubik-cases-nav-btn:hover {
  background: #0c0d0e !important;
  color: #ffffff !important;
  border-color: #0c0d0e !important;
  transform: translateY(-2px) scale(1.04) !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16) !important;
}

.kubik-cases-nav-btn:active {
  transform: scale(0.94) !important;
}

.kubik-cases-nav-counter {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'Seenonim', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #0c0d0e !important;
  padding: 8px 22px !important;
  border-radius: 9999px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.04) !important;
  letter-spacing: 0.02em !important;
}

.kubik-cases-counter-cur {
  color: #0c0d0e !important;
  min-width: 22px !important;
  text-align: center !important;
}

.kubik-cases-counter-sep {
  opacity: 0.35 !important;
}

.kubik-cases-counter-all {
  color: #6b7280 !important;
}

@media (max-width: 767px) {
  .featured-work-section-custom {
    padding: 44px 0 28px !important;
  }
  #cases .featured-collection-list > .w-dyn-item {
    flex: 0 0 88vw !important;
    width: 88vw !important;
    max-width: 88vw !important;
  }
  #cases .featured-work-card-box {
    padding: 24px 20px 20px 20px !important;
    border-radius: 24px !important;
  }
  #cases .featured-work-header-text-name h3.h4 {
    font-size: 20px !important;
    min-height: auto !important;
  }
  #cases .featured-work-card-image-box {
    height: 180px !important;
    border-radius: 16px !important;
  }
  .featured-work-title-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 8px !important;
  }
}

/* 4. Analytics Block (#analytics) - Broad Header & White Modern Status Badges */
.capabilities-section {
  overflow: hidden !important;
}
#analytics .capabilities-text-wrapper {
  max-width: 960px !important;
  width: 100% !important;
}
#analytics .capabilities-text-wrapper .h2,
#analytics .kubik-analytics-h2 {
  max-width: 860px !important;
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.025em !important;
  margin-top: 0 !important;
}
@media (max-width: 479px) {
  #analytics .capabilities-text-wrapper .h2,
  #analytics .kubik-analytics-h2 {
    font-size: 20px !important;
    line-height: 1.25 !important;
  }
}

/* Cards: Сквозная аналитика & Как принимается решение */
#analytics .our-work-image-text-wrapper {
  border-radius: 24px !important;
  overflow: hidden !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  min-height: 430px !important;
  background: #111214 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 16px 40px -12px rgba(0, 0, 0, 0.3) !important;
}

#analytics .our-work-image-wrap.kubik-3d-stage {
  flex: 1 1 auto !important;
  min-height: 230px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px 28px 8px !important;
  position: relative !important;
  background:
    radial-gradient(ellipse at 50% 36%, rgba(255, 93, 42, 0.20), transparent 56%),
    linear-gradient(180deg, #1c1e21 0%, #111214 100%) !important;
}

@keyframes kubikFloat3D {
  0%, 100% {
    transform: translateY(-4px) rotate(0deg);
  }
  50% {
    transform: translateY(-11px) rotate(1deg);
  }
}

#analytics .our-work-image-wrap .kubik-3d-asset {
  max-height: 200px !important;
  width: auto !important;
  max-width: 88% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: translateY(-4px) !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  animation: kubikFloat3D 6.5s ease-in-out infinite alternate !important;
}

#analytics .our-work-image-text-wrapper:hover .our-work-image-wrap .kubik-3d-asset {
  animation-play-state: paused !important;
  transform: translateY(-14px) scale(1.04) !important;
}

#analytics .our-work-text-wrap {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  padding: 14px 30px 28px !important;
  background: #111214 !important;
  flex-shrink: 0 !important;
}

#analytics .our-work-text-wrap .h5.white {
  font-family: 'Seenonim', sans-serif !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 10px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

#analytics .our-work-text-wrap .h5.white::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #ff5d2a;
  flex-shrink: 0;
  box-shadow: 0 0 10px rgba(255, 93, 42, 0.6);
}

#analytics .our-work-text-wrap .text-default.white {
  font-family: 'Guidy', -apple-system, "system-ui", "Segoe UI", Roboto, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: rgba(255, 255, 255, 0.78) !important;
  max-width: 500px !important;
  margin: 0 !important;
}

#analytics .our-work-image-bg-wrap {
  display: none !important;
}

@media (max-width: 991px) {
  #analytics .our-work-image-text-wrapper,
  #analytics .our-work-grdden-image-text-wrapper {
    min-height: 420px !important;
  }
  #analytics .our-work-grdden-text-wrapper {
    min-height: 420px !important;
  }
  #analytics .our-work-image-wrap.kubik-3d-stage {
    min-height: 210px !important;
    padding: 20px 20px 8px !important;
  }
  #analytics .our-work-image-wrap .kubik-3d-asset {
    max-height: 175px !important;
    max-width: 85% !important;
  }
  #analytics .our-work-text-wrap {
    padding: 14px 22px 24px !important;
  }
  #analytics .our-work-text-wrap .h5.white {
    font-size: 19px !important;
  }
}

@media (max-width: 479px) {
  #analytics .our-work-image-text-wrapper,
  #analytics .our-work-grdden-image-text-wrapper {
    min-height: 400px !important;
  }
  #analytics .our-work-grdden-text-wrapper {
    min-height: 400px !important;
  }
  #analytics .our-work-image-wrap.kubik-3d-stage {
    min-height: 190px !important;
    padding: 18px 16px 6px !important;
  }
  #analytics .our-work-image-wrap .kubik-3d-asset {
    max-height: 160px !important;
    max-width: 85% !important;
  }
  #analytics .our-work-text-wrap {
    padding: 12px 18px 22px !important;
  }
  #analytics .our-work-text-wrap .h5.white {
    font-size: 18px !important;
  }
  #analytics .our-work-text-wrap .text-default.white {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }
}

/* Floating Status Pills - Lightweight 60FPS Zero-Lag Performance */
.kubik-scattered-cloud {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 380px !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* Pause all animations when section is off-screen (saves 100% CPU/GPU) */
#analytics:not(.in-view) .kubik-cloud-pill,
#analytics:not(.in-view) .kubik-pill-marker::after,
#analytics:not(.in-view) .kubik-3d-asset {
  animation-play-state: paused !important;
}

#analytics .our-work-grdden-image-text-wrapper {
  transition: box-shadow 0.3s ease !important;
}
#analytics .our-work-grdden-image-text-wrapper:hover {
  box-shadow: 0 16px 36px -8px rgba(255, 93, 42, 0.14) !important;
}

/* Pure solid white pill - crisp contrast, 0 GPU blur penalty */
.kubik-cloud-pill {
  position: absolute !important;
  pointer-events: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 13px 22px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #0c0d0e !important;
  font-family: 'Guidy', -apple-system, sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  box-shadow: 0 10px 24px -2px rgba(12, 13, 14, 0.09), 0 3px 8px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease !important;
  white-space: nowrap !important;
  user-select: none !important;
  overflow: hidden !important;
}

/* Instant hover sheen on compositor thread (0 background cost) */
.kubik-cloud-pill::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.7), transparent);
  transform: skewX(-20deg);
  pointer-events: none;
  transition: transform 0.5s ease;
  z-index: 1;
}

.kubik-cloud-pill:hover::before {
  transform: skewX(-20deg) translateX(360px);
}

.kubik-cloud-pill:hover {
  transform: translateY(-3px) !important;
  border-color: #ff5d2a !important;
  box-shadow: 0 16px 32px rgba(255, 93, 42, 0.16), 0 4px 10px rgba(0, 0, 0, 0.06) !important;
  z-index: 30 !important;
}

/* Status Dot with Target Pulse on conversion goals only */
.kubik-pill-marker {
  position: relative !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  display: inline-block !important;
  flex-shrink: 0 !important;
  z-index: 2 !important;
}

.kubik-pill-marker.green::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: 50%;
  background: inherit;
  opacity: 0.7;
  pointer-events: none;
  animation: kubikPillPing 2.8s cubic-bezier(0, 0, 0.2, 1) infinite;
}

.kubik-cloud-pill:nth-child(1) .kubik-pill-marker.green::after { animation-delay: 0s; }
.kubik-cloud-pill:nth-child(6) .kubik-pill-marker.green::after { animation-delay: 1.4s; }

@keyframes kubikPillPing {
  0% { transform: scale(1); opacity: 0.75; }
  65%, 100% { transform: scale(2.8); opacity: 0; }
}

.kubik-pill-marker.green {
  background: #10b981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.18);
}
.kubik-pill-marker.orange {
  background: #ff5d2a;
  box-shadow: 0 0 0 3px rgba(255, 93, 42, 0.18);
}
.kubik-pill-marker.blue {
  background: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.18);
}
.kubik-pill-marker.red {
  background: #ef4444;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.18);
}
.kubik-pill-marker.gray {
  background: #9ca3af;
  box-shadow: 0 0 0 3px rgba(156, 163, 175, 0.18);
}

/* 6 Smooth Composite-Only Float Trajectories (Hardware-Accelerated) */
@keyframes kubikFloat1 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -7px, 0); }
}
@keyframes kubikFloat2 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -9px, 0); }
}
@keyframes kubikFloat3 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -6px, 0); }
}
@keyframes kubikFloat4 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -8px, 0); }
}
@keyframes kubikFloat5 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -5px, 0); }
}
@keyframes kubikFloat6 {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -7px, 0); }
}

.kubik-cloud-pill.float-1 { animation: kubikFloat1 4.4s ease-in-out infinite !important; }
.kubik-cloud-pill.float-2 { animation: kubikFloat2 5.2s ease-in-out infinite !important; }
.kubik-cloud-pill.float-3 { animation: kubikFloat3 4.8s ease-in-out infinite !important; }
.kubik-cloud-pill.float-4 { animation: kubikFloat4 5.6s ease-in-out infinite !important; }
.kubik-cloud-pill.float-5 { animation: kubikFloat5 4.6s ease-in-out infinite !important; }
.kubik-cloud-pill.float-6 { animation: kubikFloat6 5.0s ease-in-out infinite !important; }

@media (max-width: 991px) {
  .kubik-cloud-pill {
    padding: 11px 18px !important;
    font-size: 11.5px !important;
    gap: 8px !important;
  }
}

/* Mobile: Disable all animations for zero battery drain and smooth scrolling */
@media (max-width: 479px) {
  .kubik-cloud-pill {
    padding: 9px 14px !important;
    font-size: 10px !important;
    letter-spacing: 0.02em !important;
    gap: 7px !important;
    animation: none !important;
    transform: none !important;
  }
  .kubik-pill-marker {
    width: 7px !important;
    height: 7px !important;
  }
  .kubik-pill-marker.green::after {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kubik-cloud-pill,
  .kubik-cloud-pill::before,
  .kubik-pill-marker::after,
  #analytics .our-work-image-wrap .kubik-3d-asset {
    animation: none !important;
    transform: none !important;
  }
}

/* 5. Support Block (#support) - 2-Line Header & Dark Cards without Numbers */
#support .our-partners-text-wrapper {
  margin-bottom: 36px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-end !important;
  gap: 32px !important;
}
#support .our-partners-text-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 12px !important;
  max-width: 820px !important;
  width: auto !important;
  flex: 1 1 auto !important;
}
#support .our-partners-button-wrap {
  flex-shrink: 0 !important;
}
#support .redal-text-wrap.our-read {
  display: none !important; /* Hide giant broken display-01 block */
}
#support .our-partners-text-wrap .h2,
#support .kubik-support-h2 {
  font-size: clamp(26px, 3.2vw, 42px) !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.025em !important;
  color: #0c0d0e !important;
  margin: 0 !important;
}
@media (min-width: 768px) {
  #support .kubik-support-h2 .accent-orange {
    white-space: nowrap !important;
  }
}
@media (max-width: 479px) {
  #support .our-partners-text-wrap .h2,
  #support .kubik-support-h2 {
    font-size: 22px !important;
    line-height: 1.22 !important;
  }
}
#support .kubik-support-h2 .accent-orange {
  color: #ff5d2a !important;
}

/* Dark Support Cards */
#support .kubik-support-card {
  padding: 28px 24px !important;
  border-radius: 20px !important;
  background: #0c0d0e !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
#support .kubik-support-card:hover {
  transform: translateY(-4px) !important;
  border-color: #ff5d2a !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.24) !important;
}
#support .kubik-support-card-num {
  display: none !important; /* User request: remove numbers from cards */
}
#support .kubik-support-card-title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.35 !important;
  margin: 0 !important;
}
#support .kubik-support-card-desc {
  font-size: 14px !important;
  line-height: 1.55 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  margin: 0 !important;
}
#support .kubik-support-card-icon {
  display: block !important;
  width: 112px !important;
  height: 112px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  align-self: center !important;
  flex: 0 0 auto !important;
  margin: 0 auto 2px !important;
}

/* 6. Reports Block (#reports) - Clean Header, No Ghost Numbers, Rock-Solid Hover */
#reports {
  overflow: hidden !important;
  position: relative !important;
}

.kubik-reports-header-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}

.kubik-reports-nav-arrows {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

.kubik-reports-nav-arrows button,
.kubik-cases-arrow {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 0, 0, 0.12) !important;
  background: #ffffff !important;
  color: #111316 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  transition: all 0.22s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
  padding: 0 !important;
}
.kubik-reports-nav-arrows button:hover,
.kubik-cases-arrow:hover {
  background: #111316 !important;
  color: #ffffff !important;
  border-color: #111316 !important;
  transform: scale(1.05) !important;
}
.kubik-reports-nav-arrows button:active,
.kubik-cases-arrow:active {
  transform: scale(0.96) !important;
}

/* Fallback: Hide hints, background ghost numbers, and bottom text */
.kubik-reports-hint,
.kubik-reports-controls-bar,
.big-text-wrap,
#reports .big-text-wrap,
#reports .big-text,
#reports .text-dectli-wrap,
#reports .worked-text-dectlies-wrap {
  display: none !important;
}

/* Marquee track and wrapper */
.worked-image-wrapper {
  min-height: 640px !important;
  padding-bottom: 40px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}
.worked-image-wrapper::-webkit-scrollbar {
  display: none !important;
}

#reports .worked-image-wrap:hover {
  animation-play-state: paused !important;
}

/* Report cards: rock-solid layout, NO transform on hover to prevent jumping bug! */
#reports .worked-image-box {
  width: 540px !important;
  max-width: 540px !important;
  height: 330px !important;
  aspect-ratio: 16 / 10 !important;
  cursor: zoom-in !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35) !important;
  transition: box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
  margin-right: 24px !important;
  flex-shrink: 0 !important;
  position: relative !important;
}

/* Hover: DO NOT touch transform of .worked-image-box because Webflow staggered classes
   (.worked-image-one = translate(0, 130px), .worked-image-three = translate(0, 250px))
   would be overridden/reset, causing a violent 256px vertical jump!
   Instead, illuminate border & glow, and gently zoom the inner image */
#reports .worked-image-box:hover {
  border-color: rgba(255, 93, 42, 0.7) !important;
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.55), 0 0 24px rgba(255, 93, 42, 0.22) !important;
}

#reports .worked-image-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
  will-change: transform;
}

#reports .worked-image-box:hover img {
  transform: scale(1.03) !important;
}

@media (max-width: 767px) {
  .worked-image-wrapper {
    min-height: 520px !important;
    padding-bottom: 24px !important;
  }
  #reports .worked-image-box {
    width: 86vw !important;
    max-width: 86vw !important;
    height: 220px !important;
  }
}

/* 7. Unified Global H2 Headings & Left-Aligned Section Headers */
h2,
.h2,
#services h2,
#services .h2,
#services h2.h3,
#cases h2,
#cases .h2,
#analytics h2,
#analytics .h2,
#process h2,
#process .h2,
#support h2,
#support .h2,
#reports h2,
#reports .h2,
#pricing h2,
#pricing .h2,
#modules h2,
#modules .h2,
#reviews h2,
#reviews .h2,
#contact h2,
#contact .h2,
#contact .cta-text-wrap .h4.white,
.campaign-packages-header-wrap .h2,
.featured-work-title-col .h2,
.our-creators-text-wrap .h2 {
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.22 !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
  text-align: left !important;
}

/* Force left alignment on all section headers */
.campaign-packages-header-wrap,
.campaign-packages-header-wrap.kubik-wide-header,
.kubik-reviews-header-wrap,
#pricing .campaign-packages-header-wrap,
#modules .campaign-packages-header-wrap,
#reviews .kubik-reviews-header-wrap {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 0 36px 0 !important;
  text-align: left !important;
  align-items: flex-start !important;
}

.campaign-packages-header-wrap .section-labbal-text-wrap,
.kubik-reviews-header-wrap .section-labbal-text-wrap,
#pricing .section-labbal-text-wrap,
#modules .section-labbal-text-wrap,
#reviews .section-labbal-text-wrap {
  display: flex !important;
  justify-content: flex-start !important;
  width: 100% !important;
  margin-bottom: 14px !important;
}

.campaign-packages-header-wrap .h2,
.kubik-reviews-header-wrap .h2,
.h2.center {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Reviews Header Row (Left-aligned title + right-aligned controls) */
.kubik-reviews-header-row {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: 100% !important;
}
.kubik-reviews-header-col {
  flex: 1 !important;
  text-align: left !important;
}
.kubik-reviews-header-col .h2 {
  margin: 0 0 8px 0 !important;
}
@media (max-width: 767px) {
  .kubik-reviews-header-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }
}
#pricing .our-packages-wrapper,
#modules .our-packages-wrapper {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 26px !important;
  align-items: stretch !important;
}
@media (max-width: 991px) {
  #pricing .our-packages-wrapper,
  #modules .our-packages-wrapper {
    grid-template-columns: 1fr !important;
  }
}

/* Unified Solid Cards for Pricing & Modules (Eliminating separate split box gap) */
#pricing .our-packages-box,
#modules .our-packages-box {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  height: 100% !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 28px !important;
  padding: 34px 28px 30px 28px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03) !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.28s ease !important;
  box-sizing: border-box !important;
  position: relative !important;
}
#pricing .our-packages-box:hover,
#modules .our-packages-box:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.07) !important;
  border-color: rgba(0, 0, 0, 0.14) !important;
}
/* Main featured package (Комплекс под ключ) subtle premium accent */
#pricing .our-packages-box:first-child {
  border-color: rgba(255, 93, 42, 0.32) !important;
  box-shadow: 0 8px 28px rgba(255, 93, 42, 0.05), 0 2px 10px rgba(0, 0, 0, 0.02) !important;
}

/* Reset inner floating widgets inside unified card */
#pricing .our-packages-text-wrapper,
#modules .our-packages-text-wrapper {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}
#pricing .our-packages-text-namber-wrap,
#modules .our-packages-text-namber-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 12px !important;
}

/* Pricing Header: White-space nowrap to prevent ₽ symbol wrap */
#pricing .plans-pricing-wrapper,
#modules .plans-pricing-wrapper {
  display: flex !important;
  align-items: baseline !important;
  gap: 10px !important;
  margin-top: 0 !important;
  margin-bottom: 22px !important;
  flex-wrap: nowrap !important;
}
#pricing .plans-pricing-wrapper h4.h4 {
  font-size: clamp(28px, 2.5vw, 36px) !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  white-space: nowrap !important;
  margin: 0 !important;
  color: #111316 !important;
}
#pricing .plans-pricing-wrapper .text-default {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: rgba(17, 19, 22, 0.55) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
#modules .plans-pricing-wrapper h4.h4 {
  font-size: clamp(21px, 2vw, 28px) !important;
  line-height: 1.1 !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  white-space: nowrap !important;
  margin: 0 !important;
  color: #111316 !important;
}
#modules .plans-pricing-wrapper .text-default {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: rgba(17, 19, 22, 0.55) !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}

/* Feature Checklist Section inside unified card */
#pricing .plans-pricing-item-wrapper,
#modules .plans-pricing-item-wrapper {
  background: transparent !important;
  border: none !important;
  border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: none !important;
  padding: 22px 0 0 0 !important;
  margin: 0 !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
#pricing .plans-pricing-item-name-wrap,
#modules .plans-pricing-item-name-wrap {
  margin-bottom: 18px !important;
}
#pricing .plans-pricing-item-name-wrap .text-medium,
#modules .plans-pricing-item-name-wrap .text-medium {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  color: #111316 !important;
}
#pricing .plans-pricing-item-wrap,
#modules .plans-pricing-item-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin-bottom: 24px !important;
}
#pricing .plans-pricing-item-box,
#modules .plans-pricing-item-box {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}
#pricing .plans-pricing-item-icon-wrap,
#modules .plans-pricing-item-icon-wrap {
  flex-shrink: 0 !important;
  width: 20px !important;
  height: 20px !important;
  margin-top: 0 !important;
}
#pricing .plans-pricing-item-text-wrap .text-default,
#modules .plans-pricing-item-text-wrap .text-default {
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: rgba(17, 19, 22, 0.72) !important;
}
#pricing .plans-pricing-item-button-wrap,
#modules .plans-pricing-item-button-wrap {
  margin-top: auto !important;
  width: 100% !important;
}
#pricing .plans-pricing-item-button-wrap .button,
#modules .plans-pricing-item-button-wrap .button {
  width: 100% !important;
  justify-content: center !important;
}

/* 8. Reviews Section (#reviews) - Clean Native Light Packaging */
#reviews .loved-by-creators-wrapper {
  margin-bottom: 24px !important;
}
#reviews .our-clients-say-icon-wrap {
  display: none !important;
}
.kubik-reviews-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}
@media (max-width: 767px) {
  .kubik-reviews-controls {
    justify-content: flex-start !important;
  }
}
.kubik-reviews-counter {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: rgba(17, 19, 22, 0.6) !important;
  letter-spacing: 0.04em !important;
}
.kubik-reviews-counter span {
  color: #111316 !important;
  font-weight: 700 !important;
}
.kubik-reviews-nav-btns {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.kubik-reviews-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  background: #ffffff !important;
  color: #111316 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.22s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}
.kubik-reviews-btn:hover {
  background: #111316 !important;
  color: #ffffff !important;
  border-color: #111316 !important;
  transform: scale(1.05) !important;
}
.kubik-reviews-btn:active {
  transform: scale(0.96) !important;
}

/* Reviews Showcase Horizontal Track */
#reviews .client-stories-wrapper {
  width: 100% !important;
  overflow: visible !important;
  position: relative !important;
}
#reviews .client-stories-wrap {
  display: flex !important;
  flex-flow: row nowrap !important;
  overflow-x: auto !important;
  scroll-snap-type: x mandatory !important;
  gap: 20px !important;
  padding: 12px 4px 32px 4px !important;
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin !important;
}
#reviews .client-stories-wrap::-webkit-scrollbar {
  height: 6px !important;
}
#reviews .client-stories-wrap::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.04) !important;
  border-radius: 10px !important;
}
#reviews .client-stories-wrap::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18) !important;
  border-radius: 10px !important;
}
#reviews .client-stories-wrap::-webkit-scrollbar-thumb:hover {
  background: #ff5d2a !important;
}

/* Native White Review Card - Full Uncropped Screenshots */
.kubik-review-card {
  flex: 0 0 310px !important;
  min-width: 280px !important;
  max-width: 320px !important;
  scroll-snap-align: start !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 24px !important;
  padding: 10px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  cursor: zoom-in !important;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.28s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.28s ease !important;
  position: relative !important;
}
.kubik-review-card:hover {
  transform: translateY(-6px) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.09) !important;
  border-color: rgba(0, 0, 0, 0.16) !important;
}

/* Full Natural-Size Screenshot Frame (No Cropping) */
.kubik-review-screenshot-box {
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  display: block !important;
}
.kubik-review-screenshot-box img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: unset !important;
  display: block !important;
  transition: transform 0.35s ease !important;
}
.kubik-review-card:hover .kubik-review-screenshot-box img {
  transform: scale(1.015) !important;
}
.kubik-review-zoom-pill {
  position: absolute !important;
  bottom: 12px !important;
  right: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 100px !important;
  padding: 5px 11px !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
  color: #111316 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  pointer-events: none !important;
  opacity: 0.92 !important;
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}
.kubik-review-card:hover .kubik-review-zoom-pill {
  opacity: 1 !important;
  transform: scale(1.04) !important;
}

@media (max-width: 767px) {
  .kubik-review-card {
    flex: 0 0 78vw !important;
    min-width: 270px !important;
    max-width: 320px !important;
    padding: 8px !important;
    border-radius: 20px !important;
  }
  .kubik-review-screenshot-box {
    height: auto !important;
    border-radius: 14px !important;
  }
  .kubik-review-screenshot-box img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
  }
}

/* ========================================================
   9. Final Contact CTA Banner (#contact) - Flawless Dark Card
   ======================================================== */
#contact.cta-section {
  padding: 0 !important;
  background: transparent !important;
}
#contact .cta-wrapper {
  background-color: var(--color--white) !important;
  border-top-left-radius: 36px !important;
  border-top-right-radius: 36px !important;
  padding: 64px 32px 24px !important;
}
#contact .cta-wrap.kubik-contact-grid {
  display: grid !important;
  grid-template-columns: 1.2fr 0.8fr !important;
  align-items: center !important;
  gap: 48px !important;
  padding: 56px 56px !important;
  border-radius: 32px !important;
  background: #0d0f12 linear-gradient(135deg, #181b20 0%, #0d0f12 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45) !important;
  box-sizing: border-box !important;
}

/* Remove Webflow nested black box glitch */
#contact .cta-text-wrapper {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  min-height: auto !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important;
  gap: 24px !important;
}
#contact .cta-text-wrap {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
#contact .cta-text-wrap .h4.white {
  font-family: 'Seenonim', sans-serif !important;
  font-size: clamp(28px, 3.2vw, 42px) !important;
  line-height: 1.18 !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  margin: 0 !important;
  color: #ffffff !important;
}
#contact .cta-text-wrap .text-default.rgb-5 {
  font-size: 16px !important;
  line-height: 1.55 !important;
  color: rgba(255, 255, 255, 0.72) !important;
  margin: 0 !important;
  max-width: 540px !important;
}
.kubik-cta-features {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 6px 0 4px !important;
}
.kubik-cta-feat-pill {
  font-size: 14.5px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.94) !important;
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 100px !important;
  padding: 6px 18px 6px 8px !important;
  width: fit-content !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
  transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease !important;
}
.kubik-cta-feat-pill:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 93, 42, 0.35) !important;
  transform: translateX(3px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25), 0 0 16px rgba(255, 93, 42, 0.12) !important;
}
.kubik-cta-feat-icon-wrap {
  width: 30px !important;
  height: 30px !important;
  border-radius: 50% !important;
  background: rgba(255, 93, 42, 0.14) !important;
  border: 1px solid rgba(255, 93, 42, 0.32) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 12px rgba(255, 93, 42, 0.16) !important;
}
.kubik-cta-feat-icon-wrap img,
.kubik-cta-feat-icon-wrap svg {
  width: 17px !important;
  height: 17px !important;
  object-fit: contain !important;
  display: block !important;
}
#contact .cta-text-button-wrap {
  width: auto !important;
  margin-top: 4px !important;
}
#contact .cta-text-button-wrap .button {
  background: #ffffff !important;
  color: #0d0f12 !important;
  border-radius: 100px !important;
  min-height: 52px !important;
  padding: 0 8px 0 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 14px !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  text-decoration: none !important;
  border: none !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.2) !important;
}
#contact .cta-text-button-wrap .button .button-text-wrap,
#contact .cta-text-button-wrap .button .button-hover-text,
#contact .cta-text-button-wrap .button .button-normal-text {
  color: #0d0f12 !important;
}
#contact .cta-text-button-wrap .button:hover {
  background: #ff5500 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 25px rgba(255, 85, 0, 0.35) !important;
}
#contact .cta-text-button-wrap .button:hover .button-hover-text,
#contact .cta-text-button-wrap .button:hover .button-normal-text {
  color: #ffffff !important;
}
#contact .cta-text-button-wrap .button .button-icon-box {
  background: #0d0f12 !important;
  border-radius: 50% !important;
  width: 38px !important;
  height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.2s ease !important;
}
#contact .cta-text-button-wrap .button:hover .button-icon-box {
  background: #ffffff !important;
}
#contact .cta-text-button-wrap .button:hover .button-icon {
  filter: invert(1) !important;
}

#contact .cta-image-wrap {
  width: 100% !important;
  max-width: 380px !important;
  height: auto !important;
  aspect-ratio: 4 / 4.8 !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5) !important;
  margin: 0 auto !important;
}
#contact .cta-image-wrap img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center top !important;
  display: block !important;
}

@media (max-width: 991px) {
  #contact .cta-wrapper {
    padding: 40px 16px 20px !important;
  }
  #contact .cta-wrap.kubik-contact-grid {
    grid-template-columns: 1fr !important;
    gap: 36px !important;
    padding: 40px 24px !important;
    text-align: left !important;
  }
  #contact .cta-image-wrap {
    max-width: 340px !important;
  }
}

@media (max-width: 480px) {
  #contact .cta-wrap.kubik-contact-grid {
    padding: 32px 18px !important;
    border-radius: 24px !important;
  }
  #contact .cta-text-button-wrap {
    width: 100% !important;
  }
  #contact .cta-text-button-wrap .button {
    width: 100% !important;
    justify-content: space-between !important;
    padding: 0 8px 0 18px !important;
    font-size: 14px !important;
    box-sizing: border-box !important;
  }
  .kubik-cta-feat-pill {
    font-size: 13.5px !important;
    padding: 6px 12px !important;
  }
}

/* ========================================================
   10. Footer Section (#footer) - Balanced, Beautiful Layout
   ======================================================== */
#footer.footer-section {
  padding: 0 !important;
  background: transparent !important;
}
#footer .footer-wrapper {
  background-color: var(--color--white) !important;
  border-bottom-left-radius: 36px !important;
  border-bottom-right-radius: 36px !important;
  padding: 24px 32px 48px !important;
}
#footer .footer-top-text-wrapper {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 28px !important;
  margin-bottom: 32px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
  gap: 32px !important;
}
#footer .footer-logo-wrap {
  display: flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
#footer .footer-logo-wrap img {
  width: auto !important;
  max-width: 160px !important;
  height: auto !important;
}
#footer .footer-top-text-wrap {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 20px !important;
  max-width: 100% !important;
}
#footer .text-footer-header-wrap {
  font-family: 'Seenonim', sans-serif !important;
  font-size: clamp(18px, 1.8vw, 23px) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.01em !important;
  color: #111316 !important;
  text-align: right !important;
}
#footer .footer-from-button-wrap {
  display: none !important;
}

/* Footer Bottom Layout: Form (Left) & Navigation (Right) */
#footer .footer-icon-link-wrapper {
  display: grid !important;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr) !important;
  gap: 48px !important;
  align-items: start !important;
  padding-top: 0 !important;
  border-top: none !important;
}

/* Left Column: Form & Socials */
#footer .footer-social-wrapper {
  min-width: 0;
  max-width: 100% !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* Lead Form Card */
#footer .w-form {
  width: 100% !important;
  background: #f8f9fa !important;
  border: 1px solid rgba(0, 0, 0, 0.07) !important;
  border-radius: 24px !important;
  padding: 32px 32px 28px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
  box-sizing: border-box !important;
}
#footer .kubik-form {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}
#footer .kubik-form label.header-six {
  font-family: 'Guidy', -apple-system, sans-serif !important;
  font-size: 19px !important;
  font-weight: 600 !important;
  color: #111316 !important;
  margin-bottom: 2px !important;
  letter-spacing: -0.01em !important;
}
#footer .kubik-field {
  width: 100% !important;
  margin: 0 !important;
}
#footer .emal-text-field.w-input {
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  border-radius: 14px !important;
  border: 1.5px solid rgba(0, 0, 0, 0.12) !important;
  background: #ffffff !important;
  padding: 0 18px !important;
  font-size: 14.5px !important;
  color: #111316 !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease !important;
}
#footer .emal-text-field.w-input::placeholder {
  color: rgba(0, 0, 0, 0.42) !important;
  font-size: 14px !important;
}
#footer .emal-text-field.w-input:focus {
  border-color: #ff5500 !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(255, 85, 0, 0.12) !important;
  outline: none !important;
}

/* Checkbox & Consent */
#footer .kubik-consent {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: #555555 !important;
  margin: 2px 0 4px !important;
  cursor: pointer !important;
}
#footer .kubik-consent input {
  margin-top: 2px !important;
  width: 16px !important;
  height: 16px !important;
  accent-color: #ff5500 !important;
  cursor: pointer !important;
}

/* Submit Button - HIGH CONTRAST & BEAUTIFUL HOVER */
#footer .kubik-submit {
  padding: 12px 20px;
  white-space: normal;
  line-height: 1.35;
  width: 100% !important;
  min-height: 54px !important;
  border: none !important;
  border-radius: 100px !important;
  background: #111316 !important;
  color: #ffffff !important;
  font-size: 15.5px !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 8px 24px rgba(17, 19, 22, 0.18) !important;
  margin-top: 4px !important;
}
#footer .kubik-submit:hover {
  background: #ff5500 !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 28px rgba(255, 85, 0, 0.35) !important;
}
#footer .kubik-submit:active {
  transform: translateY(0) !important;
}

/* Response time note */
#footer .kubik-form-note {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #666666 !important;
  text-align: center !important;
  margin-top: 4px !important;
}

/* Social buttons below the form */
#footer .footer-social-wrapper > div:last-child {
  min-width: 0;
  order: 1 !important;
  width: 100% !important;
}
#footer .footer-social-wrap {
  order: 2 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 12px !important;
  margin-top: 12px !important;
  padding: 0 4px !important;
}
#footer .footer-social-wrap::before {
  content: "Быстрая связь напрямую:";
  font-size: 13.5px !important;
  font-weight: 500 !important;
  color: #666666 !important;
  margin-right: 6px !important;
}
#footer .footer-social-wrap .footer-social-link-wrap {
  margin: 0 !important;
}
#footer .footer-social-wrap .icon-button {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: #111316 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s ease !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
}
#footer .footer-social-wrap .icon-button:hover {
  background: #ff5500 !important;
  border-color: #ff5500 !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(255, 85, 0, 0.35) !important;
}
#footer .footer-social-wrap .icon-button img {
  width: 20px !important;
  height: 20px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  display: block !important;
}

/* Right Column: 3 Link Blocks */
#footer .footer-link-wrapper {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 28px !important;
  padding-top: 8px !important;
}
#footer .link-wrapper {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}
#footer .link-wrapper .text-name-link {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #888888 !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin-bottom: 2px !important;
}
#footer .link-wrap {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}
#footer .link-wrap a.text-button {
  font-size: 15px !important;
  color: #222222 !important;
  text-decoration: none !important;
  padding: 0 !important;
  transition: color 0.2s ease !important;
  display: block !important;
}
#footer .link-wrap a.text-button:hover {
  color: #ff5500 !important;
}
#footer .link-wrap a.text-button .text-button-normal-text {
  color: inherit !important;
  font-weight: 500 !important;
}
#footer .link-wrap a.text-button .text-button-hover-text {
  display: none !important;
}

/* Legal / Copyright Bottom Bar */
#footer .kubik-legal {
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
  margin-top: 48px !important;
  padding: 24px 0 0 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: #888888 !important;
  text-align: center !important;
  opacity: 1 !important;
}

@media (max-width: 991px) {
  #footer .footer-wrapper {
    padding: 24px 16px 36px !important;
  }
  #footer .footer-top-text-wrapper {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
  }
  #footer .text-footer-header-wrap {
    text-align: left !important;
  }
  #footer .footer-icon-link-wrapper {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 36px !important;
  }
  #footer .footer-link-wrapper {
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
  }
}
@media (max-width: 600px) {
  #footer .footer-link-wrapper {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  #footer .w-form {
    padding: 24px 18px 20px !important;
  }
  #footer .emal-text-field.w-input {
    font-size: 16px !important;
  }
}

/* 10. Global Lightbox Modal (#kubik-lightbox) */
.kubik-lightbox-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
  display: none;
  align-items: center !important;
  justify-content: center !important;
}
.kubik-lightbox-modal.is-open {
  display: flex !important;
}
.kubik-lightbox-backdrop {
  position: absolute !important;
  inset: 0 !important;
  background: rgba(0, 0, 0, 0.88) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
.kubik-lightbox-dialog {
  position: relative !important;
  z-index: 10 !important;
  max-width: 90vw !important;
  max-height: 90vh !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}
.kubik-lightbox-close {
  position: absolute !important;
  top: -48px !important;
  right: 0 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  font-size: 20px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
}
.kubik-lightbox-close:hover {
  background: #ff5d2a !important;
  border-color: #ff5d2a !important;
}
.kubik-lightbox-nav {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 50px !important;
  height: 50px !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  font-size: 24px !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
  z-index: 12 !important;
}
.kubik-lightbox-nav:hover {
  background: #ff5d2a !important;
  border-color: #ff5d2a !important;
  transform: translateY(-50%) scale(1.08) !important;
}
.kubik-lightbox-nav.prev { left: -70px !important; }
.kubik-lightbox-nav.next { right: -70px !important; }
@media (max-width: 900px) {
  .kubik-lightbox-nav.prev { left: 10px !important; }
  .kubik-lightbox-nav.next { right: 10px !important; }
}
.kubik-lightbox-content {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.kubik-lightbox-content img {
  max-width: 86vw !important;
  max-height: 82vh !important;
  object-fit: contain !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.6) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
}
.kubik-lightbox-caption {
  margin-top: 14px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: rgba(255, 255, 255, 0.75) !important;
  text-align: center !important;
}

/* ========================================================
   Fixed Sticky Header on Scroll
   ======================================================== */
.header-section {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  pointer-events: none !important;
}

.header-section .navbar {
  position: relative !important;
  width: 100% !important;
  background-color: transparent !important;
  pointer-events: none !important;
}

.header-section .nav-content-wrap,
.header-section .container {
  pointer-events: none !important;
}

.header-section .nav-inner {
  pointer-events: auto !important;
  background: rgba(255, 255, 255, 0.9) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.85) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.07), 0 1px 2px rgba(0, 0, 0, 0.04) !important;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.header-section .nav-inner.nav-scrolled {
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.11), 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.95) !important;
}

.header-section .nav-inner a,
.header-section .nav-inner button,
.header-section .nav-button-wrap,
.header-section .menu-button,
.header-section .nav-logo-link,
.header-section .nav-manus-wrapper,
.header-section .nav-menu-wrap,
.header-section .menu-wrapper {
  pointer-events: auto !important;
}

@media (max-width: 991px) {
  .header-section .nav-menu-wrap {
    pointer-events: auto !important;
    max-height: calc(100vh - 90px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.12) !important;
  }
}



/* Unified transparent 3D image stages for process, quiz, services and analytics */
.kubik-3d-asset {
  display: block;
  object-fit: contain !important;
  object-position: center center !important;
}
.kubik-3d-stage {
  background:
    radial-gradient(ellipse at 52% 40%, rgba(255, 93, 42, 0.10), transparent 48%),
    linear-gradient(145deg, #fbfaf8 0%, #eeece9 100%);
}
#analytics .kubik-3d-stage {
  background:
    radial-gradient(ellipse at 50% 38%, rgba(255, 93, 42, 0.20), transparent 48%),
    linear-gradient(145deg, #292b2e 0%, #111214 100%);
}
#quiz .our-creators-box:hover .our-creators-image-wrap .kubik-3d-asset {
  transform: scale(1.01) translateY(-0.5%) !important;
}

/* Remove legacy green badges and "Подробнее" pills from services 3D cards */
.slide-creators-image-text-wrap,
.slide-creators-image-love-wrap {
  display: none !important;
}

/* ========================================================
   Process Section: Heading Alignment & Balanced Line Breaks
   ======================================================== */
#process .card-slider-text-wrapper {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 480px) !important;
  gap: 32px !important;
}

#process .our-process-header-text-wrap {
  max-width: 620px !important;
  width: 100% !important;
}

#process h2.h2 {
  font-size: clamp(24px, 2.5vw, 31px) !important;
  line-height: 1.25 !important;
  letter-spacing: -0.015em !important;
  font-weight: 700 !important;
  margin-bottom: 0 !important;
}

#process .process-h2-d-block {
  display: block !important;
  white-space: nowrap !important;
}

@media (max-width: 1200px) and (min-width: 992px) {
  #process .card-slider-text-wrapper {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 440px) !important;
    gap: 24px !important;
  }
  #process h2.h2 {
    font-size: clamp(22px, 2.3vw, 27px) !important;
  }
  .process-slider-mask {
    max-width: 440px !important;
  }
}

@media (max-width: 991px) {
  #process .card-slider-text-wrapper {
    grid-template: auto / 1fr !important;
  }
  #process h2.h2 {
    font-size: clamp(20px, 4vw, 26px) !important;
  }
}

@media (max-width: 480px) {
  #process h2.h2 {
    font-size: clamp(17.5px, 5.1vw, 21px) !important;
    line-height: 1.22 !important;
  }
}

/* ========================================================
   Process Section: 3D Stage & Interactive Card Flipping
   ======================================================== */
.process-slider {
  overflow: visible !important;
  position: relative !important;
}

.process-slider-mask {
  height: 550px !important;
  max-height: 550px !important;
  max-width: 480px !important;
  margin-left: auto !important;
  overflow: visible !important;
  position: relative !important;
  perspective: 1200px !important;
  perspective-origin: 50% 50% !important;
}

.box-teams-seven-wrapper {
  height: 535px !important;
  max-width: 450px !important;
  transform-origin: center bottom !important;
}

.box-teams-eight-wrapper {
  height: 520px !important;
  max-width: 420px !important;
  transform-origin: center bottom !important;
}

/* Absolute stack alignment for all slides */
.process-slider .slide-wrap.w-slide {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  transform-style: preserve-3d !important;
  backface-visibility: hidden !important;
  margin: 0 !important;
  will-change: transform, opacity;
  transform-origin: 20% 70% !important;
}

/* Slide visibility and interaction states */
.process-slider .slide-wrap.w-slide:not(.is-active):not(.is-animating) {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: 1 !important;
}

.process-slider .slide-wrap.w-slide.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 5 !important;
}

.process-slider .slide-wrap.w-slide.is-animating {
  visibility: visible !important;
  pointer-events: none !important;
}

.process-slider .slide-wrap.w-slide.is-peeling {
  z-index: 10 !important;
}

.process-slider .slide-wrap.w-slide.is-rising {
  z-index: 4 !important;
}

.process-slider .slide-wrap.w-slide.is-swooping {
  z-index: 10 !important;
}

.process-slider .slide-wrap.w-slide.is-dropping {
  z-index: 3 !important;
}

/* Photorealistic gloss/glare sheen on card peel */
.kubik-card-sheen {
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  background: linear-gradient(115deg, transparent 20%, rgba(255, 255, 255, 0.45) 50%, transparent 80%) !important;
  pointer-events: none !important;
  opacity: 0;
  z-index: 10 !important;
  mix-blend-mode: overlay;
  transition: opacity 0.25s ease;
}

.our-process-image-text-box {
  height: 550px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  background: #ffffff !important;
  border-radius: 28px !important;
  padding: 24px 28px 24px 28px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28) !important;
  border: 1px solid rgba(255, 255, 255, 0.4) !important;
  position: relative !important;
  user-select: none !important;
}

/* 1. Header bar */
.our-process-namber-text-wrap {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  margin-bottom: 6px !important;
  flex-shrink: 0 !important;
}

.kubik-process-badge {
  display: inline-flex !important;
  align-items: center !important;
  background: rgba(255, 93, 42, 0.08) !important;
  color: #ff5d2a !important;
  padding: 5px 14px !important;
  border-radius: 100px !important;
  font-family: "Guidy", sans-serif !important;
  font-weight: 600 !important;
  font-size: 13.5px !important;
  letter-spacing: -0.01em !important;
  border: 1px solid rgba(255, 93, 42, 0.2) !important;
}

.kubik-process-counter {
  font-family: "Seenonim", sans-serif !important;
  font-size: 20px !important;
  color: rgba(20, 21, 23, 0.25) !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
}

/* 2. Middle 3D showcase stage */
.our-process-image-wrap {
  position: relative !important;
  flex: 1 !important;
  width: 100% !important;
  min-height: 230px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 6px 10px !important;
  background: radial-gradient(circle at 50% 50%, rgba(255, 93, 42, 0.07) 0%, rgba(0, 0, 0, 0.02) 45%, transparent 70%) !important;
  border-radius: 18px !important;
  margin: 4px 0 8px 0 !important;
}

.our-process-image-wrap img.kubik-3d-asset {
  position: relative !important;
  max-height: 235px !important;
  max-width: 92% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: center center !important;
  filter: drop-shadow(0 16px 30px rgba(0, 0, 0, 0.14)) !important;
  transition: transform 0.4s ease !important;
}

.our-process-image-text-box:hover .our-process-image-wrap img.kubik-3d-asset {
  transform: translateY(-4px) scale(1.02) !important;
}

/* 3. Bottom text details */
.our-process-text-dectlies-wrap {
  display: flex !important;
  flex-direction: column !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(20, 21, 23, 0.07) !important;
  margin-top: auto !important;
  flex-shrink: 0 !important;
}

.kubik-process-card-title {
  font-family: "Seenonim", sans-serif !important;
  font-size: 22px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  color: #141517 !important;
  margin: 0 0 6px 0 !important;
  letter-spacing: -0.01em !important;
}

.kubik-process-card-desc {
  font-family: "Guidy", sans-serif !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  color: rgba(20, 21, 23, 0.72) !important;
  font-weight: 400 !important;
  margin: 0 !important;
}

/* Tactile Navigation Buttons */
.perigon-button-wrap {
  cursor: pointer !important;
  user-select: none !important;
  transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, box-shadow 0.22s ease !important;
}
.perigon-button-wrap:hover {
  transform: translateY(-2px) scale(1.03) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2) !important;
}
.perigon-button-wrap:active {
  transform: translateY(1px) scale(0.95) !important;
}

/* Mobile & Tablet Adaptations */
@media (max-width: 767px) {
  .process-slider-mask {
    height: 520px !important;
    max-height: 520px !important;
    max-width: 100% !important;
  }
  .box-teams-seven-wrapper {
    height: 505px !important;
    max-width: 94% !important;
  }
  .box-teams-eight-wrapper {
    height: 490px !important;
    max-width: 88% !important;
  }
  .our-process-image-text-box {
    height: 100% !important;
    min-height: 520px !important;
    padding: 20px 20px 22px 20px !important;
  }
  .our-process-image-wrap {
    min-height: 200px !important;
  }
  .our-process-image-wrap img.kubik-3d-asset {
    max-height: 190px !important;
  }
}

/* Keep the hero promise readable on the narrowest phones. */
@media (max-width: 375px) {
  .agency-hero-text-wrap .target-lead-pill {
    box-sizing: border-box !important;
    max-width: calc(100vw - 32px) !important;
    padding: 12px 14px !important;
    white-space: normal !important;
  }
}

/* Keep primary controls usable on touch screens. */
@media (max-width: 991px) {
  .header-section .menu-button {
    box-sizing: border-box !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

.kubik-quiz-modal-close {
  box-sizing: border-box !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  flex: 0 0 44px !important;
}

.kubik-lightbox-close {
  width: 44px !important;
  height: 44px !important;
}

.header-section .menu-button:focus-visible,
#quiz .our-creators-box:focus-visible {
  outline: 3px solid #ff5d2a !important;
  outline-offset: 4px !important;
}

/* Honeypot fields stay out of the layout while remaining in the form payload. */
.kubik-honeypot {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
  pointer-events: none;
}


/* Keep the full hero promise in the H1 without changing the two-line visual design. */
.kubik-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  margin: -1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Mobile tap-targets: расширяем зону нажатия до 44px, не меняя внешний вид. */
@media (max-width: 767px) {
  .nav-logo-link,
  .tab-link,
  .social-icon-wrap {
    position: relative;
  }
  .nav-logo-link::after,
  .tab-link::after,
  .social-icon-wrap::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: max(100%, 44px);
    height: max(100%, 44px);
    transform: translate(-50%, -50%);
  }
}

/* Footer quick-contact row: на узких экранах подпись занимает свою строку, иконки остаются в одной. */
@media (max-width: 479px) {
  #footer .footer-social-wrap {
    row-gap: 12px;
  }
  #footer .footer-social-wrap::before {
    flex: 0 0 100%;
  }
}

/* ==========================================================================
   MOBILE ONLY (≤767px): длинные стопки карточек превращены в горизонтальные
   карусели со scroll-snap. Десктоп (≥768px) этим блоком не затрагивается.
   Карусель выходит на всю ширину экрана и показывает край следующей карточки.
   ========================================================================== */
@media (max-width: 767px) {
  #pricing .our-packages-wrapper,
  #modules .our-packages-wrapper,
  #support .kubik-support-cards-grid,
  #quiz .crad-all-box,
  #analytics .our-work-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: auto !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 4px 16px 18px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 16px;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    touch-action: pan-x pan-y;
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
    box-sizing: border-box !important;
  }
  #pricing .our-packages-wrapper::-webkit-scrollbar,
  #modules .our-packages-wrapper::-webkit-scrollbar,
  #support .kubik-support-cards-grid::-webkit-scrollbar,
  #quiz .crad-all-box::-webkit-scrollbar,
  #analytics .our-work-wrapper::-webkit-scrollbar {
    display: none;
  }

  /* Карточки: ширина «почти на экран», следующая выглядывает справа. */
  #pricing .our-packages-box,
  #modules .our-packages-box,
  #support .kubik-support-card {
    flex: 0 0 min(84vw, 340px) !important;
    width: min(84vw, 340px) !important;
    max-width: none !important;
    margin: 0 !important;
    scroll-snap-align: start;
    height: auto !important;
  }
  #pricing .our-packages-box,
  #modules .our-packages-box {
    padding: 26px 20px 22px !important;
  }
  #pricing .our-packages-box:hover,
  #modules .our-packages-box:hover {
    transform: none !important;
  }

  /* Аналитика: обе пары карточек выстраиваются в один ряд. */
  #analytics .our-work-fast-wrapper,
  #analytics .our-work-last-wrapper {
    display: contents !important;
  }
  #analytics .our-work-image-text-wrapper,
  #analytics .our-work-grdden-image-text-wrapper {
    flex: 0 0 min(80vw, 320px) !important;
    width: min(80vw, 320px) !important;
    max-width: none !important;
    margin: 0 !important;
    scroll-snap-align: start;
  }

  /* Квиз: четыре сферы бизнеса в одной ленте. */
  #quiz .crad-all-box > div {
    flex: 0 0 min(72vw, 280px) !important;
    width: min(72vw, 280px) !important;
    max-width: none !important;
    margin: 0 !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    scroll-snap-align: start;
  }
  #quiz .crad-all-box .our-creators-box {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
  }
}

/* width/height в HTML нужны браузеру для резерва места (без CLS), но не должны менять отображение:
   любые существующие правила высоты по-прежнему выигрывают, где их нет — высота считается по пропорциям. */
:where(img[width][height]) {
  height: auto;
}

/* ==========================================================================
   MOBILE FIXES (≤767px)
   1) Карточки «Дмитрий Кубик / 30 000 ₽ / 30 дней»: текст слева, стрелка справа
      в одной строке (раньше стрелка переносилась вниз, заголовок центрировался).
   2) Квиз: плашка названия сферы у всех четырёх карточек сверху слева.
   ========================================================================== */
@media (max-width: 767px) {
  .hero-intro-card-box {
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 14px 16px !important;
    min-height: 0 !important;
  }
  .hero-intro-card-image-text-wrap {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
  }
  .hero-intro-card-text-wrap {
    min-width: 0 !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
  }
  .hero-intro-card-text-wrap .h6 {
    font-size: 1.1rem !important;
  }
  .hero-intro-card-social-wrap {
    flex: 0 0 auto !important;
    width: 40px !important;
    height: 40px !important;
  }

  .hero-intro-card-icon-text-wrap .text-default {
    font-size: 13px !important;
    line-height: 1.3 !important;
  }
  .hero-intro-card-box {
    min-height: 78px !important;
  }

  #quiz .crad-all-box .our-creators-item-box {
    position: absolute !important;
    inset: 10px auto auto 10px !important;
    width: fit-content !important;
    max-width: calc(100% - 20px) !important;
    z-index: 2;
  }
  #quiz .crad-all-box .our-creators-item-box .text-medium {
    font-size: 13px !important;
    line-height: 1.25 !important;
    white-space: nowrap;
  }
}

/* ==========================================================================
   MOBILE (≤767px): «Закрываю весь цикл привлечения клиентов»
   Картинка карточки поднята под метки и над заголовком и сделана компактнее;
   «Вижу всю цепочку…»: тёмные и светлые карточки чередуются.
   ========================================================================== */
@media (max-width: 767px) {
  #services .slide-creators-wrap {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 14px !important;
  }
  #services .slide-creators-text-wrapper,
  #services .slide-creators-text-wrap {
    display: contents !important;
  }
  #services .slide-creators-contain-wrap { order: 1; }
  #services .slide-creators-image-wrapper {
    order: 2;
    width: 100% !important;
    height: 190px !important;
  }
  #services .slide-creators-text-wrap > .h5,
  #services .slide-creators-text-wrap > h3 { order: 3; }
  #services .slide-creators-text-dectlies-button-wrap { order: 4; }
  /* Жёлтая рамка вокруг 3D-карточки сохранена, но блок компактный (190px вместо 350px). */
  #services .slide-creators-image-wrapper .slide-creators-image-wrap {
    height: 100% !important;
    padding: 14px 52px !important;
  }
  #services .slide-creators-image-left-wrap {
    width: 56px !important;
    height: 56px !important;
  }
  #services .slide-creators-image-right-wrap {
    width: 48px !important;
    height: 48px !important;
  }
  /* Полупрозрачная SVG-подложка при низком блоке «выбеливает» жёлтый фон — на мобильном убираем. */
  #services .slide-creators-image-bg-wrap {
    display: none !important;
  }

  #analytics .our-work-fast-wrapper > .our-work-image-text-wrapper { order: 1; }
  #analytics .our-work-fast-wrapper > .our-work-grdden-image-text-wrapper { order: 2; }
  #analytics .our-work-last-wrapper > .our-work-image-text-wrapper { order: 3; }
  #analytics .our-work-last-wrapper > .our-work-grdden-image-text-wrapper { order: 4; }
}

/* ==========================================================================
   MOBILE (≤767px): блок «5 лет · Работаю лично · иконки · Каналы привлечения»
   Всё выровнено по центру, обе плашки одного вида, иконки по центру.
   ========================================================================== */
@media (max-width: 767px) {
  .hero-intro-left-wrapper {
    width: 100% !important;
    align-items: center !important;
    gap: 14px !important;
  }
  .hero-intro-left-wrap {
    justify-content: center !important;
    gap: 14px !important;
  }
  .hero-intro-left-wrap .agency-hero-dectlies-box {
    width: auto !important;
    flex: 0 1 auto !important;
    text-align: left !important;
  }
  .hero-intro-left-wrap .kubik-exp-text-wrap {
    align-items: center !important;
  }
  .hero-intro-left-wrap .text-small {
    text-align: left !important;
    width: auto !important;
    max-width: 8.5em;
  }

  .hero-intro-right-wrapper {
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 16px !important;
  }
  .hero-intro-right-wrap {
    justify-content: center !important;
    gap: 12px !important;
    width: auto !important;
  }

  .hero-intro-left-wrapper .text-title-box,
  .hero-intro-right-wrapper .text-title-box {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 8px 16px !important;
  }
  .hero-intro-left-wrapper .text-title-box .text-mediums,
  .hero-intro-right-wrapper .text-title-box .text-mediums {
    text-align: center !important;
  }
}

/* ==========================================================================
   MOBILE (≤767px): первый экран
   Крупнее заголовок (масштабируется от ширины экрана), обе строки по центру,
   меньше зазор между строками, ровный перенос плашки и описания.
   ========================================================================== */
@media (max-width: 767px) {
  .hero-section .agency-hero-text-wrap {
    gap: 4px !important;
  }
  .hero-section .agency-hero-text-wrap .h1 {
    font-size: clamp(19px, 6.6vw, 32px) !important;
    line-height: 1.12 !important;
  }
  .hero-section .agency-hero-fast-text-wrap,
  .hero-section .agency-hero-text-image-wrap {
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .hero-section .agency-hero-text-image-wrap .agency-hero-text,
  .hero-section .agency-hero-fast-text-wrap .agency-hero-text {
    width: auto !important;
    flex: 0 1 auto !important;
  }
  .hero-section .agency-hero-image-wrap.one,
  .hero-section .agency-hero-image-wrap.two {
    width: clamp(24px, 7.2vw, 34px) !important;
    height: clamp(24px, 7.2vw, 34px) !important;
    flex: 0 0 auto !important;
    margin: 0 !important;
  }
  .hero-section .agency-hero-secend-wrapper {
    row-gap: 14px !important;
  }
  .hero-section .target-lead-text {
    text-wrap: balance;
  }
  .hero-section .agency-dectlies-wrap .text-default {
    font-size: 16px !important;
    line-height: 1.45 !important;
    text-wrap: balance;
  }
}

/* ==========================================================================
   Регламент «Адаптивность»: ровные переносы заголовков (§5–6) на мобильных и
   планшетах и зона нажатия ссылок подвала ≥44px (внешний вид не меняется).
   ========================================================================== */
@media (max-width: 1023px) {
  h1, h2, h3, h4, h5, h6,
  .h1, .h2, .h3, .h4, .h5, .h6 {
    text-wrap: balance;
  }
}
@media (max-width: 767px) {
  #footer .link-wrap a.text-button {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
    margin-top: -13px !important;
    margin-bottom: -13px !important;
  }
}

/* ==========================================================================
   Первый экран: оригинальная вёрстка hero + кнопка + калькулятор окупаемости (.kh-*)
   ========================================================================== */
/* Длинный заголовок: та же гарнитура и капс, но размер подобран под две строки. */
.kh .agency-hero-fast-text-wrap .h1,
.kh .agency-hero-text-image-wrap .h1 { font-size: clamp(19px, 4.1vw, 72px) !important; }
.kh .agency-hero-image-wrap.one { width: clamp(26px, 3.4vw, 52px) !important; height: clamp(26px, 3.4vw, 52px) !important; }

.kh-actions { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 10px; margin: 0 auto; max-width: 100%; }
.kh-note { margin: 0; font-size: 14px; line-height: 1.4; color: rgba(12, 13, 14, 0.62); text-align: center; }

.kh-btn {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 56px;
  padding: 14px 30px;
  border-radius: 20px;
  font-family: 'Seenonim', sans-serif;
  font-size: 17px;
  line-height: 1.2;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  max-width: 100%;
  transition: transform .2s ease, box-shadow .2s ease;
}
.kh-btn--primary {
  color: #fff;
  background-image: linear-gradient(167deg, #ff7f00, #f55c36);
  border: 3px solid #ffce0096;
  box-shadow: inset 0 0 20px 0 rgba(255, 206, 0, 0.35), 0 4px 20px 0 rgba(247, 119, 43, 0.3);
}
.kh-btn--primary:hover { transform: translateY(-2px); box-shadow: inset 0 0 20px 0 rgba(255, 206, 0, 0.4), 0 6px 26px 0 rgba(247, 119, 43, 0.45); }
.kh-btn--block { width: 100%; }
.kh-btn-arrow { flex: 0 0 auto; transition: transform .2s ease; }
.kh-btn:hover .kh-btn-arrow { transform: translateX(4px); }
.kh-btn:focus-visible, .kh-range:focus-visible { outline: 3px solid #0c0d0e; outline-offset: 3px; }

.kh-calc {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  width: 100%;
  max-width: 880px;
  margin: clamp(28px, 4vw, 56px) auto 0;
  padding: clamp(18px, 2.2vw, 30px);
  border-radius: 32px;
  background: #fff;
  border: 1px solid rgba(12, 13, 14, 0.08);
  box-shadow: 0 18px 50px rgba(12, 13, 14, 0.08);
}
.kh-calc-title {
  margin: 0 0 18px;
  font-family: 'Seenonim', sans-serif;
  font-weight: 400;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.15;
  text-align: center;
  text-transform: uppercase;
  color: #0c0d0e;
}
.kh-calc-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(16px, 2.4vw, 32px); align-items: center; margin-bottom: 18px; }
.kh-field + .kh-field { margin-top: 8px; }
.kh-field-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.kh-field-head label { font-size: 15px; line-height: 1.3; color: rgba(12, 13, 14, 0.72); }
.kh-field-head output { flex: 0 0 auto; font-family: 'Seenonim', sans-serif; font-size: 20px; color: #0c0d0e; white-space: nowrap; }
.kh-range {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  --kh-fill: 50%;
}
.kh-range::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(90deg, #ff7f00 0, #f55c36 var(--kh-fill), rgba(12, 13, 14, 0.12) var(--kh-fill)); }
.kh-range::-moz-range-track { height: 8px; border-radius: 8px; background: rgba(12, 13, 14, 0.12); }
.kh-range::-moz-range-progress { height: 8px; border-radius: 8px; background: linear-gradient(90deg, #ff7f00, #f55c36); }
.kh-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 28px; height: 28px; margin-top: -10px; border-radius: 50%; background: #fff; border: 3px solid #f55c36; box-shadow: 0 2px 8px rgba(12, 13, 14, 0.25); }
.kh-range::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 3px solid #f55c36; box-shadow: 0 2px 8px rgba(12, 13, 14, 0.25); }
.kh-result { margin: 0; padding: 6px 18px; border-radius: 20px; background: #0c0d0e; color: #fff; }
.kh-result-row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.kh-result-row:last-child { border-bottom: 0; }
.kh-result dt { margin: 0; font-size: 14px; line-height: 1.3; color: rgba(255, 255, 255, 0.72); }
.kh-result dd { margin: 0; font-family: 'Seenonim', sans-serif; font-size: 18px; line-height: 1.2; text-align: right; white-space: nowrap; }
.kh-result-row--main dd { font-size: clamp(20px, 1.8vw, 26px); color: #ffb454; }
.kh-calc-hint { margin: 12px 0 0; font-size: 13px; line-height: 1.4; text-align: center; color: rgba(12, 13, 14, 0.58); }

@media (max-width: 767px) {
  /* Заголовок переносится по словам и остаётся по центру. */
  .kh .agency-hero-fast-text-wrap,
  .kh .agency-hero-fast-text-wrap .h1,
  .kh .agency-hero-text-image-wrap .h1 { white-space: normal !important; text-align: center; }
  .kh .agency-hero-fast-text-wrap .h1,
  .kh .agency-hero-text-image-wrap .h1 { font-size: clamp(22px, 7.4vw, 34px) !important; }
  .kh .agency-hero-fast-text-wrap { flex-wrap: wrap !important; }
  .kh .agency-hero-image-wrap.one { width: clamp(24px, 7.2vw, 34px) !important; height: clamp(24px, 7.2vw, 34px) !important; }
  .kh-btn { width: 100%; padding: 14px 18px; font-size: 15px; }
  .kh-calc-body { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 479px) {
  .kh-result dd { font-size: 16px; }
  .kh-result-row--main dd { font-size: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .kh-btn, .kh-btn-arrow { transition: none; }
  .kh-btn:hover, .kh-btn--primary:hover { transform: none; }
}


/* ==========================================================================
   Квиз, финальный шаг: порядок «контакт → способ связи → согласие → кнопка»,
   компактная сводка параметров, кнопка на всю ширину.
   ========================================================================== */
.kubik-quiz-summary-box { padding: 14px 18px !important; margin-bottom: 18px !important; border-radius: 18px !important; }
.kubik-quiz-summary-title { margin-bottom: 10px !important; }
.kubik-quiz-summary-list { gap: 8px !important; }
.kubik-quiz-summary-item { font-size: 13.5px !important; padding: 6px 12px !important; border-radius: 10px !important; line-height: 1.3 !important; }
.kubik-quiz-field-label {
  display: block !important;
  margin: 0 0 8px !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #334155 !important;
}
.kubik-quiz-input-row { margin-bottom: 14px !important; }
.kubik-quiz-input { width: 100% !important; }
.kubik-quiz-lead-form .kubik-consent {
  margin: 4px 0 16px !important;
  opacity: 1 !important;
  font-family: 'Guidy', sans-serif !important;
  font-size: 13px !important;
  color: #475569 !important;
}
.kubik-quiz-lead-form .kubik-quiz-submit-btn { width: 100% !important; }
.kubik-quiz-form-sub { margin-top: 14px !important; text-align: center !important; }
.kubik-quiz-modal-card { overscroll-behavior: contain; }
@media (max-width: 768px) {
  .kubik-quiz-summary-box { padding: 12px 14px !important; margin-bottom: 14px !important; }
  .kubik-quiz-summary-item { font-size: 13px !important; padding: 5px 10px !important; }
  .kubik-quiz-input { height: 52px !important; min-height: 52px !important; }
  .kubik-quiz-messenger-choice { gap: 8px 16px !important; margin-bottom: 14px !important; }
  .kubik-quiz-modal-head { margin-bottom: 12px !important; }
}

/* ==========================================================================
   Первый экран на телефонах: единый заголовок в 3 ровные строки, спокойный
   вертикальный ритм (шаг 8 px), компактная плашка и карточка цены.
   ========================================================================== */
@media (min-width: 768px) {
  /* На планшете и десктопе вторая строка живёт отдельно, хвост в H1 только для скринридеров. */
  .kh-h1-tail {
    position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important;
    padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important;
  }
}
@media (max-width: 767px) {
  .kh .kh-line2 { display: none !important; }
  .kh .agency-hero-text-wrap { gap: 0 !important; align-items: center !important; }
  .kh .agency-hero-fast-text-wrap { flex-direction: column !important; gap: 10px !important; }
  .kh .agency-hero-image-wrap.one { width: 40px !important; height: 40px !important; }
  .kh .agency-hero-fast-text-wrap .agency-hero-text { width: 100% !important; }
  .kh .agency-hero-fast-text-wrap .h1 {
    font-size: clamp(25px, 8vw, 34px) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.005em !important;
    text-wrap: balance;
    white-space: normal !important;
    text-align: center;
  }
  .kh .agency-hero-secend-wrapper { margin-top: 20px; row-gap: 12px !important; flex-direction: column; align-items: center !important; width: 100%; }
  .kh .agency-hero-text-samall-wrap { display: flex !important; justify-content: center; width: 100%; }
  .kh .agency-hero-text-wrap .target-lead-pill {
    max-width: 100% !important;
    padding: 10px 18px !important;
    border-width: 2px !important;
    border-radius: 16px !important;
    font-size: 13px !important;
    letter-spacing: 0.04em !important;
    white-space: normal !important;
  }
  .kh .agency-hero-box { display: flex; flex-direction: column; align-items: center; gap: 8px; }
  .kh .display-text-two { font-size: clamp(34px, 11vw, 46px) !important; line-height: 1.05 !important; }
  .kh .decorated-title { padding: 10px 26px !important; }
  .kh .decorated-title-style-wrap {
    display: flex !important; align-items: center; gap: 6px; transform: none !important; margin: 0 !important; padding: 6px 12px !important;
  }
  .kh .decorated-title-style-image-wrap { width: 20px !important; height: 20px !important; }
  .kh .decorated-title-style-wrap .text-small { font-size: 13px !important; }
  .kh .agency-dectlies-wrap { margin: 22px auto 0 !important; max-width: 34ch !important; }
  .kh .agency-dectlies-wrap .text-default { font-size: 16px !important; line-height: 1.5 !important; }
  .kh .kh-actions { margin-top: 22px; gap: 10px; }
  .kh .kh-btn { min-height: 56px; font-size: 14.5px; line-height: 1.25; letter-spacing: 0.015em; }
  .kh .kh-note { font-size: 13px; }
  .kh .kh-calc { margin-top: 32px; }
}
@media (max-width: 359px) {
  .kh .agency-hero-fast-text-wrap .h1 { font-size: 24px !important; }
  .kh .agency-hero-text-wrap .target-lead-pill { font-size: 12px !important; padding: 9px 14px !important; }
}

/* Первый экран, десктоп: заголовок компактнее, плашка и карточка цены на одной линии. */
@media (min-width: 992px) {
  .kh .agency-hero-fast-text-wrap .h1,
  .kh .agency-hero-text-image-wrap .h1 { font-size: clamp(34px, 3.1vw, 60px) !important; line-height: 1.08 !important; }
  .kh .agency-hero-image-wrap.one { width: clamp(34px, 3vw, 56px) !important; height: clamp(34px, 3vw, 56px) !important; }
  .kh .agency-hero-text-wrap { gap: 6px !important; }
  .kh .agency-hero-secend-wrapper { align-items: center !important; column-gap: 20px !important; margin-top: 14px; }
  .kh .target-lead-pill { font-size: clamp(14px, 1.1vw, 19px) !important; padding: 14px 26px !important; }
  .kh .display-text-two { font-size: clamp(36px, 3.6vw, 64px) !important; line-height: 1.05 !important; }
  .kh .decorated-title { padding: 12px 34px !important; }
  .kh .agency-dectlies-wrap { margin-top: 26px !important; }
  .kh .kh-actions { margin-top: 24px; }
  .kh .kh-calc { margin-top: 44px; }
}

/* Десктоп: воздух между шапкой и заголовком, ровнее вертикальные интервалы. */
@media (min-width: 992px) {
  .hero-section.kh { padding-top: calc(var(--_responsive---element-spacing--spacing-33x) + 20px) !important; }
  .kh .agency-dectlies-wrap { margin-top: 14px !important; }
  .kh .kh-actions { margin-top: 28px; }
}

/* ==========================================================================
   Первый экран и тарифы: новые тексты (бровка, подзаголовок калькулятора, плашка договора)
   ========================================================================== */
.kh-eyebrow {
  margin: 0 0 14px;
  text-align: center;
  font-family: 'Seenonim', sans-serif;
  font-size: clamp(12px, 1vw, 15px);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(12, 13, 14, 0.58);
}
.kh-calc-sub { margin: -8px 0 18px; text-align: center; font-size: 15px; line-height: 1.4; color: rgba(12, 13, 14, 0.62); }
.kh-pricing-note {
  max-width: 880px;
  margin: 24px auto 0;
  text-align: center;
  font-size: 15px;
  line-height: 1.5;
  color: rgba(12, 13, 14, 0.66);
}
@media (min-width: 992px) {
  .kh .display-text-two { font-size: clamp(30px, 2.9vw, 52px) !important; }
}
@media (max-width: 767px) {
  .kh .display-text-two { font-size: clamp(24px, 8vw, 34px) !important; }
  .kh .decorated-title { padding: 10px 20px !important; }
  .kh-eyebrow { margin-bottom: 12px; }
  .kh-pricing-note { font-size: 14px; margin-top: 18px; }
}
@media (min-width: 768px) {
  /* Вторая строка заголовка занимает всю ширину, плашка и цена — отдельным рядом под ней. */
  .kh .kh-line2 { flex: 0 0 100%; width: 100% !important; justify-content: center !important; }
}
.kh .display-text-two { white-space: nowrap !important; }
@media (max-width: 767px) {
  .kh .display-text-two { font-size: clamp(22px, 6.9vw, 30px) !important; }
  .kh .agency-hero-text-wrap .target-lead-pill { font-size: 12.5px !important; letter-spacing: 0.02em !important; }
}

/* Карточки «80%+ / 390–1 900 ₽ / 35+»: длинный текст переносится внутри карточки, стрелка остаётся справа. */
.hero-intro-card-box { flex-wrap: nowrap !important; align-items: center !important; gap: 16px !important; }
.hero-intro-card-image-text-wrap { flex: 1 1 0 !important; min-width: 0 !important; }
.hero-intro-card-text-wrap { min-width: 0 !important; }
.hero-intro-card-icon-text-wrap { align-items: flex-start !important; }
.hero-intro-card-icon-text-wrap .text-default {
  white-space: normal !important;
  overflow-wrap: break-word;
  line-height: 1.35 !important;
  min-width: 0;
}
.hero-intro-card-icon { margin-top: 3px !important; }
.hero-intro-card-social-wrap { flex: 0 0 auto !important; }
/* Плашка «Работаю лично…» в две строки: аккуратные скругления вместо капсулы. */
.hero-intro-left-wrapper .text-title-box { border-radius: 22px !important; text-align: center; }

/* «Масштабирование»: длинный заголовок-предложение набран спокойнее, чем короткие заголовки секций. */
#modules .kubik-wide-header .h2 {
  font-size: clamp(24px, 2.3vw, 40px) !important;
  line-height: 1.15 !important;
  max-width: 1200px;
  text-wrap: balance;
}

/* Телефон: плашка «Связка…» и карточка цены стоят рядом, в две колонки. */
@media (max-width: 767px) {
  .kh .agency-hero-secend-wrapper {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 10px !important;
    column-gap: 10px !important;
  }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    display: flex !important;
    align-items: stretch !important;
  }
  .kh .agency-hero-text-wrap .target-lead-pill {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 8px !important;
    font-size: clamp(10.5px, 3.1vw, 13px) !important;
    line-height: 1.25 !important;
    letter-spacing: 0.01em !important;
    text-align: center !important;
  }
  .kh .decorated-title { width: 100% !important; box-sizing: border-box !important; padding: 10px 8px !important; display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; }
  .kh .display-text-two { white-space: normal !important; text-align: center !important; font-size: clamp(19px, 6vw, 27px) !important; line-height: 1.12 !important; }
}

/* Планшет (768–991 px): плашка слева, карточка цены справа, в одну линию. */
@media (min-width: 768px) and (max-width: 991px) {
  .kh .agency-hero-secend-wrapper { align-items: center !important; justify-content: center !important; column-gap: 14px !important; row-gap: 12px !important; }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box { flex: 0 1 auto !important; width: auto !important; min-width: 0 !important; }
  .kh .target-lead-pill { font-size: 12.5px !important; padding: 12px 18px !important; white-space: normal !important; text-align: center !important; }
  .kh .display-text-two { font-size: clamp(24px, 3.4vw, 34px) !important; }
  .kh .decorated-title { padding: 10px 22px !important; }
}

/* Планшет и десктоп: строго два столбца. Слева плашка «Связка…», справа цена; заголовок над ними на всю ширину. */
@media (min-width: 768px) {
  .kh .agency-hero-secend-wrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 20px !important;
    row-gap: 14px !important;
    align-items: center !important;
    justify-items: stretch !important;
    width: 100% !important;
  }
  .kh .kh-line2 { grid-column: 1 / -1 !important; flex: none !important; justify-self: center; }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box { display: flex !important; width: 100% !important; min-width: 0 !important; flex: none !important; }
  .kh .agency-hero-text-samall-wrap { justify-content: flex-end; }
  .kh .agency-hero-box { justify-content: flex-start; }
  .kh .target-lead-pill { width: 100% !important; box-sizing: border-box !important; white-space: normal !important; text-align: center !important; }
  .kh .decorated-title { width: 100% !important; box-sizing: border-box !important; display: flex !important; justify-content: center !important; align-items: center !important; }
  .kh .display-text-two { white-space: nowrap !important; text-align: center !important; }
}
@media (min-width: 992px) {
  .kh .target-lead-pill { font-size: clamp(14px, 1.1vw, 18px) !important; padding: 16px 22px !important; }
  .kh .display-text-two { font-size: clamp(30px, 2.4vw, 46px) !important; }
}

/* Слайдер этапов: карточки компактнее, без кнопок. */
@media (min-width: 992px) {
  #services .services-mask { max-width: 600px !important; }
  #services .slide-creators-wrapper { min-height: 400px !important; padding: 24px !important; }
  #services .slide-creators-wrap { gap: 18px !important; }
  #services .slide-creators-text-wrapper { justify-content: flex-start !important; gap: 16px !important; }
  #services .slide-creators-image-wrap { width: 100% !important; max-width: 240px !important; height: 300px !important; padding: 12px !important; }
  #services .slide-creators-text-wrap .h5 { font-size: 24px !important; margin-bottom: 8px !important; }
  #services .slide-creators-text-dectlies-wrap p.text-default.rbg8 { font-size: 14px !important; line-height: 1.5 !important; margin-bottom: 0 !important; }
}
@media (max-width: 991px) {
  #services .slide-creators-wrapper { min-height: 0 !important; }
}
@media (min-width: 992px) {
  #services .slide-creators-wrap { flex-wrap: nowrap !important; align-items: center !important; }
  #services .slide-creators-text-wrapper { flex: 1 1 0 !important; min-width: 0 !important; }
  #services .slide-creators-image-wrapper { flex: 0 0 230px !important; width: 230px !important; }
  #services .slide-creators-image-wrap { max-width: 230px !important; height: 290px !important; }
}
@media (min-width: 992px) {
  #services .slide-creators-wrapper { min-height: 350px !important; }
  #services .slide-creators-image-wrap { height: 280px !important; }
}

/* «Масштабирование»: воздух до финального блока ниже. */
#modules { padding-bottom: clamp(88px, 9vw, 150px) !important; }

/* Тарифы: заголовок спокойнее, списки у верха карточки, кнопки на одной линии внизу. */
#pricing .kubik-wide-header .h2 {
  font-size: clamp(24px, 2.3vw, 40px) !important;
  line-height: 1.15 !important;
  text-wrap: balance;
}
#pricing .plans-pricing-item-wrapper { justify-content: flex-start !important; }
#pricing .plans-pricing-item-button-wrap { margin-top: auto !important; padding-top: 16px; }
#pricing .plans-pricing-item-wrap { flex: 1 1 auto; }
.kh-pricing-note { margin-top: 32px; }
#modules .plans-pricing-item-wrapper { justify-content: flex-start !important; }

/* ==========================================================================
   Калькулятор окупаемости (#calculator): светлая карточка с параметрами + тёмное табло
   ========================================================================== */
.hero-section.kh { padding-bottom: clamp(32px, 5vw, 72px); }
.kc { padding: clamp(40px, 6vw, 96px) 0; }
.kc-wrap {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 20px;
  align-items: stretch;
}
.kc-card,
.kc-board { box-sizing: border-box; border-radius: 32px; padding: clamp(22px, 3vw, 40px); min-width: 0; }
.kc-card { background: #fff; border: 1px solid rgba(12, 13, 14, 0.06); box-shadow: 0 18px 50px rgba(12, 13, 14, 0.08); }
.kc-eyebrow {
  display: inline-block;
  margin: 0 0 14px;
  padding: 7px 14px;
  border-radius: 999px;
  background: rgba(255, 127, 0, 0.12);
  border: 1px solid rgba(245, 92, 54, 0.28);
  color: #b83a15;
  font-family: 'Seenonim', sans-serif;
  font-size: 12.5px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.2;
}
.kc-title {
  margin: 0 0 10px;
  font-family: 'Seenonim', sans-serif;
  font-weight: 400;
  font-size: clamp(26px, 2.6vw, 42px);
  line-height: 1.1;
  color: #0c0d0e;
  text-wrap: balance;
}
.kc-sub { margin: 0; font-size: 16px; line-height: 1.5; color: rgba(12, 13, 14, 0.66); max-width: 560px; }
.kc-field { margin-top: 24px; }
.kc-field-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 8px; }
.kc-label { display: block; margin: 0 0 8px; font-size: 14px; line-height: 1.3; color: rgba(12, 13, 14, 0.62); }
.kc-field-head .kc-label { margin: 0; }
.kc-value { flex: 0 0 auto; font-family: 'Seenonim', sans-serif; font-size: 24px; line-height: 1; color: #0c0d0e; white-space: nowrap; }
.kc-select {
  box-sizing: border-box;
  width: 100%;
  height: 52px;
  padding: 0 44px 0 16px;
  border: 1.5px solid #d6d9de;
  border-radius: 16px;
  background: #fff url("data:image/svg+xml,%3Csvg width='14' height='8' viewBox='0 0 14 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%230c0d0e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center;
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
  font-size: 16px;
  color: #0c0d0e;
  cursor: pointer;
}
.kc-select:focus-visible, .kc-range:focus-visible, .kc-chip:focus-visible, .kc-how summary:focus-visible { outline: 3px solid #0c0d0e; outline-offset: 3px; }
.kc-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.kc-chip {
  min-height: 40px;
  padding: 8px 16px;
  border: 1.5px solid #d6d9de;
  border-radius: 999px;
  background: #fff;
  font-family: inherit;
  font-size: 14px;
  color: #0c0d0e;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.kc-chip:hover { border-color: #0c0d0e; }
.kc-chip.is-active { background: #0c0d0e; border-color: #0c0d0e; color: #fff; }
.kc-range {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  --kc-fill: 50%;
}
.kc-range::-webkit-slider-runnable-track { height: 8px; border-radius: 8px; background: linear-gradient(90deg, #ff7f00 0, #f55c36 var(--kc-fill), rgba(12, 13, 14, 0.12) var(--kc-fill)); }
.kc-range::-moz-range-track { height: 8px; border-radius: 8px; background: rgba(12, 13, 14, 0.12); }
.kc-range::-moz-range-progress { height: 8px; border-radius: 8px; background: linear-gradient(90deg, #ff7f00, #f55c36); }
.kc-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 28px; height: 28px; margin-top: -10px; border-radius: 50%; background: #fff; border: 3px solid #f55c36; box-shadow: 0 2px 8px rgba(12, 13, 14, 0.25); }
.kc-range::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 3px solid #f55c36; box-shadow: 0 2px 8px rgba(12, 13, 14, 0.25); }

.kc-board { position: relative; display: flex; flex-direction: column; overflow: hidden; background: #0c0d0e; color: #fff; box-shadow: 0 18px 50px rgba(12, 13, 14, 0.18); }
.kc-board-img { display: block; width: clamp(110px, 12vw, 170px); height: auto; margin: -8px 0 -28px auto; pointer-events: none; position: relative; z-index: 0; }
.kc-rows { position: relative; z-index: 1; margin: 0; }
.kc-row { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.14); }
.kc-row dt { margin: 0; font-size: 15px; line-height: 1.3; color: rgba(255, 255, 255, 0.78); }
.kc-row dt small { display: block; margin-top: 3px; font-size: 12.5px; color: rgba(255, 255, 255, 0.5); }
.kc-row dd { margin: 0; font-family: 'Seenonim', sans-serif; font-size: clamp(16px, 1.5vw, 20px); line-height: 1.2; text-align: right; white-space: nowrap; }
.kc-result { display: flex; flex-direction: column; gap: 6px; padding: 18px 0 20px; }
.kc-result-label { font-size: 14px; color: rgba(255, 255, 255, 0.62); }
.kc-result-value {
  font-family: 'Seenonim', sans-serif;
  font-size: clamp(34px, 3.8vw, 56px);
  line-height: 1.05;
  background-image: linear-gradient(167deg, #ffce00, #ff7f00 55%, #f55c36);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  white-space: nowrap;
}
.kc-board .kh-btn { margin-top: auto; }
.kc-board .kh-btn:focus-visible { outline-color: #fff; }
.kc-how { margin-top: 14px; font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, 0.66); }
.kc-how summary { display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.35); text-underline-offset: 4px; }
.kc-how p { margin: 0 0 4px; }

@media (max-width: 991px) {
  .kc-wrap { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 479px) {
  .kc-card, .kc-board { border-radius: 24px; }
  .kc-value { font-size: 20px; }
  .kc-row { flex-wrap: wrap; row-gap: 4px; }
  .kc-row dd { white-space: normal; text-align: left; }
  .kc-result-value { font-size: clamp(30px, 10vw, 40px); }
}
@media (prefers-reduced-motion: reduce) { .kc-chip { transition: none; } }

/* Мобильные кейсы: названия и «Задача/Решение» не обрываются многоточием посреди фразы. */
@media (max-width: 767px) {
  #cases .featured-work-header-text-name h3.h4 { -webkit-line-clamp: 4 !important; min-height: 0 !important; font-size: 21px !important; }
  #cases .kubik-case-detail-row { -webkit-line-clamp: 6 !important; font-size: 14px !important; }
  #cases .kubik-case-lbl { font-size: 14px !important; }
}

/* ==========================================================================
   Мобильный аудит: выравнивание, мелкие шрифты, зоны нажатия, цена в тарифах
   ========================================================================== */
@media (max-width: 767px) {
  /* «30 дней сопровождения»: заголовок на одной линии с карточками, а не смещён вправо. */
  #support .our-partners-text-wrapper { justify-content: flex-start !important; }
  #support .our-partners-text-wrap { width: 100% !important; }
  #support .tab-link { min-height: 44px !important; display: inline-flex !important; align-items: center !important; }

  /* Тарифы: «с ведением 30 дней» не упирается в край карточки, заголовок не липнет к карточкам. */
  .plans-pricing-wrapper { flex-wrap: wrap !important; row-gap: 4px !important; }
  .plans-pricing-wrapper .text-default { white-space: normal !important; }
  #pricing .campaign-packages-header-wrap { margin-bottom: 24px !important; }

  /* Подписи не мельче 12 px. */
  .kubik-review-zoom-pill { font-size: 13px !important; }
  .hero-section.kh .agency-hero-text-wrap .target-lead-pill { font-size: max(12px, 3.1vw) !important; }

  /* Стрелки в карточках «80%+ / 370–2 900 ₽ / 35+» — зона нажатия 44 px. */
  .hero-intro-card-social-wrap { width: 44px !important; height: 44px !important; }
  .hero-intro-card-social-wrap .link-sosal-wrap { display: block !important; width: 100% !important; height: 100% !important; }
}
@media (max-width: 767px) {
  #pricing .plans-pricing-wrapper,
  #modules .plans-pricing-wrapper { flex-wrap: wrap !important; align-items: baseline !important; column-gap: 10px !important; row-gap: 4px !important; }
  #pricing .plans-pricing-wrapper .text-default,
  #modules .plans-pricing-wrapper .text-default { white-space: normal !important; line-height: 1.3 !important; }
  #footer a.icon-button { min-width: 44px !important; min-height: 44px !important; }
}
@media (max-width: 991px) {
  /* Пункты мобильного меню: зона нажатия не меньше 44 px. */
  .header-section .menu-one .text-button { min-height: 44px !important; align-items: center !important; }
}

/* Телефон: плашка «Связка…» и карточка цены друг под другом, каждая на всю ширину. */
@media (max-width: 767px) {
  .kh .agency-hero-secend-wrapper { flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; gap: 12px !important; row-gap: 12px !important; }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box { flex: none !important; width: 100% !important; display: flex !important; }
  .kh .agency-hero-text-wrap .target-lead-pill { padding: 14px 16px !important; font-size: max(12px, 3.4vw) !important; letter-spacing: 0.03em !important; }
  .kh .decorated-title { padding: 12px 16px !important; }
  .kh .display-text-two { white-space: nowrap !important; font-size: clamp(20px, 7vw, 32px) !important; }
}

/* Телефон: иерархия вместо двух одинаковых блоков — компактная плашка сверху, крупная цена под ней, обе по центру по содержимому. */
@media (max-width: 767px) {
  .kh .agency-hero-secend-wrapper { align-items: center !important; gap: 10px !important; row-gap: 10px !important; margin-top: 18px !important; }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box { width: auto !important; max-width: 100% !important; justify-content: center !important; }
  .kh .agency-hero-text-wrap .target-lead-pill {
    width: auto !important;
    max-width: 100% !important;
    padding: 9px 16px !important;
    font-size: max(12px, 3.1vw) !important;
    letter-spacing: 0.02em !important;
    border-width: 2px !important;
    border-radius: 999px !important;
    white-space: normal !important;
    text-align: center !important;
  }
  .kh .decorated-title { width: auto !important; padding: 12px 30px !important; }
  .kh .display-text-two { font-size: clamp(24px, 7.6vw, 34px) !important; }
}
@media (max-width: 767px) {
  /* Пара плашка + цена: одинаковая ширина и близкая высота, по центру. */
  .kh .agency-hero-secend-wrapper { width: min(100%, 300px) !important; margin-left: auto !important; margin-right: auto !important; align-items: stretch !important; }
  .kh .agency-hero-text-samall-wrap,
  .kh .agency-hero-box { width: 100% !important; }
  .kh .agency-hero-text-wrap .target-lead-pill { width: 100% !important; min-height: 58px; align-items: center; justify-content: center; border-radius: 18px !important; text-wrap: balance; }
  .kh .decorated-title { width: 100% !important; min-height: 58px; box-sizing: border-box !important; }
}

@media (min-width: 992px) {
  #services .slide-creators-image-wrapper { display: flex; justify-content: center; }
}
@media (max-width: 991px) {
  /* Картинка карточки этапа на всю ширину карточки у всех пяти слайдов. */
  #services .slide-creators-image-wrapper { display: block !important; width: 100% !important; }
  #services .slide-creators-image-wrapper .slide-creators-image-wrap { width: 100% !important; max-width: none !important; }
}

/* Телефон, финальная композиция: плашка и цена — одна карточка-«ценник».
   Сверху мелкая строка-пояснение, под тонкой линией крупная цена. Один блок, один акцент. */
@media (max-width: 767px) {
  .kh .agency-hero-secend-wrapper {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
    row-gap: 0 !important;
    width: 100% !important;
    max-width: 360px !important;
    margin: 20px auto 0 !important;
    padding: 16px 18px 18px !important;
    border-radius: 24px !important;
    background-image: linear-gradient(167deg, #ff7f00, #f55c36) !important;
    border: 3px solid #ffce0096 !important;
    box-shadow: inset 0 0 20px 0 rgba(255, 206, 0, 0.35), 0 6px 22px 0 rgba(247, 119, 43, 0.3) !important;
  }
  .kh .agency-hero-secend-wrapper .agency-hero-text-samall-wrap {
    width: 100% !important;
    justify-content: center !important;
    padding-bottom: 12px !important;
    margin-bottom: 12px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.38);
  }
  .kh .agency-hero-secend-wrapper .target-lead-pill {
    width: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    font-size: 12px !important;
    letter-spacing: 0.06em !important;
    line-height: 1.35 !important;
    color: rgba(255, 255, 255, 0.94) !important;
    text-wrap: balance;
  }
  .kh .agency-hero-secend-wrapper .agency-hero-box { width: 100% !important; justify-content: center !important; }
  .kh .agency-hero-secend-wrapper .decorated-title {
    width: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(24px, 7.8vw, 34px) !important; line-height: 1.1 !important; }
}

/* Значок Яндекс.Директа стоит вплотную к слову «Директ» в плашке (вместо руки над заголовком). */
.kh .kh-direct-icon {
  display: inline-block;
  width: 1.55em;
  height: 1.55em;
  margin: 0 0.25em 0 0.15em;
  vertical-align: -0.4em;
  object-fit: contain;
  border-radius: 50%;
}
.kh .kh-nowrap { white-space: nowrap; }

/* ==========================================================================
   Планшет и десктоп: плашка и цена — один оранжевый «ценник» в две колонки
   (слева описание со значком Директа, справа цена), как на телефоне, но в ряд.
   ========================================================================== */
@media (min-width: 768px) {
  .kh .kh-line2 { align-self: center !important; flex: none !important; width: auto !important; justify-content: center !important; }
  .kh .agency-hero-secend-wrapper {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: center !important;
    gap: 0 !important;
    column-gap: 0 !important;
    row-gap: 0 !important;
    width: fit-content !important;
    max-width: 100% !important;
    margin: 22px auto 0 !important;
    padding: 0 !important;
    overflow: hidden;
    border-radius: 28px !important;
    background-image: linear-gradient(167deg, #ff7f00, #f55c36) !important;
    border: 3px solid #ffce0096 !important;
    box-shadow: inset 0 0 24px 0 rgba(255, 206, 0, 0.35), 0 8px 28px 0 rgba(247, 119, 43, 0.32) !important;
  }
  .kh .agency-hero-secend-wrapper .agency-hero-text-samall-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 1 auto !important;
    width: auto !important;
    padding: 18px clamp(20px, 2vw, 34px) !important;
    margin: 0 !important;
    border-right: 1px solid rgba(255, 255, 255, 0.4);
    border-bottom: 0 !important;
  }
  .kh .agency-hero-secend-wrapper .target-lead-pill {
    width: auto !important;
    max-width: 330px !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
    font-size: clamp(13px, 1.05vw, 17px) !important;
    letter-spacing: 0.05em !important;
    line-height: 1.4 !important;
    color: rgba(255, 255, 255, 0.96) !important;
    text-align: center !important;
    white-space: normal !important;
    text-wrap: balance;
    transform: none !important;
  }
  .kh .agency-hero-secend-wrapper .agency-hero-box {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    padding: 14px clamp(22px, 2.4vw, 42px) !important;
    margin: 0 !important;
  }
  .kh .agency-hero-secend-wrapper .decorated-title {
    width: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(30px, 2.8vw, 50px) !important; line-height: 1.05 !important; white-space: nowrap !important; text-align: center !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .kh .agency-hero-secend-wrapper .agency-hero-text-samall-wrap { padding: 14px 18px !important; }
  .kh .agency-hero-secend-wrapper .target-lead-pill { max-width: 220px !important; font-size: 12.5px !important; }
  .kh .agency-hero-secend-wrapper .agency-hero-box { padding: 12px 22px !important; }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(24px, 3.4vw, 32px) !important; }
}
.kh .agency-dectlies-wrap .text-default { text-wrap: balance; }

/* ==========================================================================
   «Обо мне»: ровные карточки, плашка в одну строку, без ложного выделения первой карточки
   ========================================================================== */
/* Карточки были вкладками фото; фото теперь одинаковые, поэтому постоянная чёрная рамка только вводит в заблуждение.
   Рамка остаётся при наведении. */
.hero-intro-card-wrapper .hero-intro-card-box.is-active { border-color: transparent !important; }
.hero-intro-card-wrapper .hero-intro-card-box:hover,
.hero-intro-card-wrapper .hero-intro-card-box:focus-within { border-color: #0c0d0e !important; }

@media (min-width: 768px) {
  /* Заголовки карточек на одной высоте, стрелки по центру. */
  .hero-intro-card-wrapper .hero-intro-card-box { align-items: center !important; }
  .hero-intro-card-wrapper .hero-intro-card-image-text-wrap { align-self: flex-start !important; }
  .hero-intro-card-wrapper .hero-intro-card-social-wrap { align-self: center !important; }

  /* Плашки «Работаю лично…» и «Каналы привлечения»: одна строка, одинаковая высота. */
  .hero-intro-left-wrapper .text-title-box,
  .hero-intro-right-wrapper .text-title-box {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    width: max-content !important;
    max-width: 100% !important;
    padding: 0 20px !important;
    border-radius: 999px !important;
  }
  .hero-intro-left-wrapper .text-title-box .text-mediums,
  .hero-intro-right-wrapper .text-title-box .text-mediums { font-size: 15px !important; line-height: 1.2 !important; white-space: nowrap; }
}
@media (min-width: 768px) {
  /* Верхние ряды (5 ЛЕТ / иконки) одной высоты и одинаковый зазор до плашек: плашки на одной линии. */
  .hero-intro-right-wrapper { row-gap: 10px !important; }
  .hero-intro-right-wrap { min-height: 44px !important; align-items: center !important; }
}

/* Телефон: длинное слово «ПЛАТЕЖЕСПОСОБНЫЕ» (≈14,7 em) всегда помещается — размер считается от ширины экрана. */
@media (max-width: 767px) {
  .kh .agency-hero-text-wrap .agency-hero-fast-text-wrap h1.h1 {
    font-size: min(34px, calc((100vw - 24px) / 15.4)) !important;
    line-height: 1.12 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    hyphens: none !important;
  }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(20px, 6.6vw, 28px) !important; }
}

/* ==========================================================================
   «Быстрый запуск за 7–10 дней» (#process): заголовок как у остальных H2, видимые стрелки кнопок
   ========================================================================== */
.perigon-button-wrap { width: auto !important; min-width: 114px; gap: 10px !important; }
.perigon-button-icon-wrap { flex: 0 0 20px !important; width: 20px !important; height: 20px !important; display: flex !important; align-items: center; justify-content: center; }
.perigon-button-icon-wrap img { width: 20px !important; height: 20px !important; display: block; }

@media (min-width: 992px) {
  #process .our-process-header-text-wrap { max-width: none !important; }
  #process h2.h2 { font-size: clamp(30px, 2.9vw, 42px) !important; line-height: 1.2 !important; }
}
@media (max-width: 991px) {
  #process h2.h2 { font-size: clamp(24px, 7vw, 36px) !important; line-height: 1.2 !important; text-wrap: balance; }
}
@media (max-width: 767px) {
  #process .process-h2-d-block { display: inline !important; }
}
/* Заголовки секций «Стоимость» и «Масштабирование» — такие же 42 px, как у остальных H2. */
@media (min-width: 992px) {
  #pricing .kubik-wide-header .h2,
  #modules .kubik-wide-header .h2 { font-size: clamp(30px, 2.9vw, 42px) !important; max-width: 1100px; }
}
@media (max-width: 767px) {
  #process h2.h2 { white-space: normal !important; overflow-wrap: normal; }
  #process .process-h2-d-block { display: inline !important; white-space: normal !important; }
  #process .process-h2-d-block::after { content: " "; }
}

@media (max-width: 991px) {
  #process h2.h2 { font-size: clamp(21px, 6.6vw, 34px) !important; }
}


/* ==========================================================================
   «Быстрый запуск» (#process), десктоп: блок ниже по высоте; заголовок на уровне верха карточки,
   описание и кнопки — на уровне её низа.
   ========================================================================== */
@media (min-width: 992px) {
  #process .our-process-wrapper { min-height: 0 !important; padding-top: 48px !important; padding-bottom: 56px !important; }
  #process .card-slider-text-wrapper { min-height: 560px !important; height: auto !important; align-items: end !important; }
  #process .our-process-text-box { height: 490px !important; align-self: end !important; }
  .process-slider-mask { height: 490px !important; max-height: 490px !important; }
  .box-teams-seven-wrapper { height: 475px !important; }
  .box-teams-eight-wrapper { height: 460px !important; }
}
@media (min-width: 992px) {
  #process .process-slider .our-process-image-text-box { height: 490px !important; min-height: 0 !important; }
  #process .our-process-image-wrap { height: 250px !important; }
}
@media (min-width: 992px) and (max-width: 1279px) {
  #process .process-h2-d-block { white-space: normal !important; }
  #process h2.h2 { font-size: clamp(26px, 2.7vw, 34px) !important; }
}
@media (min-width: 992px) and (max-width: 1279px) {
  /* Текстовая колонка не заходит под карточку на узких десктопах. */
  #process .our-process-header-text-wrap,
  #process .our-process-text-dectlirs-wrap { max-width: 360px !important; }
}

/* ==========================================================================
   Иерархия: H1 крупнее всех H2 и крупнее цены в «ценнике» (десктоп, планшет, телефон).
   ========================================================================== */
@media (min-width: 992px) {
  .kh .agency-hero-text-wrap { max-width: 1300px !important; }
  .kh .agency-hero-text-wrap .agency-hero-fast-text-wrap .h1,
  .kh .agency-hero-text-wrap .kh-line2 .h1 { font-size: clamp(36px, 4.1vw, 66px) !important; line-height: 1.08 !important; }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(26px, 2.3vw, 38px) !important; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .kh .agency-hero-text-wrap .agency-hero-fast-text-wrap .h1,
  .kh .agency-hero-text-wrap .kh-line2 .h1 { font-size: clamp(30px, 4.4vw, 46px) !important; }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(22px, 3vw, 28px) !important; }
}

@media (max-width: 767px) {
  /* Заголовок как раньше (без переноса слова), мельче — то, что ниже него. */
  .kh .agency-hero-text-wrap .agency-hero-fast-text-wrap h1.h1 { font-size: min(34px, calc((100vw - 24px) / 15.4)) !important; hyphens: none !important; -webkit-hyphens: none !important; }
  .kh .agency-hero-secend-wrapper .display-text-two { font-size: clamp(18px, 5.4vw, 22px) !important; }
  .kh .agency-dectlies-wrap .text-default { font-size: clamp(13.5px, 3.9vw, 14.5px) !important; line-height: 1.5 !important; }
}

/* ==========================================================================
   Визуальные правки: кнопки слайдера процесса, текст над карточкой на телефоне,
   кнопка тарифа, цена в «Масштабировании».
   ========================================================================== */
/* «Назад» и «Далее» не слипаются: у Webflow left:126px при ширине левой кнопки ≥126px. */
@media (min-width: 992px) {
  .process-slider .perigon-button-wrap.next { left: 138px; }
}
/* Webflow ограничивает высоту текстового блока (max-height 200/250px) — описание заходило под карточку. */
@media (max-width: 991px) {
  #process .card-slider-text-wrapper { max-height: none; height: auto; }
}
/* «Запустить комплекс связки» помещается в одну строку на широких экранах. */
@media (min-width: 1280px) {
  #pricing .plans-pricing-item-button-wrap .button-normal-text,
  #pricing .plans-pricing-item-button-wrap .button-hover-text { font-size: 16px; }
}
/* «Индивидуальный расчет» не выходит за правый край карточки. */
@media (min-width: 768px) {
  #modules .plans-pricing-wrapper { flex-wrap: wrap !important; row-gap: 4px !important; }
}
@media (min-width: 992px) {
  #modules .plans-pricing-wrapper h4.h4 { font-size: clamp(21px, 1.75vw, 25px) !important; }
}