@import url(/normalize.css);

.container {
  width: 1600px;
}


/* header */
.header_wrp {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  box-sizing: border-box;
}

.header_left_nav {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}

.header_nav_menu {
  margin-right: 30px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.nav_menu {
  display: flex;
  cursor: pointer;
}

body.light .menu_title:hover {
  color: #333232;
}

body.dark .menu_title:hover {
  color: #F3F3F3;
}


.nav_menu > *:not(:last-child) {
  margin-right: 40px;
}

.nav_menu_button {
  display: none;
}

.logo {
  height: 64px;
  width: 76px;
  margin-right: 40px;
}

body.light .logo {
  background: url(./assets/Logo_light.svg) no-repeat center center;
}

body.dark .logo {
  background: url(./assets/Logo_dark.svg) no-repeat center center;
}

.header_option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 637px;
}




/* lang-switcher */

.header_lang_switcher {
  width: 100px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  z-index: 10;
}

#lang-switcher {
  width: 100px;
}

body.light nav {
  color: #595959;
}

.header_lang_hover {
  display: flex;
  align-items: center;
  justify-content: center;
}

.header_lang_hover::before {
  content: "";
  position: absolute;
  left: 6%;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 28px;
  background-color: #E8E8E8;
}

.header_lang_switcher_icon {
  width: 16px;
  height: 16px;
  margin-right: 3px;
}
body.light .header_lang_switcher_icon {
  background: url(./assets/icons/switcher_icon_light.svg);
}
body.dark .header_lang_switcher_icon {
  background: url(./assets/icons/switcher_icon_dark.svg);
}

.swicher_arrow_icon {
  width: 14px;
  height: 14px;
  margin-left: 4px;
  transition: transform 0.3s ease;
}
body.light .swicher_arrow_icon {
  background: url(./assets/icons/header_language_dropdown_icon_light.svg);
}
body.dark .swicher_arrow_icon {
  background: url(./assets/icons/header_language_dropdown_icon_dark.svg);
}

.header_lang_hover:hover .swicher_arrow_icon {
  transform: rotate(180deg);
}

#selected-lang {
  cursor: pointer;
}

.lang_switcher-wrp {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lang_switcher-wrp ul {
  margin:0;
  padding:0;
  list-style: none;
  display: inline-block;
}
.lang_switcher-wrp li {
  cursor: pointer;
}
.lang_switcher-wrp li ul {
  display: none;
}

.lang_switcher-wrp li:hover > ul {
  display: block;
}

.lang_switcher-wrp li {
  position: relative;
  padding: 8px 0;   
}

.lang_switcher-wrp li ul {
  position: absolute;
  top: 100%;
  left: 28;
  display: none;
  width: 64px;
  border-radius: 20px;
  box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
}

body.light .lang_switcher-wrp li:hover ul {
  background: #fff;
}

body.dark .lang_switcher-wrp li:hover ul {
  background: #595959;
}

.lang_switcher-wrp li ul li {
  text-align: left;
  background: transparent;
  padding: 15px 15px;
  padding-bottom:0;
  z-index: 2;
  font-size: 15px;
}

body.light .lang_switcher-wrp li ul li {
  color: var(--text);
}

body.dark .lang_switcher-wrp li ul li {
  color: var(--text);
}

.lang_switcher-wrp li ul li:last-of-type {
  padding-bottom: 15px;
}

.lang_switcher-wrp li ul li span {
  padding-left: 5px;
}

body.light .lang_switcher-wrp li ul li span:hover, .lang_switcher-wrp li ul li span.active {
  color: var(--hover);
}

body.dark .lang_switcher-wrp li ul li span:hover, .lang_switcher-wrp li ul li span.active {
  color: var(--hover);
}


.header_lang-options li:not(:last-child)::after {
  content: "";
  display: block;
  height: 1px;
  margin-top: 8px;
  margin-left: 4px;
  margin-right: 4px;  
}

body.light .header_lang-options li:not(:last-child)::after {
  background-color: #E8E8E8;
}

body.dark .header_lang-options li:not(:last-child)::after {
  background-color: #8B8B8B;
}

/* theme switcher */

.theme-switch {
  position: relative;
  width: 64px;
  height: 34px;
}

.theme-switch input {
  display: none;
}

.switch-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 30px;
  padding: 0 8px;
  cursor: pointer;
  position: relative;
  height: 100%;
  transition: background-color 0.3s;
}

.switch-label .icon {
  width: 16px;
  height: 16px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  z-index: 2;
}

body.light .switch-label .sun {
  background-image: url(/assets/icons/switcher_theme_light_sun_icon.svg);
}

body.light .switch-label .moon {
  background-image: url(./assets/icons/switcher_theme_light_moon_icon.png);
}

body.dark .switch-label .sun {
  background-image: url(/assets/icons/switcher_theme_dark_sun_icon.svg);
}

body.dark .switch-label .moon {
  background-image: url(./assets/icons/switcher_theme_dark_moon_icon.svg);
}

.slider {
  position: absolute;
  display: flex;
  top: 4.5px;
  left: 3.5px;
  width: 25px;
  height: 25px;
  background-color: var(--primary);
  border-radius: 50%;
  transition: transform 0.3s ease;
  z-index: 1;
}

#theme-toggle:checked + .switch-label .slider {
  transform: translateX(29px);
}

body.dark .switch-label {
  background-color: #3e3e3e;
}
body.light .switch-label {
  background-color: #F3F4F5;
}

body.dark .switch-label:hover {
  background-color: #595959;
}
body.light .switch-label:hover {
  background-color: #DDDDDD;
}

.header_primary {
  width: 237px;
}

.header_secondary {
  width: 182px;
}

#menu {
  display: none;
}

/* main */

/* About section */

.about_section {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin-top: 147px;
}

@media (min-width: 769px) {
  .about_section {
    position: relative;
  }
}

.about_section_icons_block {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 32px;
}

.about_section_icon_elem {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.icons_text {
  display: inline-block;
  margin-top: 4px;
}

.icon_item {
  width: 52px;
  height: 52px;
  padding: 10px;
  border: 2px solid #c3c3c351;
  border-radius: 50%;
  background-repeat: no-repeat;
  background-position: center;
}

body.light .about_section-create_item {
  background-image: url(./assets/icons/about_section_creating_icon_light.svg);
}
body.light .about_section-manage_item {
  background-image: url(./assets/icons/about_section_manage_icon_light.svg);
}
body.light .about_section-analytic_item {
  background-image: url(./assets/icons/about_section_analytic_icon_light.svg);
}
body.light .about_section-more_item {
  background-image: url(./assets/icons/about_section_more_icon_light.svg);
}

body.dark .about_section-create_item {
  background-image: url(./assets/icons/about_section_creating_icon_dark.svg);
}
body.dark .about_section-manage_item {
  background-image: url(./assets/icons/about_section_manage_icon_dark.svg);
}
body.dark .about_section-analytic_item {
  background-image: url(./assets/icons/about_section_analytic_icon_dark.svg);
}
body.dark .about_section-more_item {
  background-image: url(./assets/icons/about_section_more_icon_dark.svg);
}

#about_section-title {
  font-size: 80px;
  width: 886px;
  text-align: center;
  margin: 16px 0 24px 0;
}

#about_section-desc {
  width: 698px;
  text-align: center;
  margin-bottom: 40px;
  font-size: 20px;
  height: 46px;
}

.menu_actions_button {
  display: none;
}

.about_section-floating {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 30px;
  transform-origin: center;
  overflow: hidden;
  z-index: 1;
  border: 1px solid;
}

body.light .about_section-floating {
  border-color: #E8E8E8;
}
body.dark .about_section-floating {
  border-color: #333232;
}

.about_section-floating .icon-inner {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 10px;
  border-radius: 20px;
}

body.light .about_section-floating .icon-inner {
  color: #222;
  background-color: #ffffff;
}

