.calc-container {
  max-width: 650px;
  margin: 40px auto 20px auto;
  padding: 30px;
  border-radius: 20px;
  color: white;
  text-align: center;
  font-family: 'Helvetica Neue LT Std';
  

  background-image: url('../img/fondo.jpeg');
  background-size: cover;       /* la imagen cubre todo el div */
  background-position: center;  /* centrada */
  background-repeat: repeat; /* que no se repita */
}

.calc-container form {
    margin-top: 30px;
}

.note-bottom {
    font-family: 'Helvetica Neue LT Std';
}


  .inner-container {
    border: 2px solid white;
    padding: 45px;
    border-radius: 25px 0 25px 25px;
    position: relative
  }

.calc-title {
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 25px;
  color: white;
  /* text-shadow: 
    1px 1px 0 white,
   -1px 1px 0 white,
    1px -1px 0 white,
   -1px -1px 0 white; */
  text-align: center;
}

  .calc-input {
    border-radius: 30px;
    overflow: hidden;
    background: white;
    display: flex;
    align-items: center;
  }

  .input-group {
    margin: 7px 0;
    padding: 5px;
  }

  .calc-input .input-label {
    flex: 1;
    background: white;
    color: #333;
    font-weight: bold;
    text-align: right;
    padding: 8px 12px;
    border-right: 2px solid #027FBC;
    text-align: center;
    font-size: 16px;
  }

  .calc-input input {
    flex: 1;
    border: none;
    outline: none;
    box-shadow: none;
    padding: 8px 12px;
    font-weight: bold;
    color: #333;
  }

  .calc-input.highlight {
    background: #e6f4fb; /* azul suave */
  }

  .calc-input.highlight input {
    background-color: transparent;
  }

  .calc-input.highlight .input-label {
    background: #e6f4fb;
  }

  .note {
    font-size: 12px;
    margin-top: 25px;
    color: #f0f0f0;
  }

  /* Texto lateral derecho */
.calc-side-text {
  position: absolute;
  top: 47%;
  right: 10px;
  transform: rotate(270deg) translateX(50%);
  transform-origin: right center;
  font-size: 32px;
  font-weight: 400;
  color: white;
  opacity: .5;
  font-family: 'Helvetica Neue LT Std', sans-serif;
  white-space: nowrap;
}

.calc-side-text span {
  font-weight: 700; /* Venecitas más grueso */
}

.calc-input span {
    position: absolute;
    z-index: 9;
    color: black;
    right: 10px;
}

@media(max-width: 767px){

    .calc-container form {
        margin-top: 0;
    }

    .note {
        margin-top: 15px;
    }

    .calc-title {
        font-size: 20px
    }

}

@media(max-width: 565px){

    .calc-title {
        font-size: 16px
    }

    .inner-container {
        padding: 27px;
    }

    .calc-side-text {
        font-size: 24px;
        /* top: 55px; */
    }

    .calc-input .input-label {
        font-size: 12px;
    }

}