/**
 * Contact Page.
 *
 * Premium compact contact section.
 *
 * @package DrSanhithaPurushotham
 */


/* ==================================================
   CONTACT SECTION
================================================== */

.contact-main {
	--contact-navy: #08213e;
	--contact-navy-dark: #061a31;

	--contact-text: #44536a;
	--contact-muted: #718095;

	--contact-teal: #008f98;
	--contact-teal-dark: #007b84;

	--contact-gold: #c9943b;
	--contact-gold-light: #e2bd73;

	--contact-cream: #fdf8f1;
	--contact-white: #ffffff;

	display: flex;

	width: 100%;

	min-height:
		calc(
			100svh - 108px
		);

	padding:
		60px
		0;

	align-items: center;

	background:
		linear-gradient(
			180deg,
			#ffffff 0%,
			#fdfbf7 100%
		);
}


/* ==================================================
   MAIN CONTAINER
================================================== */

.contact-main__container {
	display: grid;

	width:
		min(
			calc(100% - 80px),
			1360px
		);

	margin-inline: auto;

	grid-template-columns:
		minmax(0, 0.9fr)
		minmax(500px, 1.1fr);

	gap: 60px;

	align-items: center;
}


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

.contact-main__details {
	min-width: 0;
	padding-top: 0;
}


/* ==================================================
   EYEBROW
================================================== */

.contact-main__eyebrow {
	display: flex;

	margin-bottom: 10px;

	align-items: center;

	gap: 13px;
}


.contact-main__eyebrow > span {
	display: block;

	width: 42px;
	height: 1px;

	background:
		var(--contact-gold);
}


.contact-main__eyebrow p {
	margin: 0;

	color:
		var(--contact-teal-dark);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 10px;

	font-weight: 700;

	letter-spacing: 2.5px;

	text-transform: uppercase;
}


/* ==================================================
   MAIN TITLE
================================================== */

.contact-main__title {
	max-width: 590px;

	margin: 0;

	color:
		var(--contact-navy);

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size:
		clamp(
			38px,
			3.3vw,
			50px
		);

	font-weight: 700;

	line-height: 0.98;

	letter-spacing: -0.8px;
}


/* ==================================================
   INTRO
================================================== */

.contact-main__intro {
	max-width: 575px;

	margin:
		14px
		0
		0;

	color:
		var(--contact-text);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 13px;

	font-weight: 400;

	line-height: 1.6;
}


/* ==================================================
   DECORATIVE DIVIDER
================================================== */

.contact-main__ornament {
	display: flex;

	width: 190px;

	margin:
		18px
		0
		20px;

	align-items: center;

	gap: 8px;
}


.contact-main__ornament span {
	display: block;

	height: 1px;

	flex: 1;

	background:
		linear-gradient(
			to right,
			transparent,
			rgba(201, 148, 59, 0.75)
		);
}


.contact-main__ornament span:last-child {
	background:
		linear-gradient(
			to left,
			transparent,
			rgba(201, 148, 59, 0.75)
		);
}


.contact-main__ornament i {
	display: block;

	width: 7px;
	height: 7px;

	background:
		var(--contact-gold);

	transform:
		rotate(45deg);
}


/* ==================================================
   CONTACT INFO CARDS
================================================== */

.contact-info-card {
	display: grid;

	width: 100%;

	max-width: 590px;

	min-height: 70px;

	margin-bottom: 9px;

	padding:
		9px
		13px;

	grid-template-columns:
		46px
		minmax(0, 1fr)
		30px;

	gap: 12px;

	align-items: center;

	border:
		1px solid
		rgba(201, 148, 59, 0.20);

	border-radius: 11px;

	background:
		rgba(255, 255, 255, 0.84);

	color:
		var(--contact-navy);

	text-decoration: none;

	box-shadow:
		0
		7px
		22px
		rgba(22, 42, 58, 0.035);

	transition:
		transform 260ms ease,
		border-color 260ms ease,
		box-shadow 260ms ease,
		background-color 260ms ease;
}


/* ==================================================
   CONTACT CARD ICON
================================================== */

.contact-info-card__icon {
	display: flex;

	width: 43px;
	height: 43px;

	align-items: center;
	justify-content: center;

	border:
		1px solid
		rgba(201, 148, 59, 0.45);

	border-radius: 50%;

	background:
		linear-gradient(
			145deg,
			#092744,
			#061a31
		);

	color:
		#dcb365;
}


