/* ==========================================================
   VISIONDECOR
   QUOTATION FORM
========================================================== */

.vd-quote-form-section{
	padding:120px 0;
	background:#f8f7f3;
}

.vd-quote-grid{
	display:grid;
	grid-template-columns:460px 1fr;
	gap:70px;
	align-items:start;
}


/*==========================================================
LEFT COLUMN
==========================================================*/

.vd-quote-information{

	position:sticky;
	top:120px;

}

.vd-quote-information h2{

	margin:18px 0 24px;

	font-size:clamp(42px,5vw,62px);

	line-height:1.08;

	letter-spacing:-2px;

	font-weight:700;

	color:#071a3d;

}

.vd-quote-description{

	margin-bottom:40px;

	font-size:17px;

	line-height:1.9;

	color:#667085;

}

.vd-quote-benefits{

	list-style:none;

	padding:0;

	margin:0;

}

.vd-quote-benefits li{

	display:flex;

	align-items:center;

	gap:14px;

	padding:18px 0;

	border-bottom:1px solid rgba(7,26,61,.08);

	font-size:16px;

	font-weight:500;

	color:#071a3d;

}

.vd-quote-benefits li span{

	display:flex;

	align-items:center;

	justify-content:center;

	width:34px;

	height:34px;

	border-radius:50%;

	background:#071a3d;

	color:#d5aa32;

	font-size:14px;

	font-weight:700;

	flex-shrink:0;

}


/*==========================================================
FORM CARD
==========================================================*/

.vd-quote-card{

	padding:50px;

	background:#ffffff;

	border-radius:24px;

	border:1px solid rgba(7,26,61,.08);

	box-shadow:0 25px 60px rgba(7,26,61,.08);

}

.vd-quote-form{

	display:flex;

	flex-direction:column;

	gap:26px;

}


/*==========================================================
FORM ELEMENTS
==========================================================*/

.vd-form-group{

	display:flex;

	flex-direction:column;

	gap:10px;

}

.vd-form-group label{

	font-size:15px;

	font-weight:600;

	color:#071a3d;

}

.vd-form-group label small{

	font-weight:400;

	color:#8d98a8;

}

.vd-quote-form input[type=text],
.vd-quote-form input[mailto],
.vd-quote-form input[type=tel],
.vd-quote-form select,
.vd-quote-form textarea{

	width:100%;

	padding:18px 20px;

	border:1px solid #d9dfe7;

	border-radius:14px;

	background:#fff;

	font-family:inherit;

	font-size:15px;

	color:#071a3d;

	outline:none;

	transition:all .25s ease;

	box-sizing:border-box;

}

.vd-quote-form textarea{

	min-height:180px;

	resize:vertical;

}

.vd-quote-form input::placeholder,
.vd-quote-form textarea::placeholder{

	color:#a6b0bd;

}

.vd-quote-form input:hover,
.vd-quote-form textarea:hover,
.vd-quote-form select:hover{

	border-color:#d5aa32;

}

.vd-quote-form input:focus,
.vd-quote-form textarea:focus,
.vd-quote-form select:focus{

	border-color:#071a3d;

	box-shadow:0 0 0 4px rgba(7,26,61,.08);

}


/*==========================================================
BUDGET CARDS
==========================================================*/

.vd-budget-grid{

	display:grid;

	grid-template-columns:repeat(2,1fr);

	gap:16px;

	margin-top:4px;

}

.vd-budget-card{

	position:relative;

	cursor:pointer;

}

.vd-budget-card input{

	position:absolute;

	opacity:0;

	pointer-events:none;

}

.vd-budget-card span{

	display:flex;

	align-items:center;

	justify-content:center;

	min-height:74px;

	padding:18px;

	text-align:center;

	border:1px solid #d9dfe7;

	border-radius:16px;

	background:#ffffff;

	font-size:15px;

	font-weight:600;

	color:#071a3d;

	transition:all .25s ease;

}

.vd-budget-card:hover span{

	border-color:#d5aa32;

	transform:translateY(-3px);

	box-shadow:0 18px 35px rgba(7,26,61,.06);

}

.vd-budget-card input:checked + span{

	background:#071a3d;

	color:#ffffff;

	border-color:#071a3d;

	box-shadow:0 20px 40px rgba(7,26,61,.16);

}


/*==========================================================
BUTTON
==========================================================*/

.vd-quote-submit{

	width:100%;

	margin-top:10px;

	padding:20px;

	font-size:16px;

	font-weight:600;

	cursor:pointer;

}


/*==========================================================
NOTE
==========================================================*/

.vd-form-note{

	margin:0;

	text-align:center;

	font-size:13px;

	line-height:1.8;

	color:#7b8695;

}


/*==========================================================
HONEYPOT
==========================================================*/

.vd-hidden-field{

	display:none !important;

}


/*==========================================================
TABLET
==========================================================*/

@media(max-width:992px){

	.vd-quote-grid{

		grid-template-columns:1fr;

		gap:50px;

	}

	.vd-quote-information{

		position:static;

	}

}


/*==========================================================
MOBILE
==========================================================*/

@media(max-width:768px){

	.vd-quote-form-section{

		padding:80px 0;

	}

	.vd-quote-card{

		padding:28px;

		border-radius:18px;

	}

	.vd-quote-information h2{

		font-size:42px;

		letter-spacing:-1px;

	}

	.vd-quote-description{

		font-size:16px;

	}

	.vd-budget-grid{

		grid-template-columns:1fr;

	}

	.vd-budget-card span{

		min-height:64px;

	}

}

/*==========================================================
FORM MESSAGES
==========================================================*/

.vd-form-message{

	text-align:center;

	padding:70px 40px;

}

.vd-message-icon{

	display:flex;

	align-items:center;

	justify-content:center;

	width:90px;

	height:90px;

	margin:0 auto 30px;

	border-radius:50%;

	font-size:42px;

	font-weight:700;

}

.vd-form-success .vd-message-icon{

	background:#071a3d;

	color:#d5aa32;

}

.vd-form-error .vd-message-icon{

	background:#fff2f2;

	color:#c62828;

}

.vd-form-message h3{

	margin-bottom:20px;

	font-size:36px;

	color:#071a3d;

}

.vd-form-message p{

	max-width:500px;

	margin:0 auto 18px;

	line-height:1.8;

	color:#667085;

}

.vd-form-message .vd-button{

	margin-top:30px;

}