.main {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden; }
  .main .stars, .main .twinkling {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%; }
  .main .stars {
    background: #000 url(https://i.postimg.cc/hhFD7Nkf/apps-47636-13819498107583324-fb06b53a-4974-4acb-85e6-f6f363f85ab6-edec48d0-ec35-4a1f-8bf5-c455987b4a.png) repeat top center;
    z-index: 1; }
  .main .twinkling {
    background-image: url(https://i.postimg.cc/CLpNr4PF/twinkling.png);
    animation: twinkle 3s linear infinite;
    z-index: 2; }

@keyframes twinkle {
  from {
    background-position: 0; }
  to {
    background-position: -100px 0; } }
  .main .header-image {
    position: absolute;
    top: 10%;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    z-index: 3; }
  .main .center-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 4; }
    .main .center-content h1 {
      color: #de4d51;
      font-family: 'Oswald', sans-serif;
      font-size: 10vw;
      font-weight: 600;
      margin: 0;
      line-height: 1.2; }
  .main .bottom-content {
    position: absolute;
    bottom: 10%;
    left: 50%;
    transform: translateX(-50%);
    width: 25%;
    text-align: center;
    z-index: 5; }
    .main .bottom-content p {
      color: #fff;
      font-family: 'Inter', sans-serif;
      font-size: 1rem;
      text-decoration: none; }
      .main .bottom-content a:hover {
        text-decoration: underline; }

.text-section {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(to bottom, #59396A, #CDA89C); 
  padding-bottom: 80px;}
  .text-section .comet-image {
    position: absolute;
    right: 80px;
    top: 65px;
    transform: scale(1.5);
    transform-origin: center; }
  .text-section .content {
    flex: 1;
    width: 70%;
    padding-top: 80px; }
  .text-section .toc-container {
    padding: 20px;
    color: white; }
    .text-section .toc-container .toc-wrapper {
      max-width: 768px;
      margin: 0 auto;
      padding: 20px;
      background: rgba(0, 0, 0, 0.5);
      border-radius: 10px;
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); }
      .text-section .toc-container .toc-wrapper ol.toc {
        list-style: none;
        counter-reset: toc-item;
        padding-left: 0; }
        .text-section .toc-container .toc-wrapper ol.toc li {
          position: relative;
          padding-left: 20px;
          margin-bottom: 10px;
          font-size: 1.25rem; }
          .text-section .toc-container .toc-wrapper ol.toc li:before {
            counter-increment: toc-item;
            content: counters(toc-item, ".") " ";
            position: absolute;
            left: 0;
            color: #de4d51;
            font-weight: 600; }
        .text-section .toc-container .toc-wrapper ol.toc a {
          color: white;
          text-decoration: none;
          font-size: 1.25rem; }
          .text-section .toc-container .toc-wrapper ol.toc a:hover {
            text-decoration: underline; }

.decor {
    position: relative;
    width: 50%; 
    margin: 50px auto 0;
    background: #50413D;
    border-radius: 30px;
    box-sizing: border-box;
}

.form-left-decoration, .form-right-decoration {
    content: "";
    position: absolute;
    width: 50px;
    height: 20px;
    background: #3A1948;
    border-radius: 20px;
}

.form-left-decoration {
    bottom: 60px;
    left: -30px;
}

.form-right-decoration {
    top: 60px;
    right: -30px;
}

.form-left-decoration:before, .form-left-decoration:after, .form-right-decoration:before, .form-right-decoration:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 20px;
    border-radius: 30px;
    background: #50413D;
}

.form-left-decoration:before {
    top: -20px;
}

.form-left-decoration:after {
    top: 20px;
    left: 10px;
}

.form-right-decoration:before {
    top: -20px;
    right: 0;
}

.form-right-decoration:after {
    top: 20px;
    right: 10px;
}

.circle {
    position: absolute;
    bottom: 80px;
    left: -55px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #50413D;
}

.form-inner {
    padding: 50px;
    /* color: rgb(77, 76, 76); */
}

.form-inner input, .form-inner textarea {
    display: block;
    width: 100%;
    margin-bottom: 10px;
    background: #E9EFF6;
    line-height: 40px;
    border-width: 0;
    border-radius: 20px;
    font-family: 'Roboto', sans-serif;
}

input[type="date"] {
  padding-left: 10px;
  color: rgb(77, 76, 76);
}

.form-inner input[type="submit"] {
    margin-top: 30px;
    max-width: 40%;
    margin: 30px auto; 
    display: block;
    background: #3A1948;
    border-bottom: 4px solid #2e0f3c;
    color: white;
    font-size: 14px;
}

.form-inner input[type="submit"]:hover {
  background-color: #59276f;
  cursor: pointer;
}

.form-inner input::placeholder {
  padding-left: 10px; 
}

.form-inner textarea::placeholder {
  padding-left: 10px; 
}

.form-inner textarea {
    resize: vertical; 
}

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

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

.column:first-child {
  flex-basis: 30%; 
}

.column:last-child {
  flex-basis: 70%; 
}

/* .form-inner input[type="date"] {
  width: 100%; 
} */


.footer {
  position: absolute;
  width: 100%;
  color: white;
  text-align: center;
  background: linear-gradient(to bottom, #59396A, #CDA89C);
  min-height: 200px; }
  .footer .footer-content {
    position: relative; }
    .footer .footer-content p {
      position: relative;
      top: 170px; }
    .footer .footer-content a {
      color: white; }
    .footer .footer-content .footer-image {
      width: 100%;
      height: auto;
      bottom: 0; }
    .footer .footer-content .footer-horse {
      position: absolute;
      left: 80px;
      bottom: 45px;
      z-index: 5; }
    .footer .footer-content .footer-avatar {
      position: absolute;
      right: 50px;
      bottom: 0px;
      z-index: 4; }