.contact-info-card__icon svg {
	width: 23px;
	height: 23px;
}


/* ==================================================
   CONTACT CARD CONTENT
================================================== */

.contact-info-card__content {
	display: block;

	min-width: 0;
}


.contact-info-card__content small {
	display: block;

	margin-bottom: 2px;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 9px;

	font-weight: 600;

	letter-spacing: 1.05px;

	text-transform: uppercase;
}


.contact-info-card__content strong {
	display: block;

	overflow-wrap: anywhere;

	color:
		var(--contact-navy);

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size: 17px;

	font-weight: 700;

	line-height: 1.2;
}


/* ==================================================
   CONTACT CARD ARROW
================================================== */

.contact-info-card__arrow {
	display: flex;

	width: 29px;
	height: 29px;

	align-items: center;
	justify-content: center;

	border:
		1px solid
		rgba(201, 148, 59, 0.52);

	border-radius: 50%;

	color:
		var(--contact-gold);

	transition:
		background-color 220ms ease,
		border-color 220ms ease,
		color 220ms ease,
		transform 220ms ease;
}


.contact-info-card__arrow svg {
	width: 14px;
	height: 14px;
}


@media (hover: hover) and (pointer: fine) {

	.contact-info-card:hover {
		border-color:
			rgba(0, 143, 152, 0.35);

		background:
			#ffffff;

		box-shadow:
			0
			11px
			27px
			rgba(17, 49, 65, 0.07);

		transform:
			translateY(-2px);
	}


	.contact-info-card:hover
	.contact-info-card__arrow {
		border-color:
			var(--contact-teal);

		background:
			var(--contact-teal);

		color:
			#ffffff;

		transform:
			translateX(2px);
	}
}


/* ==================================================
   CONSULTATION LOCATIONS
================================================== */

.contact-locations {
	max-width: 590px;

	margin-top: 15px;

	padding:
		15px
		18px;

	border:
		1px solid
		rgba(201, 148, 59, 0.22);

	border-radius: 13px;

	background:
		linear-gradient(
			145deg,
			#fffdf9,
			#faf4ea
		);
}


/* ==================================================
   LOCATIONS HEADER
================================================== */

.contact-locations__heading {
	display: flex;

	padding-bottom: 10px;

	align-items: center;

	gap: 11px;

	border-bottom:
		1px solid
		rgba(201, 148, 59, 0.18);
}


.contact-locations__heading-icon {
	display: flex;

	width: 36px;
	height: 36px;

	flex:
		0 0 36px;

	align-items: center;
	justify-content: center;

	border-radius: 50%;

	background:
		#e7f4f3;

	color:
		var(--contact-teal);
}


.contact-locations__heading-icon svg {
	width: 21px;
	height: 21px;
}


.contact-locations__heading small {
	display: block;

	margin-bottom: 2px;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 8px;

	font-weight: 700;

	letter-spacing: 1.15px;

	text-transform: uppercase;
}


.contact-locations__heading strong {
	color:
		var(--contact-navy);

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size: 17px;

	font-weight: 700;
}


/* ==================================================
   LOCATION LIST
================================================== */

.contact-locations ul {
	margin:
		8px
		0
		0;

	padding: 0;

	list-style: none;
}


.contact-locations li {
	display: grid;

	padding:
		5px
		0;

	grid-template-columns:
		10px
		minmax(0, 1fr);

	gap: 9px;

	align-items: start;
}


.contact-locations li > span {
	display: block;

	width: 6px;
	height: 6px;

	margin-top: 6px;

	background:
		var(--contact-gold);

	transform:
		rotate(45deg);
}


.contact-locations li strong {
	display: block;

	color:
		var(--contact-navy);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 11.5px;

	font-weight: 700;

	line-height: 1.3;
}


.contact-locations li p {
	margin:
		1px
		0
		0;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 10.5px;

	line-height: 1.35;
}


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

.contact-main__note {
	display: grid;

	max-width: 590px;

	margin-top: 12px;

	padding:
		9px
		13px;

	grid-template-columns:
		34px
		minmax(0, 1fr);

	gap: 10px;

	align-items: center;

	border-left:
		2px solid
		var(--contact-teal);

	background:
		#f5faf9;
}


