/* Configurator v3 — robust layout for USD/RUB and mobile. */
body.landing-rebuild #programs.programs-section {
  padding: 40px 0 124px !important;
}

@media (min-width: 701px) {
  body.landing-rebuild #how-it-works.clarity-section {
    padding-bottom: 32px !important;
  }
}

body.landing-rebuild #programs .configurator-intro {
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  gap: 28px !important;
  align-items: start !important;
  max-width: 1120px !important;
  margin: 0 0 36px !important;
}

body.landing-rebuild #programs .configurator-intro-index {
  width: 74px !important;
  min-height: 32px !important;
  margin-top: 7px !important;
  border-color: rgba(255, 255, 255, 0.13) !important;
  color: rgba(255, 255, 255, 0.44) !important;
  background: rgba(255, 255, 255, 0.02) !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-style: normal !important;
}

body.landing-rebuild #programs .configurator-intro h2 {
  max-width: 12ch !important;
  font-family: "Friday Alumni Sans", "Arial Narrow", sans-serif !important;
  font-size: clamp(4.4rem, 6.2vw, 7rem) !important;
  font-style: italic !important;
  font-weight: 900 !important;
  line-height: 0.82 !important;
  letter-spacing: -0.025em !important;
  text-transform: uppercase !important;
}

body.landing-rebuild #programs .configurator-intro p {
  max-width: 58ch !important;
  margin-top: 20px !important;
  color: rgba(255, 255, 255, 0.58) !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 1.05rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
}

body.landing-rebuild #programs .configurator-shell[data-configurator] {
  display: block !important;
  width: 100% !important;
  min-height: 0 !important;
  padding: 26px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 28px !important;
  background:
    radial-gradient(76% 120% at 100% 0%, rgba(239, 56, 50, 0.14), transparent 55%),
    linear-gradient(180deg, #1b1c1e, #151618) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body.landing-rebuild #programs .configurator-controls {
  display: grid !important;
  grid-template-columns: minmax(280px, 1.05fr) minmax(360px, 1fr) minmax(220px, 0.58fr) !important;
  gap: 18px !important;
  align-items: end !important;
  margin: 0 0 24px !important;
  padding: 0 0 24px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.landing-rebuild #programs .configurator-control-group,
body.landing-rebuild #programs .configurator-control-model,
body.landing-rebuild #programs .configurator-control-size,
body.landing-rebuild #programs .configurator-control-currency {
  grid-column: auto !important;
  grid-row: auto !important;
  min-width: 0 !important;
}

body.landing-rebuild #programs .configurator-control-label {
  display: block !important;
  margin: 0 0 9px !important;
  color: rgba(255, 255, 255, 0.5) !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.7rem !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

body.landing-rebuild #programs .configurator-model-row,
body.landing-rebuild #programs .configurator-currency-switch {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 4px !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 4px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
  border-radius: 15px !important;
  background: #0f1012 !important;
}

body.landing-rebuild #programs .configurator-model,
body.landing-rebuild #programs .configurator-currency-chip {
  position: static !important;
  inset: auto !important;
  grid-column: auto !important;
  grid-row: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 42px !important;
  min-height: 42px !important;
  max-height: 42px !important;
  padding: 0 14px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: rgba(255, 255, 255, 0.62) !important;
  box-shadow: none !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-style: normal !important;
  font-weight: 800 !important;
}

body.landing-rebuild #programs .configurator-model.is-active,
body.landing-rebuild #programs .configurator-currency-chip.is-active {
  background: #f3f2ef !important;
  color: #101113 !important;
  box-shadow: 0 7px 20px rgba(0, 0, 0, 0.24) !important;
}

body.landing-rebuild #programs .configurator-model-icon,
body.landing-rebuild #programs .configurator-model strong,
body.landing-rebuild #programs .configurator-model small,
body.landing-rebuild #programs .configurator-model-tag {
  display: none !important;
}

body.landing-rebuild #programs .configurator-model-kicker {
  display: block !important;
  margin: 0 !important;
  color: inherit !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.88rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
}

body.landing-rebuild #programs .configurator-size-row {
  display: grid !important;
  grid-template-columns: repeat(var(--config-size-count, 4), minmax(0, 1fr)) !important;
  gap: 7px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.landing-rebuild #programs .configurator-size-chip,
body.landing-rebuild #programs .configurator-size-chip[hidden],
body.landing-rebuild #programs .configurator-size-chip.is-hidden {
  position: static !important;
  transform: none !important;
}

body.landing-rebuild #programs .configurator-size-chip[hidden],
body.landing-rebuild #programs .configurator-size-chip.is-hidden {
  display: none !important;
}