body.dark .about_section-floating .icon-inner {
  color: #DDDDDD;
  background-color: #333232;
}




  /* picture in about section whith absolute position */

  /* Lead */

  .lead_inner {
    width: 153px;
    height: 140px;
  }

  .about_section-floating.lead-img {
    width: 173px;
    height: 160px;
    transform: rotate(-10deg);
    left: calc(50% - 799px);
    top: calc(50% - 190px);
  }

  .floating_text {
    font-weight: 300;
  }
  body.light .floating_text {
    color: #8B8B8B;
  }
  body.dark .floating_text {
    color: #8B8B8B;
  }

  .about_section_floating_text-vertical {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    height: 100%;
  }

  .floating_text_subitem {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  .floating_primary_text {
    font-size: 20px;
    margin-bottom: 6px;
  }

  body.light .floating_primary_text {
    color: #000000;
  }
  body.dark .floating_primary_text {
    color: #F3F3F3;
  }

  .about_section_floating_text-horisontal {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
  }

  /* Date */

  .date_inner {
    width: 168px;
    height: 46px;
  }

  .about_section-floating.date-img {
    width: 188px;
    height: 66px;
    transform: rotate(6deg);
    left: calc(50% - 670px);
    top: calc(50% - 10px);
  }


  body.light .date_img {
    background: url(./assets/icons/date_range_icon_dark.svg) center center;
  }
  body.dark .date_img {
    background: url(./assets/icons/date_range_icon_light.svg) center center;
  }

  .date_img {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }

  /* Export */
  .export_inner {
    width: 139px;
    height: 46px;
  }

  .about_section-floating.export-img {
    width: 159px;
    height: 66px;
    transform: rotate(-15deg);
    left: calc(50% + 600px);
    top: calc(50% - 240px);
  }

  .export_inner_img {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }

  body.light .export_inner_img {
    background: url(./assets/icons/export_icon_light.svg) center center;
  }
  body.dark .export_inner_img {
    background: url(./assets/icons/export_icon_dark.svg) center center;
  }

  /* Valid */
  .valid_inner {
    width: 153px;
    height: 140px;
  }

  .about_section-floating.valid-img {
    width: 173px;
    height: 160px;
    transform: rotate(15deg);
    left: calc(50% + 550px);
    top: calc(55% - 20px);
  }



  .about_section-actions {
    display: flex;
    flex-direction: row;
    padding: 0;
    width: 690px; 
    margin: 0 auto;
    flex-wrap: wrap;
    z-index: 2;
  }

  .about_section-actions > *:nth-child(1) {
    margin-right: 20px;
  }

  .about_section_button-elem {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
  }

  .about_section_button-item {
    width: 305px;
    height: 63px;
    font-size: 18px;
  }


  .actions_unpaid_item {
    width: 308px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    margin: 14px 0 0 0;
  }


  .actions_unpaid_img {
    margin-right: 6px;
    width: 16px;
    height: 16px;
  }

  body.light .date_img{
    background: url(./assets/icons/date_img_dark.svg) center center;
  }

  body.light .actions_unpaid_item {
    color: #8B8B8B;
  }

  body.dark .actions_unpaid_item {
    color: #DDDDDD;
  }

  body.dark .date_img{
    background: url(./assets/icons/date_img_light.svg) center center;
  }




  /* Decision section  */

.decision_section {
  border-radius: 30px;
  height: auto;
  position: relative;
  margin-top: 526px;
  padding: 236px 0 120px 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 120px;
}

body.light .decision_section {
  background-color: #ffffff;
}

body.dark .decision_section {
  background-color: #333232;
}

.image-border-wrapper {
  position: absolute; 
  left: 11%;
  top: -475px;
  transform: translateX(-50%);
  padding: 10px; 
  border: 2px solid #EDEDED; 
  box-sizing: content-box; 
  width: 75%; 
  height: auto;
  pointer-events: none;
  border-radius: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.decision_dashboard-preview {
  max-width: 100%;
  height: auto;
  display: block;
}


  .tilt-forward {
  transform: perspective(1500px) rotateX(-20deg);
  transition: transform 0.3s ease;
}



  .decision_button_img {
    width: 14px;
    height: 14px;
    margin-right: 6px;
  }

  body.light .decision_button_img {
    background: url(./assets/icons/decision_section_icon_light.svg) no-repeat center center;
  }

  body.dark .decision_button_img {
    background: url(./assets/icons/decision_section_icon_dark.svg) no-repeat center center;
  }

  .decision_section_title {
    font-size: 40px;
    font-weight: 600;
    width: 690px;
    text-align: center;
    margin-top: 10px;
  }

  body.dark .decision_section_title{
    color:#8B8B8B ;
  }

  .decision_section_text_item {
    font-size: 18px;
    font-weight: 400;
    margin: 20px 0 64px 0;
    text-align: center;
    width: 516px;
  }

  .reports_img_border {
    border: 1px solid #EDEDED;
    padding: 11.5px;
    border-radius: 18.5px;
  }

  .decision_section_reports_img {
    width: 1203px;
    height: 674px;
  }

  .decision_section_line {
    width: 1026px;
    height: 107px;
    margin: 12px 0;
  }

  .decision_section_line_mobile {
    display: none;
  }

  body.light .decision_section_line{
    background: url(./assets/descision_dection_line_light.png) no-repeat center center;
    
  }
  body.dark .decision_section_line{
    background: url(./assets/descision_dection_line_dark.png) no-repeat center center;
  }

  .decision_footer_elem {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 1318px;
  }

  .dicision_block {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 300px;
    text-align: center;
  }

  .decision_block_title {
    font-size: 22px;
    font-weight: 600;
  }

  body.light .decision_block_title{
    color: #333232;
  }
  body.dark .decision_block_title{
    color: #F3F3F3;
  }

  .decision_block_text {
    font-size: 16px;
  }

  body.light .decision_block_text{
    color: #595959;
  }
  body.dark .decision_block_text{
    color: #DDDDDD;
  }



  .decision_icon_border {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #E8E8E8;
    border-radius: 100px;
    width: 48px;
    height: 48px;
  }

  .elem_icon {
    width: 24px;
    height: 24px;
  }

  body.light .decision_analytic_icon {
    background: url(./assets/icons/decision_analytic_icon_light.svg) no-repeat center center;
  }
  body.light .decision_leads_icon {
    background: url(./assets/icons/decision_leads_icon_light.svg) no-repeat center center;
  }
  body.light .decision_def_icon {
    background: url(./assets/icons/decision_def_icon_light.svg) no-repeat center center;
  }
  body.light .decision_data_icon {
    background: url(./assets/icons/decision_data_icon_light.svg) no-repeat center center;
  }

  body.dark .decision_analytic_icon {
    background: url(./assets/icons/decision_analytic_icon_dark.svg) no-repeat center center;
  }
  body.dark .decision_leads_icon {
    background: url(./assets/icons/decision_leads_icon_dark.svg) no-repeat center center;
  }
  body.dark .decision_def_icon {
    background: url(./assets/icons/decision_def_icon_dark.svg) no-repeat center center;
  }
  body.dark .decision_data_icon {
    background: url(./assets/icons/decision_data_icon_dark.svg) no-repeat center center;
  }



  /* optimisation section */


  .optimisation-section {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .optimisation_button {
    width: 192px;
    height: 35px;
  }

  .optimisation_button_img {
    width: 14px;
    height: 14px;
    margin-right: 6px;
  }

  body.light .optimisation_button_img {
    background: url(./assets/icons/optimisation_section_button_light_icon.svg) no-repeat center center;
  }

  body.dark .optimisation_button_img {
    background: url(./assets/icons/optimisation_section_button_dark_icon.svg) no-repeat center center;
  }


  .optimisation_title {
    font-size: 40px;
    font-weight: 600;
    width: 899px;
    padding: 0 100px;
    text-align: center;
    margin: 12px 0 64px 0;
    text-align:center ;
  }

  .optimisation_player_section {
    height: 713px;
    position: relative;
  }

  .player_item {
    width: 1330px;
    height: 688px;
    background: #525252;
    border-radius: 20px;
    position: absolute;
    left: 50%;
    max-width: none;
    transform: translateX(-50%);
    max-width: none;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .under_player_item {
    width: 1600px;
    height: 284px;
    margin-top: 424px;
    border-radius: 60px;
  }

  body.light .under_player_item{
    background: #FFFFFF;
  }

  body.dark .under_player_item{
    background: #333232;
  }

  .player_play_icon_item {
    background: url(./assets/icons/optimisation_play_icon.svg);
    width: 58px;
    height: 64px;
  }

  .player_play_icon_item:hover {
    background: url(./assets/icons/optimisation_play_hover_icon.svg);
    width: 58px;
    height: 64px;
    transition: 0.2s;
  }

  .player_pause_icon_item {
    background: url(./assets/icons/optimisation_pause_icon.svg);
    width: 58px;
    height: 64px;
  }

  .player_pause_icon_item:hover {
    background: url(./assets/icons/optimisation_pause_hover_icon.svg);
    width: 58px;
    height: 64px;
    transition: 0.2s;
  }

  .hidden {
    display: none;
  }

  .optimisation_section_text_inner {
    font-size: 18px;
    font-weight: 400;
    width: 698px;
    padding: 0 100px;
    margin: 13px 0 40px 0;
    text-align: center;
  }

  body.light .optimisation_section_text_inner {
    color: #595959;   
  }
  body.dark .optimisation_section_text_inner {
    color: #DDDDDD;   
  }

  .performance-section {
    margin: 120px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .performance_button {
    width: 226px;
    height: 35px;
    font-size: 14px;
  }

  .performance_button_img {
    width: 14px;
    height: 14px;
    margin-right: 6px;
  }

  body.light .performance_button_img {
    background: url(./assets/icons/performans_section_main_button_light.svg) no-repeat center center;
  }

  body.dark .performance_button_img {
    background: url(./assets/icons/performans_section_main_button_dark.svg) no-repeat center center;
  }

  .performance-section_title {
    font-size: 40px;
    font-weight: 600;
    margin: 8px 0 64px 0;
    width: 790px;
    text-align: center;
  }

  .performance_section_grid-container {
    display: flex;
    flex-direction: column;
    grid-template-columns: repeat(6, 1fr);
    grid-auto-rows: auto;
    gap: 20px;
    width: 1600px;
  }

  .item_midle_s_border {
    width: 926px;
  } 
  .item_midle_f {
    position: relative;
    overflow: hidden;
  }

  .item_midle_f::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    top: 10%;
    left: -10%;
    pointer-events: none;
    filter: blur(80px);
    background:
      radial-gradient(ellipse at 50% center, rgba(255, 0, 0, 0.7) 0%, transparent 50%),
      radial-gradient(ellipse at 60% center, rgba(255, 0, 0, 0.4) 0%, transparent 50%);
    z-index: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(90px);
    transition: opacity 0.9s ease, transform 1.5s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0.6s;
  }
  .item_midle_f.visible::after {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    transition-delay: 0.5s;
  }

  .performance_border_item {
    position: relative;
    border-radius: 20px;
    padding: 10px;
  }
  body.light .performance_border_item {
    border: 1px solid #E8E8E8;
  }
  body.dark .performance_border_item {
    border: 1px solid #333232;
  }

  .item {
    padding: 32px;
    border-radius: 20px;
    font-weight: bold;
  }
  body.light .item {
    background-color: #ffffff;
  }
  body.dark .item {
    background-color: #333232;
  }


  .performance_title_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 570px;
  }

  .item_title {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 8px;
  }
  body.light .item_title {
    color: #333232;
  }
  body.dark .item_title {
    color: #E8E8E8;
  }

  #perfotmance_integration_text {
    width: 465px;
  }

  #performance_text_analytic {
    margin-bottom: 97px;
  }

  #performance_text_check_lead {
    width: 436px;
  }

  .item_text_inner {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 20px;
    width: 570px;
    display: flex;
    justify-content: flex-start;
  }
  body.light .item_text_inner {
    color: #595959;
  }
  body.dark .item_text_inner {
    color: #E8E8E8;
  }

  .row-1 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    width: 1600px;
  }
  .item_top {
    height: 575px;
    width: 770px;
    text-align: center;
    border-radius: 20px;
    font-weight: bold;
    position: relative;
    overflow: hidden;
  }

  .item_greed::before {
    content: "";
    position: absolute;
    inset: 0;
    background-size: 160px 160px;
    z-index: 0;
    pointer-events: none;
    opacity: 0.4;
    mask-image: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 1) 0%,
      rgba(0, 0, 0, 1) 30%,
      rgba(0, 0, 0, 0) 80%
    );
    mask-repeat: no-repeat;
    mask-size: 100% 100%;

    -webkit-mask-image: linear-gradient(
      to bottom,
      rgba(0, 0, 0, 1) 75%,
      rgba(0, 0, 0, 1) 30%,
      rgba(0, 0, 0, 0) 60%
    );
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
  }
  body.light .item_greed::before{
    background-image: 
      linear-gradient(to right, #DDDDDD 0.5px, transparent 1px),
      linear-gradient(to bottom, #DDDDDD 0.5px, transparent 1px);
  }
  body.dark .item_greed::before{
    background-image: 
      linear-gradient(to right, #4e4e4e 0.5px, transparent 1px),
      linear-gradient(to bottom, #4e4e4e 0.5px, transparent 1px);
  }

  .chart-wrapper {
    max-height: 326px;
    max-width: 570px;
    box-sizing: border-box;
    margin-right: auto;
    margin-left: auto;
  }

  .chart {
    position: relative;
    height: 326px;
    width: 100%;
    display: flex;
    align-items: flex-end;
    padding-left: 50px; 
    padding-right: 20px;
    box-sizing: border-box;
  }
  body.light .chart{
    background-color: #ffffff;
    border-bottom: 1px solid #ECECEC;
  }
  body.dark .chart{
    background-color: #333232;
    border-bottom: 2px solid ;
  }

 
  .bars {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    width: 100%;
    height: 100%;
  }

  .bar {
    width: 45px;
    height: calc((var(--value) / var(--max-value)) * 100%);
    background-color: #666;
    border-radius: 16px 16px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 14px;
    color: #fff;
    position: relative;
  }

  .bar-wrapper {
    position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    display: flex;
    z-index: 2;
  }

  .bar-label {
    position: absolute;
    bottom: -24px; 
    font-size: 14px;
    color: #fff;
    z-index: 2;
    white-space: nowrap;
  }

  .bar.highlighted {
    background-color: #ffc926;
  }

  .chart-line {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #555;
    z-index: 1; 
  }

  .chart-line span {
    position: absolute;
    left: 0;
    transform: translateY(-50%);
    font-size: 14px;
    padding: 2px 6px;
    z-index: 2;
  }
  body.light .chart-line span{
    color: #2E2A2A;
    background-color: #fff;
  }
  body.dark .chart-line span{
    background-color: #333;
    color: #eee;
  }

  .chart-line.base-line {
    top: calc(100% - 28px); 
    z-index: 3;
  }

  .chart-line.base-line span {
    transform: translateY(-100%);
  }

  .bar-label {
    font-size: 14px;
    z-index: 1; 
  }
  body.light .bar-label{
    color: #2E2A2A;
  }
  body.dark .bar-label{
    color: #ffffff;
  }


  .performance_integration_img_block {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin: auto 50px;
    height: 80%;
  }
  .performance_integration_img_block::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    top: 10%;
    left: -10%;
    pointer-events: none;
    opacity: 0.9;
    filter: blur(20px);

    background:
      radial-gradient(ellipse at 40% center, rgba(255, 255, 0, 0.2) 0%, transparent 50%),
      radial-gradient(ellipse at 66% center, rgba(255, 0, 0, 0.5) 0%, transparent 50%);
  } 


  .performance_img_border,
  .performance_setting_border {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
  }

  .performance_img_border {
    width: 104px;
    height: 104px;
  }
  body.light .performance_img_border {
    border: 1px solid #E8E8E8;
  }
  body.dark .performance_img_border {
    border: 1px solid #595959;
  }

  .performance_setting_border {
    height: 144px;
    width: 144px;
    padding: 10px;
    border-radius: 20px;
  }
  body.light .performance_setting_border {
    border: 1px solid #E8E8E8;
  }
  body.dark .performance_setting_border {
    border: 1px solid #595959;
  }

  .performans_social_apply_icon {
    width: 124px;
    height: 124px;
    background-image: url(./assets/icons/performans_social_apply_icon.svg);
  }

  .performans_social_setting_light_icon,
  .performans_social_apply_icon {
    position: absolute;
    left: 10px;
    top: 10px;
    transition: opacity 1.5s, transform 1.5s;
    opacity: 0;
    z-index: 1;
  }

.performance_setting_border .icon-setting-active {
  opacity: 1;
  z-index: 1;
  transform: translateY(0) scale(1);
}

.performance_setting_border .icon-apply-active {
  opacity: 1;
  z-index: 0;
  transform: translateY(0) scale(1);
}


  .performance_keitaro_img,
  .performance_telegram_img,
  .performans_social_setting_light_icon {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 20px;
  }

  .performance_keitaro_img,
  .performance_telegram_img {
    width: 84px;
    height: 84px;
  }
  .performans_social_setting_light_icon {
    width: 124px;
    height: 124px;
  }

  body.light .performance_keitaro_img {
    background-image: url(./assets/icons/performance_keitaro_img_light.svg);
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5);
  }
  body.dark .performance_keitaro_img {
    background-image: url(./assets/icons/performance_keitaro_img_dark.svg);
  }

  body.light .performance_telegram_img {
    background-image: url(./assets/icons/performance_telegram_img_light.svg);
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5);
  }
  body.dark .performance_telegram_img {
    background-image: url(./assets/icons/performance_telegram_img_dark.svg);
  }

  body.light .performans_social_setting_light_icon {
    background-image: url(./assets/icons/performans_social_setting_light_icon.svg);
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5);
  }
  body.dark .performans_social_setting_light_icon {
    background-image: url(./assets/icons/performans_social_setting_dark_icon.svg);
  }


.dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  z-index: 2;
}

.dot-yellow-left {
  background-color: yellow;
  left: -6px;
  top: 50%;
  transform: translateY(-50%);
}
.dot-yellow-left::after {
  content: '';
  position: absolute;
  top: -55px;
  left: 15.5px;
  transform: translateX(-50%);
  width: 1px;
  height: 110px;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 0, 0) 0%,
    yellow 20%,
    yellow 90%,
    rgba(255, 255, 0, 0) 100%
  );
  z-index: 1;
  border-radius: 20px;
}

.dot-yellow-right {
  background-color: yellow;
  right: -5px;
  top: 50%;
  transform: translateY(-50%);
}
.dot-yellow-right:after {  
  content: '';
  position: absolute;
  top:-25px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 60px;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 0, 0) 0%,
    yellow 40%,
    yellow 60%,
    rgba(255, 255, 0, 0) 100%
  );
  z-index: 1;
}

.dot-red-left {
  background-color: red;
  left: -5.5px;
  top: 50%;
  transform: translateY(-50%);
}
.dot-red-left::after {
  content: '';
  position: absolute;
  top: -25px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 60px;
  background: linear-gradient(
    to bottom,
    rgba(255, 0, 0, 0) 0%,
    red 40%,
    red 60%,
    rgba(255, 0, 0, 0) 100%
  );
  z-index: 1;
}