.contact-main__note-icon {
	display: flex;

	width: 32px;
	height: 32px;

	align-items: center;
	justify-content: center;

	color:
		var(--contact-teal);
}


.contact-main__note-icon svg {
	width: 26px;
	height: 26px;
}


.contact-main__note strong {
	display: block;

	color:
		var(--contact-navy);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 11px;

	font-weight: 700;
}


.contact-main__note p {
	margin:
		2px
		0
		0;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 9.5px;

	line-height: 1.45;
}


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

.contact-form-card {
	position: relative;

	overflow: hidden;

	padding:
		30px
		35px
		32px;

	border:
		1px solid
		rgba(201, 148, 59, 0.31);

	border-radius: 21px;

	background:
		linear-gradient(
			145deg,
			#fffefa 0%,
			#fbf6ef 100%
		);

	box-shadow:
		0
		18px
		50px
		rgba(13, 31, 47, 0.09);
}


/* Gold top accent */

.contact-form-card::before {
	position: absolute;

	top: 0;
	right: 0;
	left: 0;

	height: 4px;

	background:
		linear-gradient(
			90deg,
			#af7a29,
			#e1bd72,
			#b8812e
		);

	content: "";
}


/* ==================================================
   FORM WATERMARK
================================================== */

.contact-form-card__watermark {
	position: absolute;

	top: 4px;
	right: 10px;

	width: 130px;
	height: 130px;

	color:
		rgba(0, 143, 152, 0.05);

	pointer-events: none;
}


.contact-form-card__watermark svg {
	width: 100%;
	height: 100%;
}


/* ==================================================
   FORM HEADER
================================================== */

.contact-form-card__header {
	position: relative;

	z-index: 3;

	max-width: 550px;

	margin-bottom: 19px;
}


.contact-form-card__eyebrow {
	display: block;

	margin-bottom: 5px;

	color:
		var(--contact-teal);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 9px;

	font-weight: 700;

	letter-spacing: 2px;

	text-transform: uppercase;
}


.contact-form-card__header h2 {
	margin: 0;

	color:
		var(--contact-navy);

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size:
		clamp(
			31px,
			2.5vw,
			39px
		);

	font-weight: 700;

	line-height: 1;
}


.contact-form-card__header p {
	max-width: 500px;

	margin:
		8px
		0
		0;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 11.5px;

	line-height: 1.5;
}


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

.contact-form {
	position: relative;

	z-index: 3;
}


/* ==================================================
   TWO COLUMN FORM ROW
================================================== */

.contact-form__grid {
	display: grid;

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

	gap: 13px;
}


/* ==================================================
   FIELD
================================================== */

.contact-form__field {
	margin-bottom: 12px;
}


.contact-form__field label {
	display: block;

	margin-bottom: 5px;

	color:
		var(--contact-navy);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 9px;

	font-weight: 700;

	letter-spacing: 0.55px;

	text-transform: uppercase;
}


.contact-form__field label span {
	color:
		var(--contact-gold);
}


/* ==================================================
   INPUT ICON WRAPPER
================================================== */

.contact-form__input {
	position: relative;
}


.contact-form__input > span {
	position: absolute;

	top: 50%;
	left: 13px;

	z-index: 3;

	display: flex;

	width: 20px;
	height: 20px;

	align-items: center;
	justify-content: center;

	color:
		var(--contact-teal);

	pointer-events: none;

	transform:
		translateY(-50%);
}


.contact-form__input > span svg {
	width: 18px;
	height: 18px;
}


/* ==================================================
   INPUTS
================================================== */

.contact-form input,
.contact-form select,
.contact-form textarea {
	display: block;

	width: 100%;

	border:
		1px solid
		#ccd5dc;

	border-radius: 9px;

	outline: none;

	background:
		rgba(255, 255, 255, 0.88);

	color:
		var(--contact-navy);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 12px;

	font-weight: 400;

	box-sizing: border-box;

	transition:
		border-color 220ms ease,
		box-shadow 220ms ease,
		background-color 220ms ease;
}


.contact-form input {
	height: 44px;

	padding:
		0
		14px;
}


.contact-form__input input {
	padding-left: 43px;
}


.contact-form textarea {
	min-height: 82px;

	padding:
		11px
		14px;

	resize: vertical;

	line-height: 1.5;
}


.contact-form input::placeholder,
.contact-form textarea::placeholder {
	color:
		#8995a3;

	opacity: 1;
}


