@font-face {
  font-family: "PT Astra Fact";
  src: url("./fonts/PTAstraFact-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "PT Astra Fact";
  src: url("./fonts/PTAstraFact-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}
@keyframes aboutBorderRun {

  0% {
      background-position: 45% 50%;
      filter: brightness(1);
  }

  45% {
      background-position: 100% 50%;
      filter: brightness(1.65);
  }

  70% {
      background-position: 72% 50%;
      filter: brightness(1.3);
  }

  100% {
      background-position: 82% 50%;
      filter: brightness(1.18);
  }
}

@keyframes whomBorderRun {
  0% {
      background-position: 45% 50%;
      filter: brightness(1);
  }

  45% {
      background-position: 100% 50%;
      filter: brightness(1.65);
  }

  70% {
      background-position: 72% 50%;
      filter: brightness(1.3);
  }

  100% {
      background-position: 82% 50%;
      filter: brightness(1.18);
  }
}

:root {
  --blue-800: #003AA7;
  --blue-600: #006CE6;

  --accent-900: #0063A3;
  --accent-700: #0E83BC;
  --accent-500: #5BC3F5;
  --accent-400: #a5c9ff;
  --accent-300: #6BCBFA;
  --accent-200: #9FDCFE;


  --neutral-900: #070514;
  --neutral-800: #051836;

  --neutral-500: #70788B;
  --neutral-400: #7C869F;
  --neutral-300: #AAB2C2;
  --neutral-200: #C0C0C0;

  font-family: "PT Astra Fact", "Arial", "Verdana", sans-serif !important;
}

h1.title {
  font-size: 52px;
  line-height: 64px;
  font-weight: 400;
  color: #fff;
  margin: 0;
  text-align: center;
}

h2.title {
  font-family: "Eurostile Extended", "PT Astra Fact", "Arial", "Verdana",
    sans-serif !important;
  font-size: 31px;
  line-height: 100%;
  font-weight: 800;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
  text-align: center;
}
h3.title {
  font-size: 34px;
  line-height: 46px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  text-align: center;
}
p.subtitle {
  font-size: 22px;
  line-height: 30px;
  font-weight: 700;
  color: var(--accent-500);
  margin: 0;
}

h4.subtitle {
  font-size: 27px;
  line-height: 37px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}
h4.title {
  font-size: 28px;
  line-height: 38px;
  font-weight: 700;
  color: #fff;
  margin: 0;
  text-align: center;
}

h5.subtitle {
  font-size: 22px;
  line-height: 32px;
  font-weight: 400;
  color: #fff;
  margin: 0;
  text-align: center;
}
h5.title {
  font-size: 24px;
  line-height: 35px;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.text-small {
  font-size: 15px;
  line-height: 25px;
  font-weight: 400;
  color: var(--neutral-200);
  margin: 0;
}

.text-xlarge {
  font-size: 20px;
  line-height: 28px;
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}
.text-large {
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}
.text-regular{
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}
.text-xsmall {
  font-size: 10px;
  line-height: 18px;
  font-weight: 400;
  color: #ffffff;
  margin: 0;
}

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background-color: var(--neutral-900);
  background-image: url(../assets/img/background.png);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: 3180px auto;
  position: relative; /* нужно для позиционирования видео */
  overflow-x: hidden;
}


.online-container {
  width: 1320px;
  display: flex;
  box-sizing: border-box;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

section {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  position: relative;
}

.desktop {
  display: block;
}

.mobile {
  display: none;
}

.section-header {
  height: 89px;
  display: flex;
  justify-content: center;
  position: relative;
}

.section-header .online-container {
  padding: 20px 60px;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.section-header img{
  width: 132px;
  height: auto;
}

.btn-main {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 32px;
  padding: 20px 40px;
  transition: all ease 0.3s;
  background-color: var(--accent-500);
  border-radius: 8px;
  cursor: pointer;
}
.btn-main p {
  font-size: 28px;
  line-height: 38px;
  font-weight: 400;
  color: #000;
  margin: 0;
  transition: all ease 0.3s;
}
.btn-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  border: 1.8px solid #000;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all ease 0.3s;
}
.btn-icon svg{
  transition: all ease 0.3s;
  transform: rotate(-45deg);
}
.btn-icon svg path {
  transition: all ease 0.3s;
}
.btn-main:hover{
  background-color: #fff;
}
.btn-main:hover .btn-icon svg {
  transform: rotate(0deg);
}
.btn-main:active{
  background-color: var(--accent-700);
}
.btn-main:active .btn-icon {
  border-color: #fff;
}
.btn-main:active .btn-icon svg {
  transform: rotate(0deg);
}

.btn-main:active .btn-icon svg path {
  stroke: #fff;
}
.btn-main:active p {
  color: #fff;
}

.header-menu {
  display: flex;
  align-items: center;
  gap: 60px;
}
.header-menu-mobile-btn{
  display: none;
}
.header-menu-mobile{
  display: none;
}
.header-menu_item p {
  font-size: 15px;
  line-height: 24px;
  font-weight: 400;
  color: var(--accent-500);
  margin: 0;
  text-align: center;
  transition: all ease 0, 3s;
}

.section-header .online-container > div:first-of-type{
  display: flex;
  align-items: center;
  gap: 80px;
}

.header-menu_item:hover p {
  color: var(--accent-400);
}
.header-menu_item:active p {
  color: var(--accent-700);
}
.section-header .btn-main {
  height: 49px;
  padding: 12px 28px;
}
.section-header .btn-main p {
  font-size: 17px;
  line-height: 25px;
}
.header-menu .btn-icon{
  display: none;
}

.hero {
  margin-top: 20px;
  margin-bottom: 100px;
}
.hero-date {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 32px;
}
.hero-date__item {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 24px;
  border-radius: 8px;
  height: 51px;
  box-sizing: border-box;
  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);
}
.hero-date__item::after {
  content: "";
    position: absolute;
    inset: 0;
    padding: 1px;
    border-radius: inherit;
    border-radius: 8px;
  
    background: linear-gradient(
      90deg,
      rgba(227, 218, 218, 0.5) 0%,
      rgba(156, 206, 232, 0) 52%,
      #5bc3f5 100%
    );
  
    -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
  
    pointer-events: none;
}

.hero-date__item p {
  font-size: 24px;
  line-height: 29px;
  font-weight: 400;
  text-transform: uppercase;
  color: #fff; 
  margin: 0;
  text-align: center;
  margin-top: 1px;
}
.hero-logo{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hero-logo img {
  width: 656px;
  min-width: 656px;
  height: auto;
}

.hero .btn-main {
  margin-top: 32px;
  width: 735px;
}

.about .online-container {
padding: 0 100px;
}

.about h3 {
  margin-bottom: 40px;
}


.about-block {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin-top: 40px;
}
.about-block__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 40px 32px;
  position: relative;
  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);
  border-radius: 32px;
  /* Для мягкой вспышки самой карточки */
  box-shadow:
  0 0 0 rgba(91, 195, 245, 0),
  inset 0 0 0 rgba(91, 195, 245, 0);

transition:
  background .4s ease,
  box-shadow .4s ease,
  transform .4s ease;
}

.about-block__item::before {
  content: "";

  position: absolute;
  inset: 0;

  padding: 1px;
  border-radius: inherit;

  background: linear-gradient(
      90deg,
      rgba(227, 218, 218, .5) 0%,
      rgba(187, 220, 238, .22) 30%,
      rgba(156, 206, 232, 0) 48%,
      rgba(91, 195, 245, .5) 68%,
      #5bc3f5 100%
  );

  background-size: 220% 100%;

  background-position: 45% 50%;

  -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);

  -webkit-mask-composite: xor;
  mask-composite: exclude;

  pointer-events: none;

  transition:
      background-position .5s ease,
      filter .5s ease;
}

.about-block__item h4, .about-block__item .text-xlarge {
  text-align: center;
}
.about-block__item::after {
  content: "";

  position: absolute;

  width: 111px;
  height: 2px;

  top: 0;
  left: 50%;

  transform: translate(-50%, -50%);

  background: #fff;

  border-radius: 999px;

  box-shadow:
      0 0 5px 1px rgba(255, 255, 255, 0.4),
      0 0 9px 1px rgba(101, 205, 255, 0.8);

  filter: blur(1px);

  z-index: 10;
  pointer-events: none;

  transition:
      width .4s ease,
      height .4s ease,
      background-color .4s ease,
      box-shadow .4s ease,
      filter .4s ease;
}

@media (hover: hover) {
.about-block__item:hover::before {
        animation: aboutBorderRun .8s ease-out forwards;
    }
  .about-block__item:hover::after {
    width: 119px;
    height: 4px;

    background: #5bc3f5;

    box-shadow:
        0 0 6px 1px rgba(91, 195, 245, 0.9),
        0 0 10px 2px rgba(101, 205, 255, 0.85),
        0 0 18px 3px rgba(101, 205, 255, 0.25);

    filter: blur(2px);
}
}

.whom {
  margin-top: 100px;
}
.whom h3 {
  margin-bottom: 40px;
}
.whom h5 {
  margin-bottom: 60px;
  max-width: 960px;
}

.whom-block {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  justify-content: space-between;
}

.whom-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;

  padding: 40px 28px 60px;

  box-sizing: border-box;
  position: relative;

  width: calc((100% - 32px) / 3);

  border-radius: 32px;

  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);

  box-shadow:
      0 0 0 rgba(91, 195, 245, 0),
      inset 0 0 0 rgba(91, 195, 245, 0);

  transition:
      background .4s ease,
      box-shadow .4s ease,
      transform .4s ease;
}


