body {
      background: #0b0f14;
      color: #e0f7f5;
      font-family: 'Orbitron', sans-serif;
  }

  :root {
      --primary: #3ef0d0;
      --primary-glow: rgba(62, 240, 208, 0.6);
  }

  /* HEADER */
  .navbar {
      background: rgba(10, 15, 20, 0.8);
      backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(62, 240, 208, 0.2);
  }

  .navbar-brand {
      color: var(--primary) !important;
      font-weight: 600;
      letter-spacing: 2px;
  }

  .nav-link {
      color: #b0dcd7 !important;
      transition: 0.3s;
  }

  .nav-link:hover {
      color: var(--primary) !important;
      text-shadow: 0 0 8px var(--primary-glow);
  }

  /* HERO */
  .hero {
      padding: 120px 0;
      text-align: center;
      background: radial-gradient(circle at center, rgba(62, 240, 208, 0.08), transparent);
  }

  .hero h1 {
      font-size: 3rem;
      color: var(--primary);
      text-shadow: 0 0 15px var(--primary-glow);
  }

  .btn-custom {
      border: 1px solid var(--primary);
      color: var(--primary);
      padding: 10px 25px;
      background: transparent;
      transition: 0.3s;
  }

  .btn-custom:hover {
      background: var(--primary);
      color: #000;
      box-shadow: 0 0 15px var(--primary-glow);
  }

  /* FOOTER */
  footer {
      border-top: 1px solid rgba(62, 240, 208, 0.2);
      padding: 40px 0;
      text-align: center;

      font-size: 0.9rem;
      color: #7aa9a4;
  }

  .footer-title {
      color: var(--primary);
      margin-bottom: 15px;
      text-shadow: 0 0 10px var(--primary-glow);
  }

  .footer-links {
      list-style: none;
      padding: 0;
  }

  .footer-links li {
      margin-bottom: 8px;
  }

  .footer-links a {
      color: #9fded6;
      text-decoration: none;
      transition: 0.3s;
  }

  .footer-links a:hover {
      color: var(--primary);
      text-shadow: 0 0 8px var(--primary-glow);
  }

  .footer-text {
      color: #7aa9a4;
      margin-bottom: 6px;
  }

  .footer-bottom {
      color: #5c8f89;
      font-size: 0.85rem;
  }

  .hero {
      min-height: 60vh;
      background: radial-gradient(circle at 70% center, rgba(62, 240, 208, 0.08), transparent);
  }

  .hero-title {
      font-size: 3rem;
      color: #eafffb;
      line-height: 1.2;
  }

  .hero-title span {
      color: var(--primary);
      text-shadow: 0 0 15px var(--primary-glow);
  }

  .hero-subtitle {
      margin-top: 20px;
      color: #9fded6;
      font-size: 1.1rem;
      max-width: 500px;
  }

  .hero-img {
      max-width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 40px rgba(62, 240, 208, 0.2);
  }

  /* buttons */
  .btn-outline-custom {
      border: 1px solid rgba(62, 240, 208, 0.5);
      color: #9fded6;
      padding: 10px 25px;
      background: transparent;
      transition: 0.3s;
  }

  .btn-outline-custom:hover {
      border-color: var(--primary);
      color: var(--primary);
      box-shadow: 0 0 10px var(--primary-glow);
  }

  .about-section {
      padding: 100px 0;
      background: linear-gradient(180deg, transparent, rgba(62, 240, 208, 0.05));
  }

  .about-title {
      color: var(--primary);
      font-size: 2.2rem;
      margin-bottom: 20px;
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .about-text {
      color: #9fded6;
      margin-bottom: 15px;
      line-height: 1.6;
  }

  .about-img {
      width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 35px rgba(62, 240, 208, 0.15);
  }

  .features-section {
      padding: 100px 0;
  }

  .features-title {
      color: var(--primary);
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .feature-card {
      padding: 25px 15px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid rgba(62, 240, 208, 0.15);
      transition: 0.3s;
  }

  .feature-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 0 25px rgba(62, 240, 208, 0.25);
      border-color: var(--primary);
  }

  .feature-icon {
      font-size: 2rem;
      margin-bottom: 10px;
      color: var(--primary);
      text-shadow: 0 0 10px var(--primary-glow);
  }

  .feature-card h6 {
      color: #b8f2ea;
      font-size: 0.95rem;
  }

  .why-section {
      padding: 100px 0;
      background: radial-gradient(circle at 30% center, rgba(62, 240, 208, 0.06), transparent);
  }

  .why-title {
      color: var(--primary);
      font-size: 2.2rem;
      margin-bottom: 20px;
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .why-text {
      color: #9fded6;
      margin-bottom: 20px;
      line-height: 1.6;
  }

  .why-list {
      list-style: none;
      padding: 0;
      margin-bottom: 20px;
  }

  .why-list li {
      margin-bottom: 10px;
      color: #b8f2ea;
  }

  .why-img {
      max-width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 35px rgba(62, 240, 208, 0.2);
  }

  .testimonials-section {
      padding: 100px 0;
  }

  .testimonials-title {
      color: var(--primary);
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .testimonial-card {
      padding: 25px 20px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid rgba(62, 240, 208, 0.15);
      transition: 0.3s;
      height: 100%;
  }

  .testimonial-card:hover {
      transform: translateY(-6px);
      border-color: var(--primary);
      box-shadow: 0 0 20px rgba(62, 240, 208, 0.25);
  }

  .stars {
      color: var(--primary);
      margin-bottom: 10px;
      letter-spacing: 2px;
      text-shadow: 0 0 8px var(--primary-glow);
  }

  .testimonial-card p {
      color: #9fded6;
      font-size: 0.95rem;
  }

  .author {
      display: block;
      margin-top: 10px;
      color: #6faea7;
      font-size: 0.85rem;
  }

  .form-section {
      padding: 100px 0;
  }

  .form-box {
      max-width: 500px;
      padding: 40px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid rgba(62, 240, 208, 0.15);
      box-shadow: 0 0 30px rgba(62, 240, 208, 0.1);
  }

  .form-title {
      color: var(--primary);
      text-align: center;
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .form-subtitle {
      text-align: center;
      color: #9fded6;
      margin-bottom: 25px;
  }

  /* inputs */
  form input,
  form select,
  form textarea {
      width: 100%;
      margin-bottom: 15px;
      padding: 10px 15px;
      border-radius: 10px;
      border: 1px solid rgba(62, 240, 208, 0.2);
      background: transparent;
      color: #dffcf9;
  }

  form input:focus,
  form select:focus,
  form textarea:focus {
      outline: none;
      border-color: var(--primary);
      box-shadow: 0 0 10px var(--primary-glow);
  }

  /* MODAL */
  .custom-modal {
      display: none;
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.7);
      justify-content: center;
      align-items: center;
  }

  .modal-content-box {
      background: #0b0f14;
      padding: 30px;
      border-radius: 20px;
      text-align: center;
      border: 1px solid var(--primary);
      box-shadow: 0 0 25px var(--primary-glow);
      position: relative;
  }

  .close-modal {
      position: absolute;
      top: 10px;
      right: 15px;
      cursor: pointer;
      font-size: 20px;
      color: var(--primary);
  }

  form select {
      appearance: none;
      -webkit-appearance: none;
      -moz-appearance: none;

      background: #0b0f14;
      color: #dffcf9;

      border: 1px solid rgba(62, 240, 208, 0.3);
      border-radius: 10px;

      padding: 10px 15px;
      cursor: pointer;
  }

  /* стрелка */
  form select {
      background-image: linear-gradient(45deg, transparent 50%, var(--primary) 50%),
          linear-gradient(135deg, var(--primary) 50%, transparent 50%);
      background-position: calc(100% - 20px) calc(50% - 3px),
          calc(100% - 15px) calc(50% - 3px);
      background-size: 5px 5px;
      background-repeat: no-repeat;
  }

  .tournaments-section {
      padding: 100px 0;
  }

  .tournaments-title {
      color: var(--primary);
      font-size: 2.2rem;
      text-shadow: 0 0 12px var(--primary-glow);
      margin-bottom: 20px;
  }

  .tournaments-text {
      color: #9fded6;
      margin-bottom: 15px;
      line-height: 1.6;
  }

  .tournaments-img {
      width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 40px rgba(62, 240, 208, 0.2);
  }

  .tournaments-section {
      padding: 100px 0;
  }

  .tournaments-title {
      color: var(--primary);
      font-size: 2.2rem;
      text-shadow: 0 0 12px var(--primary-glow);
      margin-bottom: 20px;
  }

  .tournaments-text {
      color: #9fded6;
      margin-bottom: 15px;
      line-height: 1.6;
  }

  .tournaments-img {
      width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 40px rgba(62, 240, 208, 0.2);
  }

  .custom-table {
      width: 100%;
      border-collapse: separate;
      border-spacing: 0 10px;
  }

  .custom-table thead th {
      color: var(--primary);
      font-weight: 600;
      text-align: left;
      padding: 10px 15px;
      font-size: 0.9rem;
      text-shadow: 0 0 10px var(--primary-glow);
  }

  .custom-table tbody tr {
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid rgba(62, 240, 208, 0.15);
      transition: 0.3s;
  }

  .custom-table tbody tr:hover {
      background: rgba(62, 240, 208, 0.05);
      box-shadow: 0 0 15px rgba(62, 240, 208, 0.2);
  }

  .custom-table td {
      padding: 12px 15px;
      color: #b8f2ea;
  }

  /* скругления */
  .custom-table tbody tr td:first-child {
      border-top-left-radius: 10px;
      border-bottom-left-radius: 10px;
  }

  .custom-table tbody tr td:last-child {
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
  }

  .status-open {
      color: #3ef0d0;
      text-shadow: 0 0 8px rgba(62, 240, 208, 0.6);
  }

  .status-closed {
      color: #ff5c5c;
  }

  .guides-section {
      padding: 100px 0;
  }

  .guides-title {
      color: var(--primary);
      font-size: 2.2rem;
      text-shadow: 0 0 12px var(--primary-glow);
      margin-bottom: 20px;
  }

  .guides-text {
      color: #9fded6;
      margin-bottom: 15px;
      line-height: 1.6;
  }

  .guides-img {
      width: 100%;
      border-radius: 20px;
      box-shadow: 0 0 35px rgba(62, 240, 208, 0.2);
  }

  .start-section {
      padding: 100px 0;
      background: linear-gradient(180deg, transparent, rgba(62, 240, 208, 0.05));
  }

  .start-title {
      color: var(--primary);
      text-shadow: 0 0 12px var(--primary-glow);
  }

  .start-card {
      padding: 30px 20px;
      border-radius: 20px;
      background: rgba(255, 255, 255, 0.02);
      border: 1px solid rgba(62, 240, 208, 0.15);
      transition: 0.3s;
  }

  .start-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 0 25px rgba(62, 240, 208, 0.25);
      border-color: var(--primary);
  }

  .start-icon {
      font-size: 2rem;
      margin-bottom: 10px;
      color: var(--primary);
      text-shadow: 0 0 10px var(--primary-glow);
  }

  .start-card h5 {
      color: #e0f7f5;
  }

  .start-card p {
      color: #9fded6;
      font-size: 0.95rem;
  }

  .cookie-box {
      position: fixed;
      bottom: 20px;
      left: 50%;
      transform: translateX(-50%);
      background: #0b0f14;
      border: 1px solid rgba(62, 240, 208, 0.3);
      box-shadow: 0 0 20px rgba(62, 240, 208, 0.2);
      border-radius: 15px;
      padding: 20px;
      width: 90%;
      max-width: 500px;
      z-index: 9999;
  }

  .cookie-content p {
      color: #9fded6;
      font-size: 0.9rem;
      margin-bottom: 15px;
  }

  .cookie-content a {
      color: var(--primary);
      text-decoration: none;
  }

  .cookie-content a:hover {
      text-shadow: 0 0 8px var(--primary-glow);
  }

  .cookie-buttons {
      display: flex;
      gap: 10px;
      justify-content: flex-end;
  }