.kj-reservation-app {
	background: #070708;
	color: #f4f1ea;
	padding: clamp(28px, 6vw, 80px) 18px;
}
.kj-reservation-shell {
	width: min(100%, 980px);
	margin: 0 auto;
}
.kj-reservation-intro {
	max-width: 780px;
	margin-bottom: 24px;
}
.kj-reservation-eyebrow {
	color: #d9b46a;
	text-transform: uppercase;
	letter-spacing: .16em;
	font-size: .78rem;
	font-weight: 800;
}
.kj-reservation-intro h1 {
	font-size: clamp(2.2rem, 7vw, 5rem);
	line-height: .98;
	letter-spacing: -.05em;
	margin: 0 0 12px;
}
.kj-reservation-intro p {
	color: rgba(244,241,234,.78);
	font-size: 1.05rem;
}
.kj-reservation-form, .kj-reservation-success {
	background: rgba(255,255,255,.055);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 28px;
	box-shadow: 0 24px 70px rgba(0,0,0,.28);
	padding: clamp(18px, 4vw, 38px);
}
.kj-reservation-progress {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
	margin-bottom: 24px;
}
.kj-reservation-progress span {
	display: grid;
	place-items: center;
	border: 1px solid rgba(255,255,255,.18);
	background: rgba(255,255,255,.08);
	border-radius: 999px;
	height: 34px;
	color: rgba(244,241,234,.72);
}
.kj-reservation-progress span.is-active {
	background: #d9b46a;
	color: #111;
	border-color: #d9b46a;
	font-weight: 800;
}
.kj-reservation-step { display: none; }
.kj-reservation-step.is-active { display: block; }
.kj-reservation-step h2 {
	margin-top: 0;
	font-size: clamp(1.5rem, 3vw, 2.4rem);
	letter-spacing: -.035em;
}
.kj-reservation-card-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}
.kj-reservation-card-grid label {
	display: block;
	cursor: pointer;
}
.kj-reservation-card-grid input {
	position: absolute;
	opacity: 0;
}
.kj-reservation-card-grid span {
	display: block;
	min-height: 88px;
	padding: 18px;
	border-radius: 18px;
	border: 1px solid rgba(255,255,255,.14);
	background: rgba(255,255,255,.07);
}
.kj-reservation-card-grid input:checked + span {
	border-color: #d9b46a;
	background: rgba(217,180,106,.18);
	box-shadow: 0 0 0 2px rgba(217,180,106,.28);
}
.kj-reservation-two-col {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
}
.kj-reservation-field {
	margin-bottom: 16px;
}
.kj-reservation-field label {
	display: block;
	margin-bottom: 7px;
	font-weight: 700;
	color: #f4f1ea;
}
.kj-reservation-field input,
.kj-reservation-field select,
.kj-reservation-field textarea {
	width: 100%;
	border: 1px solid rgba(255,255,255,.14);
	background: rgba(255,255,255,.96);
	color: #111;
	border-radius: 14px;
	padding: 13px 14px;
	font: inherit;
}
.kj-reservation-estimate {
	margin: 22px 0 10px;
	padding: 16px 18px;
	border-radius: 18px;
	background: rgba(217,180,106,.14);
	border: 1px solid rgba(217,180,106,.34);
}
.kj-reservation-estimate span {
	font-size: 1.6rem;
	font-weight: 900;
	color: #d9b46a;
}
.kj-reservation-estimate small {
	display: block;
	color: rgba(244,241,234,.72);
}
.kj-reservation-deposit-note {
	color: rgba(244,241,234,.7);
	font-size: .95rem;
}
.kj-reservation-actions {
	display: flex;
	gap: 12px;
	justify-content: flex-end;
	margin-top: 20px;
}
.kj-reservation-actions button {
	border: 0;
	border-radius: 999px;
	padding: 12px 20px;
	font-weight: 800;
	cursor: pointer;
}
.kj-reservation-next,
.kj-reservation-submit {
	background: #d9b46a;
	color: #111;
}
.kj-reservation-back {
	background: rgba(255,255,255,.12);
	color: #fff;
}
.kj-reservation-submit { display: none; }
.kj-reservation-form[data-step="4"] .kj-reservation-submit { display: inline-flex; }
.kj-reservation-form[data-step="4"] .kj-reservation-next { display: none; }
.kj-reservation-form[data-step="1"] .kj-reservation-back { display: none; }

@media (max-width: 760px) {
	.kj-reservation-card-grid,
	.kj-reservation-two-col {
		grid-template-columns: 1fr;
	}
	.kj-reservation-form {
		padding: 16px;
		border-radius: 22px;
	}
	.kj-reservation-actions {
		position: sticky;
		bottom: 0;
		background: rgba(7,7,8,.92);
		backdrop-filter: blur(10px);
		margin-inline: -16px;
		padding: 14px 16px;
	}
	.kj-reservation-actions button {
		flex: 1;
	}
}

/* Stage 7.7.22 styling production fields */
.kj-reservation-field--full {
	grid-column: 1 / -1;
}