.dot-red-right {
  background-color: red;
  right: -5px;
  top: 50%;
  transform: translateY(-50%);
}
.dot-red-right::after {
  content: '';
  position: absolute;
  top: -55px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 110px;
  background: linear-gradient(
    to bottom,
    rgba(255, 0, 0, 0) 0%,
    red 40%,
    red 60%,
    rgba(255, 0, 0, 0) 100%
  );
  z-index: 1;
}

.connector {
  position: absolute;
  height: 2px;
  background-color: yellow; 
  z-index: 0;
}


.connector-yellow {
  top: 55.5%;
  left: 188px; 
  width: calc(50% - 258px); 
  background-color: yellow;
  transform: translateY(-50%);
}


.connector-red {
  top: 55.5%;
  right: 188px; 
  width: calc(50% - 258px);
  background-color: red;  
  transform: translateY(-70%);

}

.performance_integration_img_block::before,
.dot,
.dot::after,
.connector {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 1s ease, transform 0.5s ease;
}

.performance_integration_img_block.show-dots .dot,
.performance_integration_img_block.show-dots .dot::after,
.performance_integration_img_block.show-dots .connector {
  opacity: 1;
  transform: scale(1);
}

.performance_integration_img_block.show-bg::before {
  opacity: 0.9;
}


  .performance_bottom_img {
    width: 436px;
    height: 440px;
  }
  body.light .performance_backup_img {
    background-image: url(./assets/performance_backup_img_light.svg) no-repeat center center;
  }
  body.dark .performance_backup_img {
    background-image: url(./assets/performance_backup_img_dark.svg) no-repeat center center;
  }
  body.light .performance_total-leads_img {
    background-image: url(./assets/performance_total-leads_img_light.svg) no-repeat center center;
  }
  body.dark .performance_total-leads_img {
    background-image: url(./assets/performance_total-leads_img_dark.svg) no-repeat center center;
  }


  .row-2 {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 20px;
    width: 1600px;
  }


  .item_midle_f_container {
    width: 100%;
    height: 440px;
    position: relative;
    overflow: hidden;
    transform: translateY(0);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
  }

  .item_midle_f_container.visible {
    opacity: 0;
    visibility: visible;
    transform: translateY(-100px);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
  }

  .item_midle_f_container::after {
    content: "";
    position: absolute;
    bottom: 27px;
    right: 0;
    width: 150px;
    height: 100%; 
    pointer-events: none;
    z-index: 10;
  }
  body.light .item_midle_f_container::after {
    background: linear-gradient(to right, transparent 0%, #ffffff 100%);
  }
  body.dark .item_midle_f_container::after {
    background: linear-gradient(to right, transparent 0%, #333232 100%);
  }
  .item_midle_f_container::before {
    content: "";
    position: absolute;
    bottom: 27px;
    left: 0;
    top: 0;
    width: 72px;
    height: 440px; 
    pointer-events: none;
    z-index: 10;
    background: linear-gradient(to left,
      transparent 10%,
      rgba(255, 204, 51, 0.05) 98%,
      rgba(255, 204, 51, 0.4) 80%,
      #FFCC33 100%
    );
    border-radius: 70px;
  }

  .contact-card {
    border-radius: 13px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 15px;
    width: 219px;
    height: 120px;
    text-align: left;
    font-family: Arial, sans-serif;
    font-size: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-weight: 300;
  }
  body.light .contact-card {
    background: #ffffff;
    color: #212121;
  }
  body.dark .contact-card {
    background: #595959;
    color: #DDDDDD;
  }
  
  .contact-card_border {
    border-radius: 19px;
    width: 229px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
  }
  body.light .contact-card_border {
    border:1px solid #E8E8E8;
  }
  body.dark .contact-card_border {
    border:1px solid #595959;
  }
  
  #contact-card_mexico {
    top: 250px;
    left: 180px;
  }
  #contact-card_spain {
    top: 100px;
    left: 379px;
  }
  #contact-card_arg {
    bottom: 230px;
    left: 75px;
  }

  .contact-card_title_block {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
  }

  .contact-card_title_elem {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
  }
  
  .contact-card_title {
    font-size: 12px;
  }
  body.light .contact-card_title {
    color: #333232;
  }
  body.dark .contact-card_title {
    color: #F3F3F3;
  }

  .contact-card_body {
    display: flex;
    flex-direction: column;
  }

  .contact-card_body > *:not(:last-child) {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); 
    padding-bottom: 5px;
    margin-bottom: 5px;
  }
  body.light .contact-card_body > *:not(:last-child) {
    border-bottom: 1px solid #333232;
  }
  body.dark .contact-card_body > *:not(:last-child) {
    border-bottom: 1px solid #DDDDDD;
  }
  
  .card_id {
    font-size: 8px;
  }
  body.light .card_id {
    color: #595959;
  }
  body.dark .card_id {
    color: #DDDDDD;
  }

  .contact-card .status {
    display: inline-block;
    padding: 4px 7px;
    color: #e0f7fa;
    border-radius: 12px;
    max-width: 56px;
    max-height: 20px;
    font-size: 8px;
    background-color: #00796b;
    cursor: pointer;
  }
  .contact-card .call-back {
    display: inline-block;
    padding: 4px 7px;
    background: #f44336;
    color: #fff;
    border-radius: 12px;
    text-decoration: none;
    max-width: 56px;
    max-height: 20px;
    font-size: 8px;
  }

  .country_icon,
  .phone_icon,
  .mail_icon {
    width: 10px;
    height: 10px;
    margin-right: 5px;
  }

  .contact_body_inner {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }

  body.light .country_icon {
    background: url(./assets/icons/country_cart_light_icon.svg) no-repeat center center;
  }
  body.dark .country_icon {
    background: url(./assets/icons/country_cart_dark_icon.svg) no-repeat center center;   
  }
  body.light .phone_icon {
    background: url(./assets/icons/phone_cart_light_icon.svg) no-repeat center center;   
  }
  body.dark .phone_icon {
    background: url(./assets/icons/phone_cart_dark_icon.svg) no-repeat center center;
  }
  body.light .mail_icon {
    background: url(./assets/icons/mail_cart_light_icon.svg) no-repeat center center;
  }
  body.dark .mail_icon {
    background: url(./assets/icons/mail_cart_dark_icon.svg) no-repeat center center;
  }

  .contact-card .flag {
    vertical-align: middle;
    margin-left: 3px;
    width: 10px;
    height: 10px;
  }

  .client_section_antiford_img {
  z-index: 2;
  width: 144px;
  height: 144px;
  margin: auto;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url(./assets/client_section_antiford_img.svg);
  position: relative;
  background-color: #fff;
  border-radius: 20px;
  position: absolute;
  top: 40%;
  left: 40%;
  opacity: 0;
  visibility: hidden;
  transform: translateY(90px);
  transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
}