/* Рамка */
.whom-item::before {
  content: "";

  position: absolute;
  inset: 0;

  padding: 1px;
  border-radius: inherit;

  background: linear-gradient(
      90deg,
      rgba(227, 218, 218, .5) 0%,
      rgba(187, 220, 238, .22) 30%,
      rgba(156, 206, 232, 0) 48%,
      rgba(91, 195, 245, .5) 68%,
      #5bc3f5 100%
  );

  background-size: 220% 100%;
  background-position: 45% 50%;

  -webkit-mask:
      linear-gradient(#fff 0 0) content-box,
      linear-gradient(#fff 0 0);

  -webkit-mask-composite: xor;
  mask-composite: exclude;

  pointer-events: none;

  transition:
      background-position .5s ease,
      filter .5s ease;
}


/* Светящаяся полоска СНИЗУ */
.whom-item::after {
  content: "";

  position: absolute;

  width: 111px;
  height: 2px;

  bottom: 0;
  left: 50%;

  transform: translate(-50%, 50%);

  background: #fff;

  border-radius: 999px;

  box-shadow:
      0 0 5px 1px rgba(255, 255, 255, .4),
      0 0 9px 1px rgba(101, 205, 255, .8);

  filter: blur(1px);

  z-index: 10;
  pointer-events: none;

  transition:
      width .4s ease,
      height .4s ease,
      background-color .4s ease,
      box-shadow .4s ease,
      filter .4s ease;
}

@media (hover: hover) {

  .whom-item:hover::before {
      animation: whomBorderRun .8s ease-out forwards;
  }

  .whom-item:hover::after {
      width: 119px;
      height: 4px;

      background: #5bc3f5;

      box-shadow:
          0 0 6px 1px rgba(91, 195, 245, .9),
          0 0 10px 2px rgba(101, 205, 255, .85),
          0 0 18px 3px rgba(101, 205, 255, .25);

      filter: blur(2px);
  }
}

.whom-item .text-large {
  text-align: center;
}


.programm {
  margin-top: 100px;
}

.programm h3 {
  margin-bottom: 40px;
}
.programm .online-container {
  width: 1000px;
  align-items: center;
  padding: 60px 80px;
  box-sizing: border-box;
  position: relative;
  border-radius: 32px;
  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);
}
.programm .online-container::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  border-radius: 32px;

  background: linear-gradient(
    90deg,
    rgba(227, 218, 218, 0.5) 0%,
    rgba(156, 206, 232, 0) 52%,
    #5bc3f5 100%
  );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;

  pointer-events: none;
}
.programm .online-container:after {
  content: '';
  width: 121px;
  height: 20px;
  position: absolute;
  top: -9px;
  left: 50%;
  transform: translateX(-50%);
  background-image: url(../assets/img/light.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  z-index: 10;
}



.programm-block {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.programm-part{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 32px;
  padding-bottom: 40px;
  position: relative;
}
.programm-part:not(:last-child):after{
    content: '';
  width: 58px;
  height: 16px;
  position: absolute;
  bottom: -8px;
  left: -9px;
  background-image: url(../assets/img/light-shot.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  z-index: 10;
}
.programm-time{
  height: 46px;
  box-sizing: border-box;
  padding: 8px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);
position: relative;
border-radius: 8px;
}
.programm-time::before{
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  border-radius: 8px;

  background: linear-gradient(
    90deg,
    rgba(227, 218, 218, 0.5) 0%,
    rgba(156, 206, 232, 0) 52%,
    #5bc3f5 100%
  );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;

  pointer-events: none;
}

.programm-time p{
  font-size: 18px;
  line-height: 28px;
  font-weight: 400;
  color: var(--accent-500);
}
.programm-body{
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
}
.programm-title{
  width: 100%;
}
.programm-title h5:first-child{
  color: var(--accent-500);
}

.partners{
  margin-top: 100px;
  display: none;
}

.partners h3 {
  margin-bottom: 60px;
}
.partners .online-container {
  padding: 0 186px;
}
.partners-block {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 90px;
}
.partners-block__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

.partners-block__item img{
  width: 201px;
  height: auto;
}
.partners-block__item .text-xlarge{
color: #727272;
}
.translation{
  margin-top: 100px;
}

.translation h3 {
  margin-bottom: 60px;
}


.translation-block {
  width: 100%;
  height: 608px;
  border-radius: 24px;
  margin-bottom: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 60px;
  background: url(../assets/img/video.png) center/cover;
  backdrop-filter: blur(5px);
}
.translation-block::before{
content: "";
position: absolute;
inset: 0;
padding: 1px;
border-radius: inherit;
border-radius: 24px;

background: linear-gradient(
  90deg,
  rgba(227, 218, 218, 0.5) 0%,
  rgba(156, 206, 232, 0) 52%,
  #5bc3f5 100%
);

-webkit-mask:
  linear-gradient(#fff 0 0) content-box,
  linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask-composite: exclude;

pointer-events: none;
}


.translation .online-container {
  padding: 0 120px;
}

.translation-label{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 32px;
  box-sizing: border-box;
  background: rgba(77, 98, 137, 0.2);
  backdrop-filter: blur(5px);
position: relative;
border-radius: 8px;
}
.translation-label:hover h5{
  color: var(--accent-400);
}
.translation-label:active h5{
  color: var(--accent-700);
}

.translation-label::before{
  content: "";
  position: absolute;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  border-radius: 8px;

  background: linear-gradient(
    90deg,
    rgba(227, 218, 218, 0.5) 0%,
    rgba(156, 206, 232, 0) 52%,
    #5bc3f5 100%
  );

  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;

  pointer-events: none;
}
.translation-label h5{
  color: var(--accent-500);
  transition: all ease 0.3s;
}

.registration{
  margin-top: 100px;
}
.registration .online-container {
  width: 1000px;
  border-radius: 32px;
  background-color: #1C8DD3;
  box-sizing: border-box;
  padding: 60px 120px 80px;
}
.registration .online-container::after {
  content: '';
  width: 218px;
  height: 22px;
  position: absolute;
  top: -9px;
  left: 50%;
  transform: translateX(-50%);
  background-image: url(../assets/img/light-blue.png);
  background-repeat: no-repeat;
  background-position: center; 
  background-size: cover;
  z-index: 10;
}

.section-body__block__reg {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 60px;
  box-sizing: border-box;
  padding: 0;
}
.section-body__block__reg__title {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 40px;
}
.section-body__block__comment {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.section-body__block__comment .label {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  height: 47px;
  padding: 8px 20px;
  border-radius: 8px;
  border: 1.5px solid #fff;
}

.section-body__block__comment .label p {
  color: #fff;
  font-size: 20px;
  line-height: 28px;
  font-weight: 400;
}


.section-footer {
  margin-top: 100px;
}
.section-footer .online-container{
  padding: 0 60px;
}


.section-footer__block {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  gap: 40px;
}

.section-footer__block__info {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.section-footer__block__info img {
  width: 312px;
  min-width: 312px;
  height: auto;
}

.section-footer__block__bottom {
  width: 100%;
  box-sizing: border-box;
  padding-top: 40px;
  border-top: 1px solid #8c8c8c;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}

.section-footer__block__copyright .text-small,
.section-footer__block__contacts .text-small {
  color: #b9bac0;
  font-size: 12px;
  line-height: 20px;
}

.section-footer__block__bottom a {
  font-size: 12px;
  line-height: 20px;
  font-weight: 400;
  color: #b9bac0;
  transition: all ease 0.3s;
}
.section-footer__block__bottom a:hover {
  color: #fff;
}
.section-footer__block__bottom a:active {
  color: var(--accent-500);
}

.section-footer__block__messenger {
  width: 100%;
  padding-top: 20px;
  padding-bottom: 60px;
  display: flex;
  justify-content: center;
}
.section-footer__block__messenger a {
  display: flex;
  align-items: center;
  gap: 13px;
}
.section-footer__block__messenger a p {
  color: #fff;
  font-size: 19px;
  line-height: 32px;
  font-weight: 400;
  transition: all ease 0.3s;
  margin: 0;
}
.section-footer__block__messenger a svg path,
.section-footer__block__messenger a svg rect {
  transition: all ease 0.3s;
}
.section-footer__block__messenger a:hover p {
  color: var(--neutral-200);
}
.section-footer__block__messenger a:hover svg path,
.section-footer__block__messenger a:hover svg rect {
 fill: var(--neutral-200);
}
.section-footer__block__messenger a:active p {
  color: var(--neutral-300);
}
.section-footer__block__messenger a:active svg path,
.section-footer__block__messenger a:active svg rect {
 fill: var(--neutral-300);
}


form {
  width: 100%;
  position: relative;
}
.form-row {
  width: 100%;
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.form-row:nth-child(5){
  margin-bottom: 28px;
}

.form-group {
  position: relative;
  flex: 1;
}

.form-input {
  width: 100%;
  height: 60px;
  padding: 27px 12px 9px;
  border: none;
  outline: none;
  font-size: 14px;
  line-height: 22px;
  font-weight: 400;
  transition: all 0.3s ease;
  background-color: var(--accent-900);
  border: 1.5px solid var(--accent-300);
  box-sizing: border-box;
  color: #fff;
  transition: all ease 0.3s;
  border-radius: 12px;
}
.form-input.error {
  border-color: #ea3e32;
}
.form-input:focus {
  outline: none;
  border-color: #fff;
}

.form-label {
  position: absolute;
  left: 12px;
  top: 18px;
  color: var(--accent-200);
  font-size: 15px;
  line-height: 24px;
  font-weight: 400;
  pointer-events: none;
  transition: all 0.3s ease;
}

.form-input:focus + .form-label,
.form-input:not(:placeholder-shown) + .form-label {
  top: 9px;
  font-size: 10px;
  line-height: 18px;
}

/* Стили для автозаполнения */
.form-input:-webkit-autofill,
.form-input:-webkit-autofill:hover,
.form-input:-webkit-autofill:focus,
.form-input:-webkit-autofill:active {
  -webkit-text-fill-color: #fff;
  caret-color: #fff;

  border: 1px solid #fff;

  transition: background-color 9999s ease-in-out 0s;
}
.checkbox-group {
  margin-top: 32px;
}
.checkbox-group:not(:first-of-type) {
  margin-top: 12px;
}

.custom-checkbox {
  display: flex;
  align-items: flex-start;
  cursor: pointer;
  font-size: 17px;
  line-height: 25px;
  font-weight: 400;
  color: #fff;
}

.custom-checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.checkmark {
  width: 24px;
  height: 24px;
  background: #fff;
  border: 1px solid #fff;
  border-radius: 6px;
  margin-right: 20px;
  margin-top: 3px;
  flex-shrink: 0;
  transition: all 0.3s ease;
  position: relative;
}

.custom-checkbox input[type="checkbox"]:checked + .checkmark {
  background: var(--neutral-900);
  border-color: var(--neutral-900);
}

.custom-checkbox input[type="checkbox"]:hover + .checkmark {
  border-color: var(--neutral-500);
}

.custom-checkbox input[type="checkbox"]:checked + .checkmark::after {
  content: "";
  position: absolute;
  left: 7px;
  top: 2px;
  width: 7px;
  height: 11px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.checkbox-text {
  margin-top: 3px;
}
.checkbox-text a {
  color: var(--accent-200);
  text-decoration: underline;
  transition: all ease 0.3s;
}
.checkbox-text a:hover {
  color: var(--accent-300);
}
.checkbox-text a:active {
  color: var(--accent-500);
}
.checkmark.error {
  border-color: #ea3e32;
}

.registration .btn-main {
  outline: none;
  border: none;
  background-color: var(--neutral-900);
  align-self: center;
  justify-self: center;
  width: 100%;
  margin-top: 60px;
  transition: all ease 0.3s;
  cursor: pointer;
}
.registration .btn-main p {
  color: #fff;
}
.registration .btn-main .btn-icon{
border-color: #fff;
}
.registration .btn-main .btn-icon svg {
  transform: rotate(-45deg);
}
.registration .btn-main:hover {
  background-color: #fff;
}
.registration .btn-main:hover .btn-icon svg {
  transform: rotate(0deg);
}
.registration .btn-main:hover .btn-icon{
  border-color: #000;
}
.registration .btn-main:hover p{
  color: #000;
}
.registration .btn-main:hover .btn-icon svg path{
  stroke: #000;
}
.registration .btn-main:active {
  background-color: var(--accent-500);
}
.registration .btn-main:active .btn-icon svg {
  transform: rotate(0deg);
}

.registration-block {
  position: relative;
}
.content-message {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 14px 12px;
  border-radius: 8px;
  background-color: #ffd8db;
  border: 1px solid #bc2118;
  position: absolute;
  top: -220px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 200;
  display: none;
}
.content-message .text-r7 {
  color: #bc2118;
  text-align: center;
}
.thanks-block {
  display: none;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 40px 0;
}

.thanks-block .text-xlarge {
  text-align: center;
  line-height: 150%;
}

@media (max-width: 1399px) {
  body {
    background-image: url(../assets/img/background_tablet.png);
    background-size: 1399px auto;
  }
  .online-container{
    width: 1000px;
  }
  .section-header .online-container{
    padding: 20px 0;
  }
  .section-header .online-container > div{
    gap: 60px;
  }
  .header-menu{
    gap: 40px;
  }
  .about .online-container{
    padding: 0;
  }
  .translation .online-container{
    padding: 0;
  }
  .translation-block{
    height: 563px;
  }
  .section-footer .online-container{
    padding: 0;
  }
  .partners .online-container {
    padding: 0;
  }

  .whom-block {
    flex-direction: column;
    gap: 20px;
  }
  
  .whom-item {
    width: 100%;
    padding: 40px 40px 60px;
  }  
   
}
@media (max-width: 1099px) {

  .online-container {
    width: 688px;
  }
  
  .section-header {
    height: 75px;
    position: relative;
  }
  
  .header-menu-mobile-btn{
    display: block;
    cursor: pointer;
  }
  .header-menu-mobile{
    position: absolute;
    top: 75px;
    left: 50%;
    transform: translateX(-50%);
    flex-direction: column;
    background: rgba(7, 14, 27, 0.6);
    backdrop-filter: blur(5px);
    z-index: 1000;
    width: 100%;
    align-items: center;
    border-radius: 0 0 32px 32px;
    border-bottom: 1px solid var(--accent-500);
  }
  .header-menu-mobile.active {
    display: block;
  }
  .header-menu-mobile .header-menu{
    
    flex-direction: column;
    align-items: center;
    gap: 30px;
    padding: 60px 60px 100px;
  }
  .header-menu-mobile-btn svg{
    pointer-events: none;
  }
  .header-menu-mobile-btn svg path{
    transition: all ease 0.3s;
  }
  .header-menu-mobile-btn:hover svg path{
    stroke: var(--accent-400);
  }
  .header-menu-mobile-btn:active svg path{
    stroke: var(--accent-700);
  }

  .section-header .online-container > div:first-of-type{
    display: none;
  }

  .btn-main {  
    height: 60px;
    gap: 0;
    padding: 16px 40px;
  }
  .btn-main p {
    font-size: 20px;
    line-height: 28px;
  }
  .btn-icon {
    display: none;
  }
  
  .hero {
    margin-top: 40px;
    margin-bottom: 80px;
  }
  .hero-date {
    margin-bottom: 40px;
  }
  .hero-date__item {
    height: 46px;
  }
  
  .hero-date__item p {
    font-size: 20px;
    line-height: 24px;
  }
  
  .hero-logo img {
    width: 480px;
    min-width: 480px;
  }
  
  .hero .btn-main {
    margin-top: 40px;
    width: 414px;
  }
  
  .whom {
    margin-top: 80px;
  }

  .whom h5 {
    max-width: 100%;
  }
   
  .programm {
    margin-top: 80px;
  }

  .programm .online-container {
    width: 688px;
    padding: 40px 80px;
  }
 
 
  .programm-part{
    align-items: center;
    gap: 20px;
  }
  .programm-part:not(:last-child):after{
    left: 50%;
    transform: translateX(-50%);
  }

  .programm-body{
    align-items: center;
  }
  .programm-title{
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .programm-title h5.title{
    text-align: center;
  }
  .programm-content .text-large{
    text-align: center;
  }
  
  .partners{
    margin-top: 80px;
  }
  

  .partners-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 60px;
  }

  .partners-block__item .text-xlarge{
  text-align: center;
  }
  
  .translation{
    margin-top: 80px;
  }
  
  .translation .online-container{
    padding: 0 4px;
  }
  
  .translation-block {
    height: 383px;
    background: url(../assets/img/video_mobile.png) center/cover;
  }

  .translation-block h1.title{
    font-size: 34px;
    line-height: 46px;
  }
  
  .translation-label{
    width: 100%;
  }
  
  .registration{
    margin-top: 80px;
  }
  .registration .online-container {
    width: 688px;
    padding: 40px 60px 60px;
  }

  .section-body__block__comment {
    flex-direction: column;
  }
  .section-body__block__comment .text-xlarge{
    text-align: center;
  }
  
  .section-footer {
    margin-top: 80px;
  }
  
  .section-footer__block__bottom {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  
  .section-footer__block__copyright{
    order: 5;
  }
   
  .form-row:nth-child(5){
    margin-bottom: 28px;
  }
  
  .form-group {
    position: relative;
    flex: 1;
  }
  
  
  .registration .btn-main {
    height: 75px;
    padding: 20px 40px;
  }
  .registration .btn-main p {
    font-size: 24px;
    line-height: 35px;
  }
  .registration .btn-main .btn-icon{
  display: none;
  }
   
  .registration-block {
    position: relative;
  }
  .content-message {
    top: -260px;
  }

  .thanks-block {
    padding: 40px 80px;
  }
  
}

@media (max-width: 767px) {
  body{
    background-image: url(../assets/img/background_mobile.png);
    background-size: 770px auto;
  }
  h5.subtitle{
    font-size: 17px;
    line-height: 25px;
  }

  h4.title{
    font-size: 24px;
    line-height: 35px;
  }
  .text-xlarge{
    font-size: 17px;
    line-height: 25px;
  }

  .online-container {
    width: 100%;
    padding: 0 20px;
  }
  
  .section-header .online-container{
    padding: 0 20px;
  }

  .header-menu-mobile .header-menu{
    padding: 60px 20px 100px;
  }

  .btn-main {  
    width: 100%;
  }
  
  .hero {
    margin-bottom: 60px;
  }
  .hero-date {
    flex-direction: column;
  }
  
  .hero-logo img {
    width: calc(100% - 40px);
    min-width: 320px;
  }
  
  .hero .btn-main {
    width: 100%;
  }

  .about .online-container{
    padding: 0 20px;
  }

  .about-block{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  
  .about-block__item {
    padding: 40px 20px;
  }
   
  .whom {
    margin-top: 60px;
  }
 
  .whom-item {
    padding: 40px 28px 60px;
  }
   
  .programm {
    margin-top: 60px;
  }

  .programm .online-container {
    width: calc(100% + 2px);
    padding: 40px 20px 60px;
  }
   
  .programm-part:last-child{
    padding-bottom: 0;
  }
  
  .partners{
    margin-top: 60px;
  }
  .partners .online-container{
    padding: 0 20px;
  }
  
  .translation{
    margin-top: 60px;
  }
  
  .translation .online-container{
    padding: 0 20px;
  }
  
  .translation-block {
    height: auto;
    width: 100%;
    border-radius:8px;
    padding: 74px 40px;
    margin-bottom: 40px;
  }
  .translation-block::before{
    border-radius: 8px;
  }

  .translation-block h1.title{
    font-size: 20px;
    line-height: 28px;
  }
   
  .registration{
    margin-top: 60px;
  }

  .registration .online-container {
    width: 100%;
    padding: 40px 20px 60px;
  }
  .registration .btn-main{
    margin-top: 40px;
  }
  
  .section-footer {
    margin-top: 60px;
  }

  .section-footer .online-container{
    padding: 0 20px;
  }
  
  .section-footer__block__info img{
    width: 200px;
    min-width: 200px;
  }
  .section-body__block__reg{
    gap: 40px;
  }
  
  .form-row{
    flex-direction: column;
  }

  .content-message {
    width: 100%;
    top: -160px;
  }

  .thanks-block {
    padding: 40px 20px;
  }
}