.contact-form input:focus,
.contact-form select:focus,
.contact-form textarea:focus {
	border-color:
		var(--contact-teal);

	background:
		#ffffff;

	box-shadow:
		0
		0
		0
		4px
		rgba(0, 143, 152, 0.07);
}


/* ==================================================
   SELECT
================================================== */

.contact-form__select {
	position: relative;
}


.contact-form__select::after {
	position: absolute;

	top: 50%;
	right: 17px;

	width: 7px;
	height: 7px;

	border-right:
		2px solid
		var(--contact-navy);

	border-bottom:
		2px solid
		var(--contact-navy);

	content: "";

	pointer-events: none;

	transform:
		translateY(-70%)
		rotate(45deg);
}


.contact-form select {
	height: 44px;

	padding:
		0
		42px
		0
		14px;

	appearance: none;
	-webkit-appearance: none;
}


/* ==================================================
   PRIVACY MESSAGE
================================================== */

.contact-form__privacy {
	display: grid;

	margin-top: 1px;

	padding:
		9px
		12px;

	grid-template-columns:
		26px
		minmax(0, 1fr);

	gap: 8px;

	align-items: center;

	border:
		1px solid
		rgba(0, 143, 152, 0.17);

	border-radius: 8px;

	background:
		#f3f9f8;
}


.contact-form__privacy > span {
	display: flex;

	width: 24px;
	height: 24px;

	align-items: center;
	justify-content: center;

	color:
		var(--contact-teal);
}


.contact-form__privacy svg {
	width: 21px;
	height: 21px;
}


.contact-form__privacy p {
	margin: 0;

	color:
		var(--contact-muted);

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 9px;

	line-height: 1.45;
}


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

.contact-form__submit {
	display: flex;

	width: 100%;

	min-height: 49px;

	margin-top: 12px;

	padding:
		4px
		6px
		4px
		18px;

	align-items: center;
	justify-content: space-between;

	border:
		1px solid
		var(--contact-gold);

	border-radius: 9px;

	background:
		linear-gradient(
			135deg,
			#087d80 0%,
			#07566d 52%,
			#072b4c 100%
		);

	color: #ffffff;

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 12px;

	font-weight: 700;

	letter-spacing: 0.1px;

	cursor: pointer;

	box-shadow:
		0
		9px
		22px
		rgba(7, 43, 76, 0.14);

	transition:
		transform 220ms ease,
		box-shadow 220ms ease,
		background 220ms ease;
}


.contact-form__submit-arrow {
	display: flex;

	width: 37px;
	height: 37px;

	flex:
		0 0 37px;

	align-items: center;
	justify-content: center;

	border-radius: 50%;

	background:
		var(--contact-gold);

	color:
		#08213e;

	transition:
		transform 220ms ease,
		background-color 220ms ease,
		color 220ms ease;
}


.contact-form__submit-arrow svg {
	width: 17px;
	height: 17px;
}


@media (hover: hover) and (pointer: fine) {

	.contact-form__submit:hover {
		box-shadow:
			0
			13px
			28px
			rgba(7, 43, 76, 0.20);

		transform:
			translateY(-2px);
	}


	.contact-form__submit:hover
	.contact-form__submit-arrow {
		background:
			#ffffff;

		color:
			var(--contact-navy);

		transform:
			translateX(2px);
	}
}


/* ==================================================
   SUCCESS / ERROR MESSAGES
================================================== */

.contact-form-message {
	margin-bottom: 15px;

	padding:
		10px
		13px;

	border-radius: 8px;

	font-family:
		"Montserrat",
		Arial,
		sans-serif;

	font-size: 11px;

	line-height: 1.5;
}


.contact-form-message strong {
	margin-right: 4px;
}


.contact-form-message--success {
	border:
		1px solid
		rgba(0, 143, 152, 0.28);

	background:
		#edf8f6;

	color:
		#006d6c;
}


.contact-form-message--error {
	border:
		1px solid
		rgba(180, 62, 62, 0.25);

	background:
		#fff3f3;

	color:
		#a03333;
}


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

.contact-form__honeypot {
	position: absolute !important;

	left: -10000px !important;

	width: 1px !important;
	height: 1px !important;

	overflow: hidden !important;
}


/* ==================================================
   NORMAL DESKTOP
================================================== */