body.landing-rebuild #programs .configurator-size-chip:not([hidden]):not(.is-hidden) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.035) !important;
  color: rgba(255, 255, 255, 0.64) !important;
  box-shadow: none !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.82rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
}

body.landing-rebuild #programs .configurator-size-chip.is-active:not([hidden]) {
  border-color: #ef3832 !important;
  background: #ef3832 !important;
  color: #fff !important;
  box-shadow: 0 10px 26px rgba(239, 56, 50, 0.2) !important;
}

body.landing-rebuild #programs .configurator-currency-row {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.landing-rebuild #programs .configurator-currency-chip {
  gap: 7px !important;
  font-size: 0.8rem !important;
}

body.landing-rebuild #programs .configurator-currency-chip strong {
  display: inline !important;
  margin: 0 !important;
  color: inherit !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.8rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1 !important;
}

body.landing-rebuild #programs .configurator-currency-flag {
  display: grid !important;
  place-items: center !important;
  width: 19px !important;
  min-width: 19px !important;
  height: 19px !important;
  border-radius: 50% !important;
  background: rgba(127, 127, 127, 0.14) !important;
  color: inherit !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.7rem !important;
  font-style: normal !important;
  font-weight: 900 !important;
}

body.landing-rebuild #programs .configurator-card-rail {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}

body.landing-rebuild #programs .configurator-shell[data-currency="RUB"] .configurator-card-rail {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

body.landing-rebuild #programs .configurator-offer-card {
  position: relative !important;
  inset: auto !important;
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 416px !important;
  padding: 20px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, 0.085) !important;
  border-radius: 20px !important;
  background: rgba(12, 13, 15, 0.72) !important;
  color: #f6f6f4 !important;
  opacity: 0.82 !important;
  transform: none !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: border-color 180ms ease, background-color 180ms ease, opacity 180ms ease, transform 180ms ease !important;
}

body.landing-rebuild #programs .configurator-offer-card:not(.is-active):hover {
  border-color: rgba(255, 255, 255, 0.22) !important;
  opacity: 0.94 !important;
  transform: translateY(-2px) !important;
}

body.landing-rebuild #programs .configurator-offer-card:focus-visible {
  outline: 2px solid rgba(239, 56, 50, 0.92) !important;
  outline-offset: 3px !important;
}

body.landing-rebuild #programs .configurator-offer-card.is-active {
  border-color: rgba(239, 56, 50, 0.82) !important;
  background:
    linear-gradient(180deg, rgba(239, 56, 50, 0.13), transparent 42%),
    rgba(10, 11, 13, 0.96) !important;
  opacity: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
}

body.landing-rebuild #programs .configurator-offer-head {
  display: grid !important;
  gap: 7px !important;
  justify-items: start !important;
  text-align: left !important;
}

body.landing-rebuild #programs .configurator-offer-head span {
  color: rgba(255, 255, 255, 0.42) !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.63rem !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
}

body.landing-rebuild #programs .configurator-offer-head strong {
  max-width: 100% !important;
  color: #fff !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: clamp(2rem, 2.55vw, 2.85rem) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 0.96 !important;
  letter-spacing: -0.045em !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}

body.landing-rebuild #programs .configurator-shell[data-currency="RUB"] .configurator-offer-head strong {
  font-size: clamp(1.42rem, 1.9vw, 2.15rem) !important;
}

body.landing-rebuild #programs .configurator-offer-fee {
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 20px !important;
  padding: 13px 14px !important;
  border: 1px solid rgba(255, 255, 255, 0.065) !important;
  border-radius: 13px !important;
  background: rgba(255, 255, 255, 0.035) !important;
}

body.landing-rebuild #programs .configurator-offer-fee span,
body.landing-rebuild #programs .configurator-offer-rule span,
body.landing-rebuild #programs .configurator-offer-rule strong,
body.landing-rebuild #programs .configurator-offer-phase em,
body.landing-rebuild #programs .configurator-offer-phase strong,
body.landing-rebuild #programs .configurator-offer-cta {
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-style: normal !important;
}

body.landing-rebuild #programs .configurator-offer-fee span {
  color: rgba(255, 255, 255, 0.46) !important;
  font-size: 0.67rem !important;
  font-weight: 500 !important;
}

body.landing-rebuild #programs .configurator-offer-fee strong {
  color: #fff !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 1.16rem !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

body.landing-rebuild #programs .configurator-offer-rules {
  display: grid !important;
  margin-top: 16px !important;
}

body.landing-rebuild #programs .configurator-offer-rule {
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(96px, 1.1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 42px !important;
  padding: 10px 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.065) !important;
}

body.landing-rebuild #programs .configurator-offer-rule > span {
  min-width: 0 !important;
  color: rgba(255, 255, 255, 0.56) !important;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
}

