.bk__inner{
  min-height: 100vh;
  display: flex;
  align-items: stretch;
}

.bk__inner {
  display: grid;
  grid-template-columns: 42.82% 57.18%;
  width: 100%;
}

.bk__left {
    padding: 145.5px 50px 100px calc((100vw - 1336px) / 2);
    background: #F7F7F7;
}

.bk__right {
    padding: 101px calc((100vw - 1336px) / 2) 100px clamp(40px, 7.813vw, 135px);
}

.bk__amount{
    font-family: "Satoshi-Black";
    font-size: 32px;
    line-height: 1.2;
    margin-bottom: 0;
}   

.bk__amount span{
    font-size: 24px;
}

.bk__lifetime{
    font-family: "Satoshi-Bold";
    font-size: 20px;
    line-height: calc(24 / 20);
    color: var(--blue);
    margin-bottom: 15.5px;
}

.bk__trial{
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 0%;
    color: #707070;
}

.bk__trial strong{
  font-family: "Satoshi-Black";
}

.bk__trial a, .bk__plan-desc a{
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;

}

.bk__price{
    padding-bottom: 30px;
    border-bottom: 1px solid #D7D7D7;
    margin-bottom: 30px;
    padding-left: 11px;

}

.bk__plan-icon svg {
    max-width: 21px;
}

.bk__plan-icon{
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blue);
    width: 40px;
    height: 40px;
}

.bk-plan__badge{
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 30px;
    padding-left: 6px;
}

.bk__plan-name{
    color: #1C1C1C;
    font-family: "Satoshi-Black";
    font-size: 18px;
    line-height: calc(24 / 18);
    vertical-align: middle;

}

.bk__plan-desc{
    font-style: italic;
    font-size: 18px;
    line-height: 24px;
    color: #707070;
    margin-bottom: 33px;
    font-family: "Satoshi-MediumItalic";
}

.bk__features{
    margin-left: 28px;
}

.bk__features li:not(:last-child){
    margin-bottom: 12px;
}

.bk__features li{
    color: #000;
    font-size: 18px;
    line-height: 1.6;

}

.bk__features li strong{
    
  font-family: "Satoshi-Bold";
}

.bk__guarantee{
        background: #0F00B31A;
    padding: 13px 38px 13px 30px;
    width: max-content;
    border-radius: 10px;
    margin-left: 12px;
    margin-top: 31px;
    color: var(--blue);
    font-family: "Satoshi-Black";
    font-size: 16px;
    line-height: 22px;
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: 100%;
}

.bk__section-title{
    color: #1C1C1C;
    font-family: "Satoshi-Black";
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 30px;
}

.bk__section:first-child .bk__section-title{
    margin-bottom: 20.5px;
}
/*  */

/* BOOKING */

.bk__section {
    margin-bottom: 60px;
}

.bk__plans {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    max-width: 639px;
}

.bk__plan-option {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 19px 30px 17px 30px;
    cursor: pointer;
    display: block;
}

.bk__plan-option.selected {
    border-color: var(--blue);
    background: #f0eeff;
    border-width: 3px;
}

.bk__plan-option-name {
    font-family: "Satoshi-Bold";
    font-size: 18px;
    color: var(--blue);
    margin-bottom: 15px;
    line-height: 20px;
}

.bk__plan-option-price {
    font-family: "Satoshi-Bold";
    font-size: 20px;
    color: var(--blue);
    line-height: 20px;
    margin-bottom: 0;
}

.bk__plan-option-note {
    font-size: 16px;
    color: var(--blue);
    line-height: 20px;
    margin: 0;
}

/* Plan annuel - k active */
.bk__plan-option:not(.selected) .bk__plan-option-name,
.bk__plan-option:not(.selected) .bk__plan-option-price,
.bk__plan-option:not(.selected) .bk__plan-option-note {
    color: #000;
}