body.light .client_section_antiford_img {
  background-color: #FFFFFF;
}

body.dark .client_section_antiford_img {
  background-color: #333232;
}

.client_section_antiford_img.fraud-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0.5s;
}
.client_section_antiford_img.fraud-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0.5s;
}



/* псевдоэлемент бордера оставляем без изменений */
.client_section_antiford_img::before {
  content: "";
  position: absolute;
  top: -10px;
  left: -10px;
  right: -10px;
  bottom: -10px;
  border: 1px solid #DDDDDD;
  border-radius: 20px;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}

  
  .fraud_floating_border {
    width: 214px;
    height: 138px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    position: absolute;
    top: 114px;
    left: 100px;
    z-index: 5;
  }
  body.light .fraud_floating_border{
    border: 1px solid #E8E8E8;
  }
  body.dark .fraud_floating_border{
    border: 1px solid #595959;
  }

  .fraud_floating_content {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  body.light .fraud_floating_content{
    background-color: #FFFFFF;
  }
  body.dark .fraud_floating_content{
    background-color: #595959;
  }
  
  .fraud_primary_text {
    margin: 16px 0 6px 0;
    font-size: 20px;
  }
  body.light .fraud_primary_text{
    color: #212121;
  }
  body.dark .fraud_primary_text{
    color: #F3F3F3;
  }

  body.light .fraud_floating_subtitle{
    color: #8B8B8B;
  }
  body.dark .fraud_floating_subtitle{
    color: #DDDDDD;
  }
  

  .item_midle_s {
    height: 575px;
    width: 906px;
    position: relative;
    overflow: hidden;
  }
  
  .item_midle_s_container {
    width: 842px;
    height: 440px;
    overflow: hidden;
    position: relative;
  }

  .contact-card .recall {
    display: inline-block;
    padding: 4px 7px;
    background: #A54AEA;
    color: #fff;
    border-radius: 12px;
    text-decoration: none;
    max-width: 56px;
    max-height: 20px;
    font-size: 8px;
    cursor: pointer;
  }

  #contact-card_arg_lead {
    transform: rotate(-6deg); 
    transform-origin: center center; 
    left: 80px;
    top: 290px;
    visibility: visible;
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    z-index: 2;
    transition-delay: 0.5s;
  }
  #contact-card_arg_lead:not(.fraud-visible) {
    opacity: 1;
    visibility: visible;
    transform: translateY(-180px) rotate(-6deg) ;
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    transition-delay: 0.3s;
  }
  
  
  #contact-card_spain_lead {
    transform: rotate(16deg); 
    transform-origin: center center; 
    left: 420px;
    top: 340px;
    position: relative;
    visibility: visible;
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    z-index: 2;
    transition-delay: 0.5s;
  }
  #contact-card_spain_lead:not(.fraud-visible) { 
    opacity: 1;
    visibility: visible;
    transform: rotate(16deg) translateY(-300px);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    transition-delay: 0.3s;
  }
  
  #contact-card_mexico_lead {
    top: 440px;
    left: 30%;
    visibility: visible;
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    z-index: 2;
    transition-delay: 0.5s;
  }
  #contact-card_mexico_lead:not(.fraud-visible) {
    opacity: 1;
    visibility: visible;
    transform: translateY(-260px);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    transition-delay: 0.3s;
  }

  .item_midle_s::after {
    content: "";
    position: absolute;
    bottom: 23px;
    left: 0;
    width: 100%;
    height: 210px; 
    pointer-events: none;
    z-index: 10;
  }
  body.light .item_midle_s::after {
    background: linear-gradient(to bottom, transparent 0%, #ffffff 100%);
  }
  body.dark .item_midle_s::after {
    background: linear-gradient(to bottom, transparent 0%, #333232 100%);
  }
  .border_card_lead {
    width: 317px;
    height: 166px;
  }
  .card_lead {
    width: 307px;
    height: 156px;
  }
  .lead_title {
    font-size: 16px;
  }
  .id_lead {
    font-size: 12px;
  }

  .flag_lead {
    width: 16px;
    height: 16px;
  }


  .row-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }

  .item_bot {
    width: 500px;
    height: 575px;
    overflow: hidden;
    position: relative;
  }
  .grdient::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    top: 10%;
    left: -10%;
    pointer-events: none;
    filter: blur(100px);
    background:
      radial-gradient(ellipse at 50% center, rgba(255, 255, 0, 0.7) 20%, transparent 20%),
      radial-gradient(ellipse at 50% center, rgba(255, 255, 0, 0.4) 10%, transparent 34%);
    z-index: 0;
    
  }


  .fin_main_block {
    position: relative;
    width: 436px;
    height: 440px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(90px);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    z-index: 2;
  }
  .fin_main_block:not(.fraud-visible) {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: opacity 0.9s ease, transform 1.5s ease, visibility 0s linear 0.6s;
    transition-delay: 0.2s;
  }

  .fin_floating_text {
    width: 153px;
    height: 140px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 12px;
    border-radius: 20px;
    font-size: 16px;
  }
  body.light .fin_floating_text {
    box-shadow: 0 4px 12px #E8E8E8;
    background-color: #ffffff;
  }
  body.dark .fin_floating_text {
    border:1px solid #595959;
    background-color: #595959;
    color: #DDDDDD;
  }

  
  .spend_floating_border {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 173px;
    height: 110px;
    border-radius: 30px;
    padding: 10px;
    position: absolute;
    left: -63px;
    top: -65px;
    z-index: 3;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    pointer-events: none;
  }
  body.light .spend_floating_border {
    border:1px solid #E8E8E8
  }
  body.dark .spend_floating_border {
    border:1px solid #595959;
  }
  .highlighted {
    position: relative;
  }
  .highlighted:hover .spend_floating_border {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .spend_floating_text_inner {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 12px;
  }
  body.light .spend_floating_text_inner {
    color: #212121;
    background-color:  #FFFFFF;
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5); 
  }
  body.dark .spend_floating_text_inner {
    background-color: #595959;
  }


  

  .fin_floating_text_border {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 163px;
    height: 160px;
    border-radius: 30px;
    padding: 10px;
  }
  body.light .fin_floating_text_border {
    border:1px solid #E8E8E8
  }
  body.dark .fin_floating_text_border {
    border:1px solid #595959;
  }

  .profit_item {
    position: absolute;
    left: 15%;
    top: 24%;
  }
  .profit_index {
    z-index: 1;
  }

  .revenue_item {
    position: absolute;
    left: 40%;
    top: 44%;
  }
  .revenue_index {
    z-index: 2;
  }

  .backup_main_container {
    width: 436px;
    height: 440px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 90px 0 35px 0;
  }

  .backup_border_item {
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
  }
  body.light .backup_border_item{
    border: 1px solid #E8E8E8;
    color: #8B8B8B;
  }
  body.dark .backup_border_item{
    border: 1px solid #595959;
    color: #F3F3F3;
  }

  .backup_item {
    border-radius: 20px;
  }
  body.light .backup_item{
    background-color: #ffffff;
  }
  body.dark .backup_item{
    background-color: #595959;
  }
  
  .backup_main_border_item {
    height: 164px;
    width: 164px;
  }
  
  .backup_main_item {
    width: 144px;
    height: 144px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  body.light .backup_main_item{
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5); 
  }
  
  .backup_upload_border_item {
    width: 341px;
    height: 108px;
  }
  
  .backup_upload_item {
    width: 321px;
    height: 88px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    padding: 12px;
  }
  body.light .backup_upload_item{
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5); 
  }

  .backup_upload_title_block {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
  }

  .backup_upload_logo {
    width: 47px;
    height: 35px;
    margin-right: 8px;
  }
  body.light .backup_upload_logo {
    background-image: url(./assets/Logo_light.svg);
    background-size: contain;
  }
  body.dark .backup_upload_logo {
    background: url(./assets/Logo_dark.svg);
    background-size: contain;
  }
  

  .backup_upload_img {
    height: 12px;
    width: 297px;
    border-radius: 20px;
    position: relative;
  }
  body.light .backup_upload_img{
    background-color: #ECECEC;
  }
  body.dark .backup_upload_img {
    background-color: #8B8B8B;
  }
  .backup_upload_img::before {
    content: "";
    position: absolute;
    bottom: 27px;
    left: 0;
    top: 0;
    width: 35px;
    height: 12px; 
    pointer-events: none;
    z-index: 10;
    background: linear-gradient(to left,#FFCC33 100%);
    border-radius: 70px;
  }

  .validaion_container {
    width: 436px;
    height: 440px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    padding-top: 87px;
    position: relative;
    overflow: hidden;
  }
  .validaion_container::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 210px; 
    pointer-events: none;
    z-index: 10;
  }
  body.light .validaion_container::after {
    background: linear-gradient(to bottom, transparent 0%, #ffffff 100%);
  }
  body.dark .validaion_container::after {
    background: linear-gradient(to bottom, transparent 0%, #333232 100%);
  }

  .validation_border {
    width: 310px;
    height: 66px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 30px;
  }
  body.light .validation_border{
    border: 1px solid #E8E8E8;
  }
  body.dark .validation_border{
    border: 1px solid #595959;
  }

  .validation_main_item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 290px;
    height: 46px;
  }

  .validation_item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    border-radius: 20px;
    padding: 12px;
  }

  body.light .validation_item{
    background-color: #ffffff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    color: #212121;
  }
  body.dark .validation_item{
    background-color: #595959;
    color: #DDDDDD;
  }

  .validation_new_item {
    width: 141px;
    height: 46px;

  }

  .validation_total_item {
    width: 86px;
    height: 46px;
  }

  .validation_img {
    width: 16px;
    height: 16px;
  }
  body.light .validation_img{
    background: url(./assets/icons/performance_bottom_lead_icon_light.svg) no-repeat center center;
  }
  body.dark .validation_img{
    background: url(./assets/icons/performance_bottom_lead_icon_dark.svg) no-repeat center center;
  }

  #contact-card_spain_valid {
    bottom: -20px;
  }
  
  

  /* boost section */

  .boost_section {
    display: flex;
    flex-direction: row;
    margin-bottom: 120px;
  }

  .boost_section_container {
    width: 1580px;
    height: 655px;
    border-radius: 60px;
    padding: 60px;
    position: relative;
    overflow: hidden;
  }
  body.light .boost_section_container {
    background: linear-gradient(to right,#222222,#4A4A4A,#222222);
  }
  body.dark .boost_section_container {
    background: linear-gradient(to right, #FFFFFF, #CDCDCD, #FFFFFF);
  }

  .boost_section_left_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    height: 100%;
    width: 50%;
  }

  .boost_button {
    width: 266px;
    height: 35px;
    font-size: 14px;
  }
  body.light .boost_button {
    background-color: #393939;
    color: #FFCC33;
  }
  body.dark .boost_button {
    background-color: #F5F7F9;
    color: #ED1C24;
  }

  .boost_button_img {
    width: 14px;
    height: 14px;
    margin-right: 6px;
  }

  body.light .boost_button_img {
    background: url(./assets/icons/boost_button_light.svg) no-repeat center center;
  }

  body.dark .boost_button_img {
    background: url(./assets/icons/boost_button_dark.svg) no-repeat center center;
  }

  .boost_section_title {
    font-size: 40px;
    margin: 8px 0 24px 0;
  }
  body.light .boost_section_title {
    background: linear-gradient(to right, #FFFFFF, #CDCDCD, #FFFFFF);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }
  body.dark .boost_section_title {
    background: linear-gradient(to right, #333232, #747474, #333232);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }

  .boost_section_text_inner {
    font-size: 18px;
    width: 480px;
    margin-bottom: 40px;
  }
  body.light .boost_section_text_inner {
    color: #FFFFFF;
  }
  body.dark .boost_section_text_inner {
    color: #595959;
  }

  .boost_section-actions {
    display: flex;
    flex-direction: row;
    padding: 0;
    max-width: 690px; 
    margin: 0;
    flex-wrap: wrap;
  }

  .boost_section-actions > *:nth-child(1) {
    margin-right: 20px;
  }
  
   .footer_section_button-sec_item {
    width: 200px;
   }
  .boost_section_button-item {
    width: 250px;
  }
  body.light .boost_section_button-item {
    background-color: #333232;
    color: #E8E8E8;
  }
  body.light .boost_section_button-item:hover {
    background-color: #595959;
  }
  body.light .footer_section_button-sec_item {
    color: #e8e8e8;
    background-color: #212121;
  }
  body.light .footer_section_button-sec_item:hover {
    background-color: #595959;
  }
  body.dark .boost_section_button-item {
    background-color: #ffffff;
    color: #212121;
  }
  body.dark .boost_section_button-item:hover {
    background-color: #E8E8E8;
  }
  body.dark .footer_section_button-sec_item {
    color: #e8e8e8;
    background-color: #212121;
  }
  body.dark .footer_section_button-sec_item:hover {
    background-color: #595959;
  }

  .boost_unpaid_item {
    width: 308px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    margin: 10px 0 0 0;
  }
  body.dark .boost_unpaid_item {
    color: #8B8B8B;
  }
  body.light .boost_unpaid_item {
    color: #DDDDDD;
  }

  .boost_date_img {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
  body.dark .boost_date_img{
    background: url(./assets/icons/date_img_light.svg) center center;
  }
  body.light .boost_date_img{
    background: url(./assets/icons/date_img_dark.svg) center center;
  }
  


  #contact-card_arg_boost {
    color: #212121;
    font-size: 12px;
    width: 324px;
    height: 178px;
    top: 80px;
  }
  
  body.dark #contact-card_arg_boost{
    color: #212121;
    border: none
  }

  #contact-card_arg_boost-underfooter {
    color: #212121;
    font-size: 12px;
    width: 324px;
    height: 178px;
    top: 80px;
  }
  
  body.dark #contact-card_arg_boost-underfooter {
    color: #212121;
    border: none
  }
  
  body.dark .boost_card{
    color: #212121;
    background-color: #ffffff;
  }

  .id_boost {
    font-size: 12px;
    color: #8B8B8B;
  }
  .id_boost-underfooter {
    font-size: 12px;
    color: #8B8B8B;
  }

  .boost_title{
    font-size: 16px;
  }
  body.dark .boost_title{
    color: #212121;
  }

  .boost_card{
    width: 308px;
    height: 162px;
  }

  .boost_card .status {
    background: #CE8C23;
    color: #FFFFFF;
  }

  .boost_border{
    position: absolute;
    top: -40px;
  } 
  body.light .boost_text {
    box-shadow: none;
  } 
  body.dark .boost_border {
    border: none;
  }

  body.dark .boost_text {
    background-color: #fff;
    color: #212121;
    border: none;
  }
  body.dark .boost_primary_text {
    color: #212121;
  }




  .boost_main_img {
    background: url(./assets/Boost_img.svg);
    width: 899px;
    height: 600px;
    position: absolute;
    top: 12%;
    left: 74%;
    transform: translateX(-50%);
  }

  /* client section */

  .animated_button, .menu_section_button-elem {
    margin: 0;
  }

  .client_section {
    width: 100%;
    height: 914px;
    margin-bottom: 240px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .client_section_container {
    width: 1600px;
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .client_section_left_item {
    display: flex;
    flex-direction: column;
    width: 619px;
    margin-right: 37px;
  }

  .client_button_border {
    width: 313px;
  }
  .client_button {
    width: 313px;
  }

  .client_button_img {
    width: 14px;
    height: 14px;
  }
  body.light .client_button_img {
    background: url(./assets/icons/client_button_img_light.svg);
  }
  body.dark .client_button_img {
    background: url(./assets/icons/client_button_img_dark.svg);
  }

  .client_button_text {
    font-size: 14px;
  }

  body.light .client_section {
    background-color: #fff;
  }
  body.dark .client_section {
    background-color: #333232;
  }

  .client_section_title {
    font-size: 40px;
    margin: 8px 0 24px 0;
  }

  .client_section_text_inner {
    font-size: 18px;
    width: 480px;
    margin-bottom: 40px;
  }
  body.light .client_section_text_inner {
    color: #595959;
  }
  body.dark .client_section_text_inner {
    color: #FFFFFF;
  }
  .client_section-actions {
    display: flex;
    flex-direction: row;
    padding: 0;
    max-width: 640px; 
    margin: 0;
    flex-wrap: wrap;
  }

  .client_section-actions > *:nth-child(1) {
    margin-right: 20px;
  }

  .client_section_button-elem {
    width: 293px;
    height: 73px;
  }

  .client_section_button-elem_secondary {
    width: 232px;
    height: 73px;
  }

  .menu_section_button-elem {
    display: none;
  }

  .client_section_button-item {
    width: 281px;
    height: 61px;
    font-size: 18px;
  }
  .client_section_button-item_secondary {
    width: 220px;
    height: 61px;
    font-size: 18px;
  }

  .client_unpaid_item {
    width: 304px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    margin: 10px 0 0 0;
  }

  .client_date_img {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }

  body.light .client_date_img{
    background: url(./assets/icons/date_img_light.svg) center center;
  }
  body.dark .client_date_img{
    background: url(./assets/icons/date_img_dark.svg) center center;
  }

  body.light .client_unpaid_item {
    color: #8B8B8B;
  }
  body.dark .client_unpaid_item {
    color: #DDDDDD;
  }

  .slider_content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .right_border_elem {
    position: relative;
    border-radius: 30px;
    width: 499px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 0;
  }
  

  body.light .right_border_elem {
    border: 1px solid #E8E8E8;
  }
  body.dark .right_border_elem {
    border: 1px solid #595959;
  }

  .right_border_elem {
    margin-right: 20px;
  }

  .right_border_elem:last-child {
    margin-right: 0; 
  }

  .right_item {
    width: 479px;
    height: 602px;
    border-radius: 20px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  body.light .right_item{
    background-color: #ffffff;
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5); 
    border-radius: 20px; 
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }
  body.dark .right_item{
    background-color: #212121;
  }

  .client_key_main_img::before {
    content: "";
    position: absolute;
    bottom: 50px;
    left: 15px;
    width: 450px;
    height: 410px; 
    pointer-events: none;
    z-index: 10;
  }
  body.light .client_key_main_img::before {
    background: linear-gradient(to bottom, transparent 0%, #ffffff 100%);
  }
  body.dark .client_key_main_img::before {
    background: linear-gradient(to bottom, transparent 0%, #212121 100%);
  }

  .client_right_title {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    margin-bottom: 16px;
  }

  .client_section_border_img {
    width: 52px;
    height: 52px;
    border-radius: 100px ;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
  }
  body.light .client_section_border_img {
    border: 1px solid #ED1C24;
  }
  body.dark .client_section_border_img {
    border: 1px solid #FFCC33;
  }

  .client_section_personal_img {
    width: 42px;
    height: 42px;
  }
  body.light .client_section_personal_img {
    background: url(./assets/icons/client_section_personal_icon_light.svg);
  }
  body.dark .client_section_personal_img {
    background: url(./assets/icons/client_section_personal_icon_dark.svg);
  }

  .client_section_key_img {
    width: 42px;
    height: 42px;
  }
  body.light .client_section_key_img {
    background: url(./assets/icons/client_section_key_icon_light.svg);
  }
  body.dark .client_section_key_img {
    background: url(./assets/icons/client_section_personal_icon_dark.svg);
  }


  .client_section_text_title {
    font-size: 26px;
  }
  body.light .client_section_text_title {
    color:#333232;
  }
  body.dark .client_section_text_title {
    color:#F3F3F3;
  }

  .client_right_text_inner {
    font-size: 16px;
    width: 415px;  
    margin-bottom: 40px;
  }
  body.light .client_section_text_title {
    color:#595959;
  }
  body.dark .client_section_text_title {
    color:#DDDDDD;
  }

  .client_personal_main_img {
    width: 335px;
    height: 341px;
    background-repeat: no-repeat;
    background-size: contain;
  }
  
  body.light .client_personal_main_img {
    background-image: url(./assets/client_section_personal_light_img.svg) ;
  }
  
  body.dark .client_personal_main_img {
    background-image: url(./assets/client_section_personal_dark_img.svg) ;
    position: relative;
    z-index: 0; 
}

  .client_key_main_img {
    width: 415px;
    height: 380px;
    overflow: hidden;
  }

  .kanban-container {
    display: flex;
    flex-direction: row;
    gap: 10px;
    max-width: 1200px;
    margin: 0 auto;
    font-size: 14px;
  }

  .column {
    padding: 10px;
    border-radius: 24px;
    flex: 1;
  }
  body.light .column {
    border: 1px solid rgba(232, 232, 232, 1);
  }
  body.dark .column {
    border: 1px solid rgba(89, 89, 89, 1);
  }

  .column-header {
    text-align: center;
    font-weight: bold;
    border-radius: 999px;
    padding: 10px 0;
    margin-bottom: 16px;
    cursor: pointer;
  }

  .to-do {
    background-color: #4f46e5; 
  }

  .in-progress {
    background-color: #10b981; 
  }

  .card_item {
    padding: 12px;
    border-radius: 20px;
    margin-bottom: 10px;
    transition: opacity 0.3s; 
  }

  body.light .card_item {
    box-shadow: 0 4px 12px rgba(139, 139, 139, 0.5); 
  }
  body.dark .card_item {
    background-color: #333232;
  }

  .card-title {
    font-weight: 600;
    margin-bottom: 6px;
  }
  body.light .card-title {
    color: rgba(51, 50, 50, 1);
  }
  body.dark .card-title {
    color: rgba(89, 89, 89, 1);
  }


  .card-description {
    font-size: 14px;
  }
  body.light .card-description {
    color: rgba(139, 139, 139, 1);
  }
  body.dark .card-description {
    color: rgba(221, 221, 221, 1);
  }


  /* paid_section */


  .paid_section {
    border-radius: 70px;
    padding: 10px;
    margin-bottom: 120px;
  }


  .paid_section_container {
    width: 1600px;
    height: 655px;
    border-radius: 60px;
    padding: 135px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative;
  }
  body.light .paid_section_container {
    background-color: #FFFFFF;
  }
  body.dark .paid_section_container {
    background-color: #333232;
  }

  .paid_section_left_item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    width: 518px;
  }

  .paid_button_border{
    width: 99px;
  }

  .paid_button {
    width: 99px;
  }

  .paid_item_border {
    position: absolute;
    bottom: 120px;
    right: 281px;
    width: 504px;
    height: 750px;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: center; 
  }
  body.light .paid_item_border {
    border: 1px solid #E8E8E8;
  }
  body.dark .paid_item_border {
    border: 1px solid #333232
  }

  .paid_item_underposition {
    width: 100%;
    height: 100%;
    border-radius: 20px;
    width: 484px;
    height: 730px;
    z-index: 2;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.25);
    padding: 23px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  body.light .paid_item_underposition {
    background-color: #ffffff;
    color: #333232;
  }
  body.dark .paid_item_underposition {
    background-color: #333232;
    color: #E8E8E8;
  }

  .paid_section-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0;
    width: 420px; 
    margin-bottom: 32px;
  }

  .paid_section-actions > *:nth-child(1) {
    margin-right: 20px;
  }

  .paid_unpaid_item {
    font-size: 16px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    width: 305px;
    margin-top: 8px;
  }

  .paid_date_img {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
  body.light .paid_date_img{
    background: url(./assets/icons/date_img_light.svg) center center;
  }
  body.dark .paid_date_img{
    background: url(./assets/icons/date_img_dark.svg) center center;
  }

  .paid_item_title_block {
    display: flex;
    flex-direction: row;
    align-items: baseline;
  }


  .paid_item_title_inner {
    font-size: 80px;
  }
  body.light .paid_item_title_inner{
    color: #333232;
  }
  body.dark .paid_item_title_inner{
    color: #F3F3F3;
  }



  .paid_item_title {
    font-size: 16px;
  }
  body.light .paid_item_title{
    color: #333232;
  }
  body.dark .paid_item_title{
    color: #F3F3F3;
  }


  .paid_item_text_inner {
    font-size: 18px;
    width: 380px;
    margin: 8px 0 24px 0;
  }
  body.light .paid_item_title_inner{
    color: #595959;
  }
  body.dark .paid_item_title_inner{
    color: #DDDDDD;
  }

  .paid_item_img_group {
    position: relative;
    padding-top: 32px; 
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .paid_item_img_group::before {
    content: "";
    position: absolute;
    top: 16px; 
    left: 0;
    width: 420px;
    height: 1px;
  }
  body.light .paid_item_img_group::before {
    background-color: #E8E8E8; 
  } 
  body.dark .paid_item_img_group::before {
    background-color: #595959 
  } 

  .paid_border_icon {
    width: 44px;
    height: 44px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 8px;
    border: 1px solid #E8E8E8;
  }
  body.light .paid_border_icon{
    border: 1px solid #E8E8E8;
  }
  body.dark .paid_icon{
    border: 1px solid #595959;
  }
  .paid_item_inner {
    width: 368px;
  }

  .paid_animated_button {
    width: 295px;
    height: 62px;
  }

  .paid_primary {
    width: 283px;
    height: 50px;
  }

  .paid_icon {
    width: 32px;
    height: 32px;
    border-radius: 20px;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.25);
  }
  body.light .paid_icon{
    background: url(./assets/icons/paid_img_icon_light.svg) center center;
  }
  body.dark .paid_icon{
    background: url(./assets/icons/paid_img_icon_dark.svg) center center;
  }



  /* faq_section */

  .faq_section {
    width: 100%;
    margin-bottom: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .faq_section_container {
    width: 1600px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .faq_left_item {
    display: flex;
    flex-direction: column;
    width: 655px;
  }

  .faq_button_border {
    width: 263px;
  }

  .faq_button {
    width: 263px;
  }

  .faq_button_img {
    width: 14px;
    height: 14px;
  }
  body.light .faq_button_img {
    background: url(./assets/Faq_button_img_light.svg);
  }
  body.dark .faq_button_img {
    background: url(./assets/Faq_button_img_dark.svg);
  }

  .faq_button_text {
    font-size: 14px;
  }
  body.light .faq_button_text {
    color: #ED1C24;
  }
  body.dark .faq_button_text {
    color: #FFCC33;
  }

  .faq_section_title {
    font-size: 40px;
    margin: 8px 0 24px 0;
  }

  .faq_section_text_inner {
    font-size: 18px;

  }
  body.light .faq_section_text_inner {
    color: #595959;
  }
  body.dark .faq_section_text_inner {
    color: #FFFFFF;
  }

  .faq_feedback_block {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin: 65px 0 40px 0;
  }

  .faq_feedback_description_block {
    display: flex;
    flex-direction: column;
  }

  .faq_feedback_img {
    width: 56px;
    height: 56px;
    background: url(./assets/Faq_message_img.svg);
    margin-right: 24px;
  }

  .faq_feedback_description_title {
    font-size: 26px;
    margin-bottom: 4px;
  }

  body.light .faq_feedback_description_title {
    color: #000000;
  }
  body.dark .faq_feedback_description_title {
    color: #DDDDDD;
  }

  .faq_right_item {
    width: 790px;
    border-radius: 30px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: auto;
    gap: 10px;
  }
  body.light .faq_right_item {
    border: 2px solid #E8E8E8;
  }
  body.dark .faq_right_item {
    border: 2px solid #333232;
  }



.faq_description_block {
  width: 770px;
  border-radius: 20px;
  padding: 32px;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  transition: background-color 0.3s;
}
body.light .faq_description_block {
  background-color: #ffffff;
}
body.dark .faq_description_block {
  background-color: #333232;
}
body.light .faq_description_block:hover {
  background-color: #E8E8E8;
}
body.dark .faq_description_block:hover {
  background-color: #595959;
}

.faq_outer-border {
  position: relative;
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border-radius: 60px;
  cursor: pointer;
  transition: border-color 0.3s, box-shadow 0.3s;
}
.faq_outer-border:active {
  transform: scale(0.96);
}
body.light .faq_outer-border {
  border: 2px solid #ffffff;
}
body.dark .faq_outer-border {
  border: 2px solid #595959;
}

.faq_inner-box {
  width: 30px;
  height: 30px;
  position: relative;
  border-radius: 60px;
  transition: background-color 0.3s, box-shadow 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.light .faq_inner-box {
  background-color: white;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}
body.dark .faq_inner-box {
  background-color: rgba(89, 89, 89, 1);
}
body.dark .faq_description_block:hover .faq_inner-box {
  background-color: rgba(70, 70, 70, 1); 
}



.faq_outer-border:hover .faq_inner-box {
  background-color: inherit;
}

.faq_inner-box::before,
.faq_inner-box::after {
  content: "";
  position: absolute;
  background-color: currentColor;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 0.3s;
}
.faq_inner-box::before {
  width: 12px;
  height: 2px;
}
.faq_inner-box::after {
  width: 2px;
  height: 12px;
}
body.light .faq_inner-box::before,
body.light .faq_inner-box::after {
  background-color: #212121;
}
body.dark .faq_inner-box::before,
body.dark .faq_inner-box::after {
  background-color: rgba(243, 243, 243, 1);
}

.faq_inner-box.open::after {
  opacity: 0;
}

.faq_description_text_inner {
  display: none;
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.5;
}
.faq_description_text_inner.open {
  display: block;
}
#faq_link,
#faq_link_to_tg {
  display: none;
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.5;
}
#faq_link.open,
#faq_link_to_tg.open {
  display: block;
}



.faq_title__elem {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
}

.faq_description_title {
  font-size: 22px;
  font-weight: 600;
}

.faq_description_text_inner {
  color: #8B8B8B;
  font-size: 18px;
}

  /* footer */

.footer-wrp {
  width: 100%;
  min-height: 215.5px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: linear-gradient(to right,#222222,#4A4A4A,#222222);
}

.footer_container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 1600px;
  padding:40px 0 16px 0;
  position: relative; 
}

.footer_container::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background-color: #E8E8E81A;
  pointer-events: none; 
}


  .footer_logo {
    background: url(./assets/Logo_dark.svg);
    height: 62px;
    width: 76px;
  }

  .menu_footer {
    color: #DDDDDD;
  }

  .footer_main {
    display: flex;
    align-items: center;
  }

  .nav_menu.menu_footer {
    display: flex;
    gap: 32px; 
    margin-left: 80px; 
    align-items: center;
  }

  .footer_column {
    display: contents; 
  }

  .footer_title.menu_title {
    white-space: nowrap; 
  }


  .footer_section_button-elem {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
  } 

  .footer_section_button-item {
    width: 237px;
    height: 50px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .footer_unpaid_item {
    width: 237px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    margin: 6px 0 0 0;
  }

  body.light .date_img_footer {
    background: url(./assets/icons/date_footer_icon.svg) center center;
  }
  body.dark .date_img_footer {
    background: url(./assets/icons/date_footer_icon.svg) center center;
  }

  .date_img_footer {
    width: 12px;
    height: 12px;
    margin-right: 6px;
  }

  .footer_inner {
    font-size: 12px;
    color: #E8E8E8;
  }

  .footer_under-line {
    color: #8B8B8B;
    font-size: 14px;
    width: 1600px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    margin-top: 16px;
  }

  .footer_item {
    width: 107px;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .footer_left_under-item {
    width: 245.5px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
  }

  .footer_service-item {
    text-align: center;
    width: 127px;
  }

  .footer_divider {
    width: 1px;
    height: 16px;
    background-color: #E8E8E81A; 
  }

  .footer_section-actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0;
    max-width: 503px; 
    flex-wrap: wrap;
  }


/* error page */

  .error_section { 
    display: none; 
  }

  .error_section {
    max-width: 1600px;
    min-height: calc(100vh - 303.5px);
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  .error_button_img {
    width: 14px;
    height: 14px;
    margin-right: 6px;
  }
  body.light .error_button_img {
    background: url(./assets/icons/error_button_icon_light.svg) no-repeat center center;
  }
  body.dark .error_button_img {
    background: url(./assets/icons/error_button_icon_dark.svg) no-repeat center center;
  }
  
  .error_title {
    width: 1068px;
    height: 178px;
    margin: 12px 0 24px 0;
  }
  body.light .error_title {
    background: url(./assets/icons/error_title_img_light.svg) ;
  }
  body.dark .error_title {
    background: url(./assets/icons/error_title_img_dark.svg) ;
  }

  .error_decs {
    font-size: 18px;
    color: #595959;
  }

  .error_button-elem {
    margin-top: 40px;
    width: 178px;
    height: 73px;
    border-radius: 40px;
    padding: 6px;
  }


/* privacy ad servise sections */
.support_section {
  max-width: 1060px;
  margin: 0 auto;
  min-height: calc(100vh - 303.5px);
}

.legal-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px;
  height: auto;
  width: 100%;
  position: relative;
  border-radius: 30px;
  margin: 120px 0;
}
body.light .legal-wrapper {
  border: 1px solid #DDDDDD;
}
body.dark .legal-wrapper {
  border: 1px solid #595959;
}

.legal-card {
  padding: 40px;
  max-width: 1040px;
  width: 100%;
  border-radius: 16px;
}
body.light .legal-card {
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  color: #212121;
}
body.dark .legal-card {
  background: #595959;
  color: #DDDDDD;
}

#legal-title {
  font-size: 28px;
  margin: 0;
}

.legal-date {
  font-style: italic;
  margin-bottom: 16px;
}

.legal-intro {
  margin-bottom: 32px;
  line-height: 1.6;
}

.legal-section {
  margin-bottom: 24px;
}

.legal-section h2 {
  font-size: 18px;
  margin-bottom: 8px;
}

.legal-section ul {
  padding-left: 20px;
  margin: 8px 0;
}

.legal-section li {
  margin-bottom: 8px;
  line-height: 1.5;
}