body.landing-rebuild #programs .configurator-offer-rule > strong,
body.landing-rebuild #programs .configurator-offer-rule-value {
  min-width: 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-size: 0.72rem !important;
  font-style: normal !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-align: right !important;
  overflow-wrap: anywhere !important;
}

body.landing-rebuild #programs .configurator-offer-rule-value-phases {
  display: grid !important;
  gap: 2px !important;
}

body.landing-rebuild #programs .configurator-offer-phase {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 6px !important;
}

body.landing-rebuild #programs .configurator-offer-phase em {
  color: rgba(255, 255, 255, 0.4) !important;
  font-size: 0.55rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

body.landing-rebuild #programs .configurator-offer-cta {
  order: 9 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 50px !important;
  margin-top: auto !important;
  padding: 0 14px !important;
  border-radius: 13px !important;
  background: #ef3832 !important;
  color: #fff !important;
  font-size: 0.8rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

body.landing-rebuild #programs .configurator-addon-footer {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  margin-top: 22px !important;
  padding: 20px 0 0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.075) !important;
}

body.landing-rebuild #programs .configurator-addon-label,
body.landing-rebuild #programs .configurator-addon-list span {
  font-family: "Friday Roboto", Roboto, Arial, sans-serif !important;
  font-style: normal !important;
}

@media (max-width: 1180px) {
  body.landing-rebuild #programs .configurator-controls {
    grid-template-columns: minmax(260px, 1fr) minmax(320px, 1fr) !important;
  }

  body.landing-rebuild #programs .configurator-control-currency {
    grid-column: 1 / -1 !important;
  }

  body.landing-rebuild #programs .configurator-currency-switch {
    width: min(360px, 100%) !important;
  }

  body.landing-rebuild #programs .configurator-card-rail,
  body.landing-rebuild #programs .configurator-shell[data-currency="RUB"] .configurator-card-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 700px) {
  body.landing-rebuild #programs.programs-section {
    padding: 42px 0 76px !important;
  }

  body.landing-rebuild #programs .configurator-intro {
    display: block !important;
    margin-bottom: 24px !important;
  }

  body.landing-rebuild #programs .configurator-intro-index {
    display: none !important;
  }

  body.landing-rebuild #programs .configurator-intro h2 {
    max-width: 10ch !important;
    font-size: clamp(2.75rem, 12vw, 3.5rem) !important;
    line-height: 0.86 !important;
  }

  body.landing-rebuild #programs .configurator-intro p {
    margin-top: 16px !important;
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
  }

  body.landing-rebuild #programs .configurator-shell[data-configurator] {
    padding: 16px !important;
    border-radius: 22px !important;
  }

  body.landing-rebuild #programs .configurator-controls {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-bottom: 18px !important;
    padding-bottom: 18px !important;
  }

  body.landing-rebuild #programs .configurator-control-currency {
    grid-column: auto !important;
  }

  body.landing-rebuild #programs .configurator-currency-switch {
    width: 100% !important;
  }

  body.landing-rebuild #programs .configurator-size-row {
    display: grid !important;
    grid-template-columns: repeat(var(--config-size-count, 4), minmax(68px, 1fr)) !important;
    gap: 6px !important;
    width: 100% !important;
    overflow-x: auto !important;
    scrollbar-width: none !important;
  }

  body.landing-rebuild #programs .configurator-size-row::-webkit-scrollbar {
    display: none !important;
  }

  body.landing-rebuild #programs .configurator-size-chip:not([hidden]):not(.is-hidden) {
    height: 48px !important;
    min-height: 48px !important;
  }

  body.landing-rebuild #programs .configurator-card-rail,
  body.landing-rebuild #programs .configurator-shell[data-currency="RUB"] .configurator-card-rail {
    display: flex !important;
    align-items: stretch !important;
    gap: 12px !important;
    width: calc(100% + 16px) !important;
    margin-right: -16px !important;
    padding: 0 16px 4px 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    scroll-padding-inline: 0 16px !important;
    scroll-snap-type: x proximity !important;
    overscroll-behavior-inline: contain !important;
    touch-action: pan-x pan-y !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  body.landing-rebuild #programs .configurator-card-rail::-webkit-scrollbar {
    display: none !important;
  }

  body.landing-rebuild #programs .configurator-offer-card,
  body.landing-rebuild #programs .configurator-offer-card.is-active {
    display: flex !important;
    flex: 0 0 calc(100% - 28px) !important;
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
    min-height: 420px !important;
    padding: 20px !important;
    scroll-snap-align: start !important;
  }

  body.landing-rebuild #programs .configurator-shell[data-currency="RUB"] .configurator-offer-head strong {
    font-size: clamp(2rem, 10vw, 2.65rem) !important;
  }

  body.landing-rebuild #programs .configurator-addon-footer {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 10px !important;
  }
}