.bk__plan-option:not(.selected) .bk__plan-option-note {
    text-decoration: line-through;
    color: #707070;
}

/* Fields */
.bk__field {
    margin-bottom: 30px;
}

.bk__field label {
    display: block;
    font-size: 16px;
    line-height: 20px;
    font-family: "Satoshi-Bold";
    margin-bottom: 15px;
    color: #000;
}

.bk__field label.bk__checkbox {
  font-family: 'Satoshi-Medium', system-ui, -apple-system, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
}

.bk__field input[type="text"],
.bk__field input[type="number"],
.bk__field input[type="email"],
.bk__field input[type="tel"] {
    width: 100%;
    border: 1px solid #D7D7D7;
    border-radius: 6px;
    padding: 14px 30px;
    font-family: inherit;
    font-size: 16px;
    line-height: 20px;
    color: #000;
    outline: none;
}

/* Chrome, Safari, Edge */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}

.bk__field input::placeholder {
    color: #707070;
}

.bk__field input:focus {
    border-color: var(--blue);
}

.bk__phone-row,
.bk__vat-row {
    display: flex;
    gap: 15px;
}

.bk__phone-flag {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #D7D7D7;
    border-radius: 6px;
    padding: 10px 12px;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    font-size: 14px;
}

.bk__phone-row input,
.bk__vat-row input {
    flex: 1;
}

.bk__address-row {
    display: grid;
    grid-template-columns: 68.5% 1fr;
    gap: 15px;
    margin-bottom: 15px;
}

.bk__field .bk__address-row:nth-child(odd){
    grid-template-columns: 1fr 1fr;
}

.bk__vat-input-wrap {
    position: relative;
    flex: 1;
}

.bk__vat-input-wrap input {
    width: 100%;
}

#vat-status {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
}

/* Checkbox */
.bk__field--checkbox {
    margin-bottom: 32px;
}

.bk__checkbox {
    display: flex !important;
    align-items: center;
    gap: 15px;
    cursor: pointer;
    font-size: 16px;

  font-family: "Satoshi-Medium";
}

.bk__checkbox strong {

  font-family: "Satoshi-Bold";
}

.bk__checkbox input {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    cursor: pointer;
}

.bk__checkbox a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
  font-family: "Satoshi-Medium";
}

/* Submit */
.bk__submit {
    width: 100%;
    background: var(--blue);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 18px 24px;
    font-size: 13.34px;
    font-family: "Satoshi-Bold";
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    gap: 12px;
    margin-bottom: 29px;
    line-height: 24px;
    max-width: 648px;
}

#submitArrow{
    line-height: 0;
}

.bk__submit:hover {
    opacity: 0.9;
}

.bk__submit-note {
    font-size: 16px;
    text-align: center;
    color: #707070;
    line-height: 22px;
    max-width: 462px;
    margin: 0 auto !important;

}

.bk__submit-note strong{
  font-family: "Satoshi-Black";
}

.bk__submit-note a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

#form-message {
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 16px;
}

.bk__section .bk__field{
    max-width: 612px;
}

.bk__phone-select {
  border: 1px solid #D7D7D7;
  border-radius: 6px;
  padding: 10px 30px;
  font-family: inherit;
  font-size: 16px;
  line-height: 20px;
  cursor: pointer;
  flex-shrink: 0;
  background: #fff;
  color: #707070;
  height: 50px;
}

.bk__phone-select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4KPHBhdGggZD0iTTYgOUwxMiAxNUwxOCA5IiBzdHJva2U9IiMwRjBDMjIiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPg==");
  background-repeat: no-repeat;
  background-position: right 30px center;
  padding-right: 69px; 
}

.field-error-msg{
    color: red;
    font-size: 14px;
    margin-top: 5px;
}

.booking-form{
    position: relative;
}

