.field {
    display: grid;
    gap: 4px;
    margin: 14px 0
}

.field label {
    font-size: 12px;
    font-weight: 700
}

.field input,
.field select,
.field textarea {
    width: 100%;
    border: 1px solid #bfcae0;
    border-radius: 12px;
    padding: 12px;
    background: #fff;
    color: var(--ink)
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    outline: 2px solid var(--blue);
    border-color: var(--blue)
}

.form-note {
    padding: 12px;
    border-radius: 12px;
    background: #edf3ff;
    color: #47639c;
    font-size: 12px
}

.event-select {
    margin: 20px 0 22px
}

.event-select>label {
    display: block;
    font-weight: 750;
    font-size: 13px;
    margin-bottom: 9px
}

.event-select select {
    font: inherit;
    width: 100%;
    padding: 13px 14px;
    border: 1px solid #b8c8e6;
    border-radius: 12px;
    color: #132045;
    background: #fff
}

.event-details {
    margin-top: 12px;
    border: 1px solid #d7e3f6;
    border-radius: 18px;
    padding: 17px;
    background: #f4f7ff;
    display: grid;
    gap: 8px;
    font-size: 13px;
    color: #41557c
}

.event-details strong {
    font-size: 16px;
    color: #132045
}

.event-details span {
    display: block
}

.event-details .price-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 13px 0;
    border-top: 1px solid #d7e3f6;
    margin-top: 4px
}

.event-details .price-row strong {
    font-size: 24px;
    color: #071b6b
}

.event-details small {
    font-size: 11px;
    line-height: 1.5;
    color: #6e7c94
}