@media screen and (min-width: 1051px) {

	.contact-main__container {
		grid-template-columns:
			minmax(0, 0.9fr)
			minmax(500px, 1.1fr);
	}
}


/* ==================================================
   SHORT LAPTOP SCREENS
   e.g. 1366 × 768
================================================== */

@media screen and (min-width: 1051px) and (max-height: 800px) {

	.contact-main {
		min-height:
			calc(
				100svh - 108px
			);

		padding:
			50px
			0;
	}


	.contact-main__container {
		gap: 50px;
	}


	.contact-main__eyebrow {
		margin-bottom: 7px;
	}


	.contact-main__title {
		font-size:
			clamp(
				36px,
				3vw,
				44px
			);
	}


	.contact-main__intro {
		margin-top: 9px;

		font-size: 12px;

		line-height: 1.5;
	}


	.contact-main__ornament {
		margin:
			10px
			0
			12px;
	}


	.contact-info-card {
		min-height: 62px;

		margin-bottom: 7px;

		padding:
			7px
			11px;
	}


	.contact-info-card__icon {
		width: 39px;
		height: 39px;
	}


	.contact-info-card__content strong {
		font-size: 16px;
	}


	.contact-locations {
		margin-top: 9px;

		padding:
			11px
			15px;
	}


	.contact-locations__heading {
		padding-bottom: 7px;
	}


	.contact-locations ul {
		margin-top: 5px;
	}


	.contact-locations li {
		padding:
			3px
			0;
	}


	.contact-main__note {
		margin-top: 7px;

		padding:
			7px
			11px;
	}


	/* form */

	.contact-form-card {
		padding:
			23px
			30px
			24px;
	}


	.contact-form-card__header {
		margin-bottom: 13px;
	}


	.contact-form-card__header h2 {
		font-size: 31px;
	}


	.contact-form-card__header p {
		margin-top: 5px;

		font-size: 10.5px;
	}


	.contact-form__field {
		margin-bottom: 8px;
	}


	.contact-form input,
	.contact-form select {
		height: 40px;
	}


	.contact-form textarea {
		min-height: 62px;

		padding:
			9px
			12px;
	}


	.contact-form__privacy {
		padding:
			6px
			10px;
	}


	.contact-form__submit {
		min-height: 44px;

		margin-top: 8px;
	}


	.contact-form__submit-arrow {
		width: 33px;
		height: 33px;

		flex-basis: 33px;
	}
}


/* ==================================================
   VERY SHORT DESKTOP SCREENS
================================================== */

@media screen and (min-width: 1051px) and (max-height: 700px) {

	.contact-main {
		padding:
			50px
			0;
	}


	.contact-main__title {
		font-size: 36px;
	}


	.contact-main__intro {
		font-size: 11px;
	}


	.contact-main__ornament {
		margin:
			8px
			0
			10px;
	}


	.contact-locations {
		margin-top: 7px;
	}


	.contact-main__note {
		margin-top: 6px;
	}


	.contact-form-card {
		padding:
			19px
			27px
			20px;
	}


	.contact-form-card__header {
		margin-bottom: 10px;
	}


	.contact-form__field {
		margin-bottom: 6px;
	}


	.contact-form textarea {
		min-height: 55px;
	}


	.contact-form__privacy {
		padding:
			5px
			9px;
	}


	.contact-form__submit {
		margin-top: 6px;
	}
}


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

@media screen and (max-width: 1050px) {

	.contact-main {
		display: block;

		min-height: 0;

		padding:
			58px
			0
			68px;
	}


	.contact-main__container {
		width:
			calc(100% - 60px);

		grid-template-columns: 1fr;

		gap: 45px;

		align-items: start;
	}


	.contact-main__details {
		padding-top: 0;
	}


	.contact-main__title {
		font-size:
			clamp(
				38px,
				6vw,
				50px
			);
	}


	.contact-main__intro {
		font-size: 14px;
	}


	.contact-info-card,
	.contact-locations,
	.contact-main__note {
		max-width: none;
	}


	.contact-form-card {
		padding:
			38px
			38px
			40px;
	}


	.contact-form-card__header {
		margin-bottom: 24px;
	}


	.contact-form__field {
		margin-bottom: 15px;
	}


	.contact-form input,
	.contact-form select {
		height: 50px;
	}


	.contact-form textarea {
		min-height: 110px;
	}


	.contact-form__submit {
		min-height: 54px;
	}
}


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

