@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');



body{
    background: #000!important;
    color: #fff!important;
}


.title_page, .title_page p{
    font-family: "Bebas Neue", sans-serif;
 font-size: 2em;
  text-align: center;
  background: linear-gradient(90deg, #ff1a1a 0%, #ff3333 40%, #cc0000 70%, #ff6666 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 2px;
}

/******/

  .competencias {
      list-style: none;
      padding: 0;
    }
    .competencias li {
      margin: 8px 0;
      padding-left: 20px;
      position: relative;
    }
    .competencias li::before {
      content: "•"; /* viñeta personalizada */
      color: #e74c3c; /* rojo */
      position: absolute;
      left: 0;
      font-weight: bold;
    }
    .year {
      font-size: 1.2em;
      font-weight: bold;
      margin-top: 20px;
      color: #2c3e50;
    }
















/* CSS */
.pricing-table {
  width: 100%;
  overflow-x: auto; /* scroll horizontal en móviles si es necesario */
  margin: 20px 0;
}

.pricing-table table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
}

.pricing-table th,
.pricing-table td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

.pricing-table th {
  background-color: #2c3e50;
  color: #fff;
  font-weight: bold;
}

.pricing-table tr:nth-child(even) {
  background-color: #f9f9f9;
}

/* Responsive: en pantallas pequeñas la tabla se convierte en bloques */
@media (max-width: 600px) {
  .pricing-table table,
  .pricing-table thead,
  .pricing-table tbody,
  .pricing-table th,
  .pricing-table td,
  .pricing-table tr {
    display: block;
  }

  .pricing-table thead tr {
    display: none; /* ocultamos encabezados */
  }

  .pricing-table tr {
    margin-bottom: 15px;
    border: 1px solid #ddd;
    padding: 10px;
    background: #fff;
  }

  .pricing-table td {
    border: none;
    position: relative;
    padding-left: 50%;
    text-align: left;
  }

  .pricing-table td::before {
    content: attr(data-label);
    position: absolute;
    left: 10px;
    font-weight: bold;
    color: #2c3e50;
  }
}

/* CSS */
.prep-table {
  width: 100%;
  overflow-x: auto;
  margin: 20px 0;
}

.prep-table table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
}

.prep-table th,
.prep-table td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

.prep-table th {
  background-color: #34495e;
  color: #fff;
  font-weight: bold;
}

.prep-table tr:nth-child(even) {
  background-color: #f9f9f9;
}

/* Responsive: en pantallas pequeñas la tabla se convierte en bloques */
@media (max-width: 600px) {
  .prep-table table,
  .prep-table thead,
  .prep-table tbody,
  .prep-table th,
  .prep-table td,
  .prep-table tr {
    display: block;
  }

  .prep-table thead tr {
    display: none; /* ocultamos encabezados */
  }

  .prep-table tr {
    margin-bottom: 15px;
    border: 1px solid #ddd;
    padding: 10px;
    background: #fff;
  }

  .prep-table td {
    border: none;
    position: relative;
    padding-left: 50%;
    text-align: left;
  }

  .prep-table td::before {
    content: attr(data-label);
    position: absolute;
    left: 10px;
    font-weight: bold;
    color: #34495e;
  }
}

/* CSS */
.months-table {
  width: 100%;
  overflow-x: auto;
  margin: 20px 0;
}

.months-table table {
  width: 100%;
  border-collapse: collapse;
  font-family: Arial, sans-serif;
}

.months-table th,
.months-table td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}

.months-table th {
  background-color: #1abc9c;
  color: #fff;
  font-weight: bold;
}

.months-table tr:nth-child(even) {
  background-color: #f9f9f9;
}

/* Responsive: en pantallas pequeñas la tabla se convierte en bloques */
@media (max-width: 600px) {
  .months-table table,
  .months-table thead,
  .months-table tbody,
  .months-table th,
  .months-table td,
  .months-table tr {
    display: block;
  }

  .months-table thead tr {
    display: none; /* ocultamos encabezados */
  }

  .months-table tr {
    margin-bottom: 15px;
    border: 1px solid #ddd;
    padding: 10px;
    background: #fff;
  }

  .months-table td {
    border: none;
    position: relative;
    padding-left: 50%;
    text-align: left;
  }

  .months-table td::before {
    content: attr(data-label);
    position: absolute;
    left: 10px;
    font-weight: bold;
    color: #1abc9c;
  }
}