.bg-navy {
	background-color: #000c1a; /* สีน้ำเงินเข้มตามภาพ */
}

.text-gold {
	color: #c9a063 !important;
}

/* กล่อง Why Choose ที่มีเส้นขอบล้อมรอบ */
.why-choose-box {
	border: 1px solid rgba(201, 160, 99, 0.3);
	border-radius: 15px;
}

/* จัดการรูป Icon ให้พอดีวงกลม */
.icon-circle, .icon-circle-step {
	width: 80px;
	height: 80px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(circle, rgba(201,160,99,0.2) 0%, rgba(0,0,0,0) 70%);
}

	.icon-circle img, .icon-circle-step img {
		width: 50px;
		height: auto;
		object-fit: contain;
	}

/* เส้นคั่นแนวตั้งระหว่างคอลัมน์ (Desktop) */
@media (min-width: 768px) {
	.border-end-custom {
		border-right: 1px solid rgba(255, 255, 255, 0.1);
	}
}

/* ปรับแต่งสำหรับ Mobile (2 คอลัมน์ต่อบรรทัด) */
@media (max-width: 767px) {
	.col-6 {
		padding-bottom: 20px;
	}

	.why-choose-box h2, .booking-process h2 {
		font-size: 1.4rem;
	}

	.icon-circle, .icon-circle-step {
		width: 60px;
		height: 60px;
	}

		.icon-circle img, .icon-circle-step img {
			width: 40px;
		}
}

/* ขั้นตอนการจอง (Booking Process) - สไตล์ตัวอักษร */
.booking-process h6 {
	margin-top: 10px;
	font-weight: bold;
}

/* Container สำหรับ Timeline */
.timeline-container {
	position: relative;
}

.step-item {
	position: relative;
	text-align: center;
	padding: 20px 10px;
}

/* สร้างวงกลมล้อมรอบไอคอน */
.icon-circle-step {
	width: 85px;
	height: 85px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(circle, rgba(201, 160, 99, 0.2) 0%, rgba(0, 0, 0, 0.5) 100%);
	border: 1px solid rgba(201, 160, 99, 0.3);
	border-radius: 50%;
	position: relative;
	z-index: 2;
}

	.icon-circle-step img {
		width: 45px;
		height: auto;
		object-fit: contain;
	}

/* เส้นเชื่อมต่อและลูกศร (Desktop) */
@media (min-width: 768px) {
	.step-item:not(:last-child)::after {
		content: "→"; /* หรือใช้รูปภาพลูกศรของคุณเอง */
		position: absolute;
		top: 42px; /* กึ่งกลางไอคอน */
		right: -15%;
		color: rgba(201, 160, 99, 0.5);
		font-size: 24px;
		z-index: 1;
	}
}

/* การแสดงผลบน Mobile (2 คอลัมน์ต่อบรรทัด) */
@media (max-width: 767px) {
	.step-item {
		margin-bottom: 30px;
	}

	.icon-circle-step {
		width: 70px;
		height: 70px;
	}

		.icon-circle-step img {
			width: 35px;
		}

	/* ซ่อนลูกศรในลำดับที่ 2 และ 4 บน Mobile เพื่อความสวยงาม */
	.step-item:nth-child(odd)::after {
		content: "→";
		position: absolute;
		top: 35px;
		right: -10px;
		color: rgba(201, 160, 99, 0.5);
		font-size: 20px;
	}
}