@media screen and (max-width: 680px) {

	.contact-main {
		padding:
			40px
			0
			50px;
	}


	.contact-main__container {
		width:
			calc(100% - 30px);

		gap: 36px;
	}


	/* heading */

	.contact-main__eyebrow {
		margin-bottom: 10px;
	}


	.contact-main__title {
		font-size: 37px;

		line-height: 1;
	}


	.contact-main__intro {
		margin-top: 13px;

		font-size: 13px;

		line-height: 1.65;
	}


	.contact-main__ornament {
		margin:
			18px
			0
			20px;
	}


	/* contact cards */

	.contact-info-card {
		min-height: 74px;

		padding:
			10px;

		grid-template-columns:
			47px
			minmax(0, 1fr)
			29px;

		gap: 10px;

		border-radius: 11px;
	}


	.contact-info-card__icon {
		width: 44px;
		height: 44px;
	}


	.contact-info-card__icon svg {
		width: 23px;
		height: 23px;
	}


	.contact-info-card__content small {
		font-size: 8px;
	}


	.contact-info-card__content strong {
		font-size: 16px;
	}


	.contact-info-card__arrow {
		width: 28px;
		height: 28px;
	}


	/* locations */

	.contact-locations {
		margin-top: 16px;

		padding:
			18px
			16px;

		border-radius: 13px;
	}


	.contact-locations__heading {
		padding-bottom: 12px;
	}


	.contact-locations__heading-icon {
		width: 39px;
		height: 39px;

		flex-basis: 39px;
	}


	.contact-locations__heading strong {
		font-size: 18px;
	}


	.contact-locations ul {
		margin-top: 9px;
	}


	.contact-locations li {
		padding:
			6px
			0;
	}


	.contact-locations li strong {
		font-size: 12px;
	}


	.contact-locations li p {
		font-size: 11px;
	}


	/* note */

	.contact-main__note {
		margin-top: 14px;

		padding:
			11px
			12px;
	}


	/* form */

	.contact-form-card {
		padding:
			31px
			18px
			22px;

		border-radius: 19px;
	}


	.contact-form-card__watermark {
		width: 115px;
		height: 115px;
	}


	.contact-form-card__header {
		margin-bottom: 21px;
	}


	.contact-form-card__eyebrow {
		font-size: 9px;
	}


	.contact-form-card__header h2 {
		font-size: 34px;
	}


	.contact-form-card__header p {
		margin-top: 9px;

		font-size: 11px;

		line-height: 1.55;
	}


	/* one column form */

	.contact-form__grid {
		grid-template-columns: 1fr;

		gap: 0;
	}


	.contact-form__field {
		margin-bottom: 14px;
	}


	.contact-form input,
	.contact-form select {
		height: 49px;

		font-size: 12px;
	}


	.contact-form textarea {
		min-height: 110px;
	}


	.contact-form__privacy {
		padding:
			9px
			10px;
	}


	.contact-form__privacy p {
		font-size: 9px;
	}


	.contact-form__submit {
		min-height: 52px;

		margin-top: 12px;
	}


	.contact-form__submit-arrow {
		width: 39px;
		height: 39px;

		flex-basis: 39px;
	}
}


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

@media screen and (max-width: 390px) {

	.contact-main__container {
		width:
			calc(100% - 24px);
	}


	.contact-main__title {
		font-size: 34px;
	}


	.contact-info-card {
		grid-template-columns:
			43px
			minmax(0, 1fr)
			26px;

		gap: 8px;
	}


	.contact-info-card__icon {
		width: 40px;
		height: 40px;
	}


	.contact-info-card__content strong {
		font-size: 15px;
	}


	.contact-form-card {
		padding:
			28px
			15px
			19px;
	}


	.contact-form-card__header h2 {
		font-size: 31px;
	}
}


/* ==================================================
   ACCESSIBILITY
================================================== */

.contact-main a:focus-visible,
.contact-main button:focus-visible,
.contact-main input:focus-visible,
.contact-main select:focus-visible,
.contact-main textarea:focus-visible {
	outline:
		3px solid
		rgba(0, 143, 152, 0.30);

	outline-offset: 3px;
}


/* ==================================================
   REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce) {

	.contact-main *,
	.contact-main *::before,
	.contact-main *::after {
		scroll-behavior: auto !important;

		transition: none !important;
	}
}