.booking-form::after, .demo-form::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.5);
    z-index: 1;
    display: none;
}
.booking-form.loading::after,
.demo-form.loading::after{
    display: block;
}
#statusBox{
    text-align: center;
    font-size: 16px;
    line-height: 20px;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 16px;
}
#statusBox.error{
    background: rgba(255, 0, 0, 0.3);
    color: #e53935;
    margin-top: 20px;
}
#statusBox.success{
    background: rgba(0, 128, 0, 0.3);
    color: #1e7d3b;
    margin-top: 20px;
}

.bk__vat-row{
    align-items: flex-start;
}

.vat-status {
  display: block;
  font-size: 13px;
  margin-top: 4px;
}
.vat-status--loading { color: #6b6b6b; }
.vat-status--success { color: #1e7d3b; }
.vat-status--warning { color: #b8860b; }
.vat-status--error   { color: #e53935; }

.bk__vat-input-wrap .bk-spinner{
    position: absolute;
    right: 14px;
    top: 17px;
    border: 2px solid rgba(0, 0, 0, 0.4);
    border-top-color: #000;
    display: none;
}

.bk__vat-input-wrap.loading .bk-spinner{
    display: block;
}

/* Update country dropdown */
.custom-dropdown {
    position: relative;
    flex: 0 0 183px;
}
.bk__phone-row .custom-dropdown{
    flex: 0 0 150px;
}
.dropdown-trigger {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 1px solid #D7D7D7;
    border-radius: 6px;
    padding: 12px 20px;
    background: #fff;
    font-size: 16px;
    font-family: inherit;
    color: #707070;
    cursor: pointer;
}
.dropdown-trigger:focus { 
    outline: none; 
    border-color: #4338ff; 
}
.dropdown-trigger .flag-icon { 
    width: 20px; 
    height: 15px; 
    object-fit: cover; 
    border-radius: 2px; 
}
.dropdown-label { 
    text-align: left; 
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
}
.dropdown-arrow { 
    flex-shrink: 0; 
    color: #0F0C22; 
    transition: transform 0.15s; 
}
.custom-dropdown.open .dropdown-arrow { 
    transform: rotate(180deg); 
}

.dropdown-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  width: 200px;
  max-height: 260px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  list-style: none;
  margin: 0;
  padding: 6px;
  z-index: 20;
  display: none;
}
.custom-dropdown.open .dropdown-list { 
    display: block; 
}

.dropdown-list li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  font-size: 14px;
  border-radius: 6px;
  cursor: pointer;
  white-space: nowrap;
  color: #707070;
}
.dropdown-list li:hover { 
    background: #f3f2ff; 
}
.dropdown-list li.active { 
    background: #0F00B31A; 
    color: var(--blue);
    font-weight: 600; 
}
.dropdown-list li img { 
    width: 20px; 
    height: 15px; 
    object-fit: cover; 
    border-radius: 2px; 
}

@media (max-width: 1376px){
   .bk__left {
        padding-left: 20px
    }

    .bk__right {
        padding-right: 20px
    }
}

@media(max-width: 1024px){
    .bk__left{
        padding-right: 40px;
    }

    .bk__right{
        padding-left: 40px;
    }
}

@media (max-width: 991px){
    .bk__phone-row, .bk__vat-row{
        flex-direction: column;
    }

    .bk__address-row{
        grid-template-columns: 1fr
    }
    .custom-dropdown{
        flex: 0 0 100%;
        width: 100%;
    }
    .bk__vat-input-wrap{
        width: 100%;
    }
    .dropdown-label{
        flex: 1;
    }
    .bk__phone-row .custom-dropdown{
        flex: 0 0 100%;
    }
}

@media (max-width: 767px) {
  .bk__inner {
    grid-template-columns: 1fr;
  }

  .bk__left{
    padding: 60px 20px

  }

  .bk__right{
    padding-top: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .bk__plans{
    grid-template-columns: 1fr;
  }

  .bk__guarantee{
    margin-left: 0;
  }
}