/* ==========================================================================
   SINGLE DEPARTMENT PAGE
   COMPLETE PREMIUM STYLING
   ========================================================================== */

.single-department {
	--dept-blue: #145cf5;
	--dept-blue-light: #4a8cff;
	--dept-blue-soft: #edf4ff;
	--dept-navy: #061f5b;
	--dept-navy-soft: #133a7c;
	--dept-text: #52658d;
	--dept-muted: #7886a4;
	--dept-border: #e2e9f6;
	--dept-page: #f7f9ff;
	--dept-white: #ffffff;
}


/* ==========================================================================
   PAGE
   ========================================================================== */

.single-department .site-main {
	width: 100%;
	margin: 0;
	padding: 0;

	background:
		linear-gradient(
			180deg,
			#f6f8ff 0%,
			#fbfcff 38%,
			#ffffff 100%
		);
}


/* ==========================================================================
   FULL WIDTH HERO
   ========================================================================== */

.ph-department-hero {
	position: relative;

	width: 100%;
	min-height: 500px;

	margin: 0;
	padding: 0;

	overflow: hidden;

	background:
		linear-gradient(
			112deg,
			#03194e 0%,
			#06296f 33%,
			#0c48ba 63%,
			#1b70f6 100%
		);

	isolation: isolate;
}


/* ==========================================================================
   HERO IMAGE
   ========================================================================== */

.ph-department-hero__media {
	position: absolute;

	top: 0;
	right: 0;
	bottom: 0;

	z-index: 1;

	width: 61%;

	overflow: hidden;
}


.ph-department-hero__media::before {
	position: absolute;

	inset: 0;

	z-index: 2;

	content: "";

	background:
		linear-gradient(
			90deg,
			#0b3d9a 0%,
			rgba(11, 61, 154, 0.94) 8%,
			rgba(10, 61, 158, 0.68) 18%,
			rgba(9, 65, 166, 0.38) 30%,
			rgba(9, 65, 166, 0.11) 45%,
			transparent 68%
		);

	pointer-events: none;
}


.ph-department-hero__media::after {
	position: absolute;

	inset: 0;

	z-index: 3;

	content: "";

	background:
		linear-gradient(
			180deg,
			rgba(1, 17, 59, 0.02),
			rgba(1, 17, 59, 0.14)
		);

	pointer-events: none;
}


.ph-department-hero__media img {
	display: block;

	width: 100%;
	height: 100%;

	object-fit: cover;
	object-position: center center;

	transform: scale(1.03);

	transition:
		transform 1.3s cubic-bezier(0.22, 1, 0.36, 1);
}


.ph-department-hero:hover
.ph-department-hero__media img {
	transform: scale(1.055);
}


/* ==========================================================================
   HERO SHADE
   ========================================================================== */

.ph-department-hero__shade {
	position: absolute;

	inset: 0;

	z-index: 2;

	background:
		linear-gradient(
			90deg,
			rgba(2, 16, 57, 0.28) 0%,
			rgba(3, 27, 83, 0.11) 45%,
			transparent 76%
		);

	pointer-events: none;
}


/* ==========================================================================
   HERO DECORATION
   ========================================================================== */

.ph-department-hero__orb {
	position: absolute;

	z-index: 2;

	border:
		1px solid rgba(255, 255, 255, 0.11);

	border-radius: 50%;

	pointer-events: none;
}


.ph-department-hero__orb--one {
	top: -390px;
	left: 35%;

	width: 780px;
	height: 780px;
}


.ph-department-hero__orb--two {
	right: -240px;
	bottom: -380px;

	width: 650px;
	height: 650px;
}


/* ==========================================================================
   HERO CONTENT CONTAINER
   ALIGNED WITH HEADER
   ========================================================================== */

.ph-department-hero__container {
	position: relative;

	z-index: 5;

	display: flex;
	align-items: center;

	width: calc(100% - 200px);
	max-width: 1600px;

	min-height: 500px;

	margin-inline: auto;

	padding:
		145px
		0
		46px;

	box-sizing: border-box;
}


/* ==========================================================================
   HERO CONTENT
   ========================================================================== */

.ph-department-hero__content {
	width: 57%;
	max-width: 820px;

	margin: 0;
	padding: 0;
}


/* ==========================================================================
   EYEBROW
   ========================================================================== */

.ph-department-hero__eyebrow {
	display: inline-flex;
	align-items: center;

	gap: 10px;

	margin:
		0
		0
		24px;

	padding:
		8px
		14px;

	border:
		1px solid rgba(255, 255, 255, 0.18);

	border-radius: 999px;

	background:
		rgba(255, 255, 255, 0.08);

	backdrop-filter: blur(9px);

	color:
		rgba(255, 255, 255, 0.92);

	font-size: 11px;
	font-weight: 700;
	line-height: 1;

	letter-spacing: 0.11em;

	text-transform: uppercase;
}


.ph-department-hero__eyebrow-dot {
	width: 8px;
	height: 8px;

	flex: 0 0 8px;

	border-radius: 50%;

	background: #ffffff;

	box-shadow:
		0
		0
		0
		5px
		rgba(255, 255, 255, 0.10);
}


/* ==========================================================================
   HERO TITLE
   ========================================================================== */

.ph-department-hero__title {
	margin: 0;

	max-width: 820px;

	color: #ffffff;

	font-size:
		clamp(
			50px,
			4.7vw,
			76px
		);

	font-weight: 760;
	line-height: 1;

	letter-spacing: -2.8px;

	text-wrap: balance;

	text-shadow:
		0
		7px
		22px
		rgba(0, 13, 55, 0.15);
}


/* ==========================================================================
   BREADCRUMB
   ========================================================================== */

.ph-department-hero__breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;

	gap: 10px;

	margin:
		32px
		0
		0;

	padding: 0;

	color:
		rgba(255, 255, 255, 0.80);

	font-size: 14px;
	font-weight: 550;
	line-height: 1.4;
}


.ph-department-hero__breadcrumb a {
	display: inline-flex;
	align-items: center;

	gap: 7px;

	color:
		rgba(255, 255, 255, 0.88);

	text-decoration: none;

	transition:
		color 0.25s ease,
		opacity 0.25s ease;
}


.ph-department-hero__breadcrumb a:hover {
	color: #ffffff;
}


.ph-department-hero__breadcrumb-home svg {
	width: 18px;
	height: 18px;

	fill: none;

	stroke: currentColor;

	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.ph-department-hero__breadcrumb-arrow {
	display: grid;

	width: 18px;
	height: 18px;

	place-items: center;

	color:
		rgba(255, 255, 255, 0.42);
}


.ph-department-hero__breadcrumb-arrow svg {
	width: 13px;
	height: 13px;

	fill: none;

	stroke: currentColor;

	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.ph-department-hero__breadcrumb-current {
	color: #ffffff;

	font-weight: 650;
}


/* ==========================================================================
   HERO BOTTOM ACCENT
   ========================================================================== */

.ph-department-hero__bottom-line {
	position: absolute;

	right: 0;
	bottom: 0;
	left: 0;

	z-index: 6;

	height: 3px;

	background:
		linear-gradient(
			90deg,
			transparent,
			rgba(104, 170, 255, 0.85) 45%,
			transparent
		);
}


/* ==========================================================================
   MAIN LAYOUT
   ========================================================================== */

.ph-department-layout {
	position: relative;

	width: 100%;

	padding:
		52px
		0
		72px;

	background:
		linear-gradient(
			180deg,
			#f5f8ff 0%,
			#fbfcff 270px,
			#ffffff 100%
		);
}


/* ==========================================================================
   MAIN INNER CONTAINER
   ========================================================================== */

.ph-department-layout__container {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr)
		340px;

	align-items: start;

	gap: 34px;

	width: calc(100% - 200px);
	max-width: 1600px;

	margin-inline: auto;
}


/* ==========================================================================
   CONTENT CARD
   ========================================================================== */

.ph-department-content {
	position: relative;

	min-width: 0;

	overflow: hidden;

	border:
		1px solid rgba(223, 231, 246, 0.94);

	border-radius: 28px;

	background: #ffffff;

	box-shadow:
		0
		18px
		55px
		rgba(31, 56, 112, 0.065);
}


.ph-department-content::before {
	position: absolute;

	top: 0;
	left: 0;

	width: 100%;
	height: 4px;

	content: "";

	background:
		linear-gradient(
			90deg,
			#0f59f4,
			#68a5ff 38%,
			transparent 77%
		);
}


.ph-department-content__inner {
	padding:
		46px
		54px
		58px;
}


/* ==========================================================================
   CONTENT TYPOGRAPHY
   ========================================================================== */

.ph-department-content__inner > :first-child {
	margin-top: 0 !important;
}


.ph-department-content h1 {
	margin:
		0
		0
		21px;

	color: var(--dept-navy);

	font-size:
		clamp(
			33px,
			3vw,
			45px
		);

	font-weight: 760;
	line-height: 1.13;

	letter-spacing: -1.2px;
}


.ph-department-content h2 {
	position: relative;

	margin:
		37px
		0
		15px;

	padding-bottom: 11px;

	color: var(--dept-navy);

	font-size:
		clamp(
			25px,
			2.2vw,
			33px
		);

	font-weight: 750;
	line-height: 1.2;

	letter-spacing: -0.65px;
}


.ph-department-content h2::after {
	position: absolute;

	left: 0;
	bottom: 0;

	width: 46px;
	height: 3px;

	border-radius: 999px;

	background:
		linear-gradient(
			90deg,
			#125cf5,
			#68a5ff
		);

	content: "";
}


.ph-department-content h3 {
	margin:
		27px
		0
		10px;

	color: #103674;

	font-size: 21px;
	font-weight: 720;
	line-height: 1.28;
}


.ph-department-content h4 {
	margin:
		21px
		0
		8px;

	color: #163a78;

	font-size: 17px;
	font-weight: 700;
}


.ph-department-content p {
	margin:
		0
		0
		17px;

	color: var(--dept-text);

	font-size: 16px;
	line-height: 1.72;
}


.ph-department-content strong {
	color: #153770;

	font-weight: 700;
}


/* ==========================================================================
   CONTENT LINKS
   ========================================================================== */

.ph-department-content a {
	color: var(--dept-blue);

	text-underline-offset: 3px;
}


/* ==========================================================================
   CONTENT LISTS
   ========================================================================== */

.ph-department-content ul,
.ph-department-content ol {
	margin:
		12px
		0
		24px;

	padding: 0;

	list-style: none;
}


.ph-department-content li {
	position: relative;

	margin-bottom: 9px;

	padding-left: 26px;

	color: var(--dept-text);

	font-size: 16px;
	line-height: 1.62;
}


.ph-department-content ul li::before {
	position: absolute;

	top: 0.65em;
	left: 5px;

	width: 7px;
	height: 7px;

	border-radius: 50%;

	background: var(--dept-blue);

	box-shadow:
		0
		0
		0
		4px
		rgba(20, 92, 245, 0.08);

	content: "";
}


.ph-department-content ol {
	counter-reset: department-counter;
}


.ph-department-content ol li {
	counter-increment: department-counter;

	padding-left: 38px;
}


.ph-department-content ol li::before {
	position: absolute;

	top: 0;
	left: 0;

	display: grid;

	width: 27px;
	height: 27px;

	place-items: center;

	border-radius: 50%;

	background: #edf3ff;

	color: var(--dept-blue);

	font-size: 11px;
	font-weight: 700;

	content:
		counter(department-counter);
}


/* ==========================================================================
   CONTENT IMAGES
   ========================================================================== */

.ph-department-content img {
	display: block;

	max-width: 100%;
	height: auto;

	margin:
		28px
		0
		34px;

	border-radius: 18px;

	box-shadow:
		0
		14px
		34px
		rgba(24, 52, 111, 0.09);
}


/* ==========================================================================
   TABLE
   ========================================================================== */

.ph-department-content table {
	width: 100%;

	margin:
		26px
		0
		32px;

	border-collapse: separate;
	border-spacing: 0;

	border:
		1px solid var(--dept-border);

	border-radius: 16px;

	overflow: hidden;

	background: #ffffff;
}


.ph-department-content th,
.ph-department-content td {
	padding:
		14px
		16px;

	border-right:
		1px solid var(--dept-border);

	border-bottom:
		1px solid var(--dept-border);

	color: var(--dept-text);

	font-size: 14px;
	line-height: 1.5;

	text-align: left;

	vertical-align: top;
}


.ph-department-content th {
	background: #f3f6ff;

	color: var(--dept-navy);

	font-weight: 700;
}


.ph-department-content tr:last-child td {
	border-bottom: 0;
}


.ph-department-content th:last-child,
.ph-department-content td:last-child {
	border-right: 0;
}


/* ==========================================================================
   BLOCKQUOTE
   ========================================================================== */

.ph-department-content blockquote {
	position: relative;

	margin:
		30px
		0;

	padding:
		23px
		28px
		23px
		34px;

	border: 0;

	border-radius: 17px;

	background:
		linear-gradient(
			120deg,
			#f0f5ff,
			#f8faff
		);

	color: #18366e;
}


.ph-department-content blockquote::before {
	position: absolute;

	top: 17px;
	bottom: 17px;
	left: 0;

	width: 4px;

	border-radius:
		0
		4px
		4px
		0;

	background: var(--dept-blue);

	content: "";
}


/* ==========================================================================
   SIDEBAR
   ========================================================================== */

.ph-department-sidebar {
	position: sticky;

	top: 125px;

	display: flex;
	flex-direction: column;

	gap: 22px;

	min-width: 0;
}


/* ==========================================================================
   SERVICES CARD
   ========================================================================== */

.ph-department-services-card {
	position: relative;

	padding:
		25px
		22px
		23px;

	overflow: hidden;

	border:
		1px solid rgba(218, 227, 244, 0.95);

	border-radius: 25px;

	background:
		linear-gradient(
			145deg,
			#ffffff 0%,
			#fafcff 100%
		);

	box-shadow:
		0
		18px
		45px
		rgba(27, 53, 110, 0.075);
}


.ph-department-services-card::before {
	position: absolute;

	top: -65px;
	right: -70px;

	width: 180px;
	height: 180px;

	border-radius: 50%;

	background:
		radial-gradient(
			circle,
			rgba(32, 104, 248, 0.09),
			transparent 70%
		);

	content: "";

	pointer-events: none;
}


/* ==========================================================================
   SERVICES HEADER
   ========================================================================== */

.ph-department-services-card__header {
	position: relative;

	z-index: 2;

	display: flex;
	align-items: center;

	gap: 13px;
}


.ph-department-services-card__icon {
	display: grid;

	width: 45px;
	height: 45px;

	flex: 0 0 45px;

	place-items: center;

	border-radius: 13px;

	background:
		linear-gradient(
			145deg,
			#e8f0ff,
			#f7f9ff
		);

	box-shadow:
		inset
		0
		0
		0
		1px
		rgba(20, 92, 245, 0.06);

	color: var(--dept-blue);
}


.ph-department-services-card__icon svg {
	width: 22px;
	height: 22px;

	fill: none;
	stroke: currentColor;

	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}


.ph-department-services-card__heading span {
	display: block;

	margin-bottom: 2px;

	color: #7890bd;

	font-size: 9px;
	font-weight: 750;

	letter-spacing: 0.14em;

	text-transform: uppercase;
}


.ph-department-services-card__heading h2 {
	margin: 0;

	color: var(--dept-navy);

	font-size: 21px;
	font-weight: 760;
	line-height: 1.1;
}


.ph-department-services-card__divider {
	width: 100%;
	height: 1px;

	margin:
		19px
		0
		16px;

	background:
		linear-gradient(
			90deg,
			#dce5f5,
			transparent
		);
}


/* ==========================================================================
   SERVICES LIST
   ========================================================================== */

.ph-department-services-list {
	display: flex;
	flex-direction: column;

	gap: 8px;
}


/* ==========================================================================
   SERVICE ITEM
   ========================================================================== */

.ph-department-service-link {
	position: relative;

	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 12px;

	min-height: 56px;

	padding:
		9px
		10px
		9px
		14px;

	overflow: hidden;

	border:
		1px solid #e2e8f4;

	border-radius: 13px;

	background: #ffffff;

	color: #18366f;

	font-size: 13px;
	font-weight: 650;
	line-height: 1.25;

	text-decoration: none;

	box-sizing: border-box;

	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		color 0.3s ease,
		background 0.3s ease;
}


.ph-department-service-link__content {
	display: flex;
	align-items: center;

	gap: 10px;

	min-width: 0;
}


.ph-department-service-link__dot {
	width: 7px;
	height: 7px;

	flex: 0 0 7px;

	border-radius: 50%;

	background: #bfd0f4;

	transition:
		background 0.3s ease,
		box-shadow 0.3s ease;
}


.ph-department-service-link__label {
	min-width: 0;
}


/* ==========================================================================
   SERVICE ARROW
   ========================================================================== */

.ph-department-service-link__arrow {
	display: grid;

	width: 32px;
	height: 32px;

	flex: 0 0 32px;

	place-items: center;

	border-radius: 10px;

	background: #f2f6ff;

	color: #2252a9;

	transition:
		transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
		background 0.3s ease,
		color 0.3s ease;
}


.ph-department-service-link__arrow svg {
	width: 15px;
	height: 15px;

	fill: none;
	stroke: currentColor;

	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}


/* ==========================================================================
   CURRENT SERVICE
   ========================================================================== */

.ph-department-service-link.is-current {
	border-color: transparent;

	background:
		linear-gradient(
			105deg,
			#1059f3,
			#2474ff
		);

	color: #ffffff;

	box-shadow:
		0
		11px
		25px
		rgba(20, 92, 245, 0.22);
}


.ph-department-service-link.is-current::before {
	position: absolute;

	top: -45px;
	right: -38px;

	width: 115px;
	height: 115px;

	border-radius: 50%;

	background:
		rgba(255, 255, 255, 0.08);

	content: "";
}


.ph-department-service-link.is-current
.ph-department-service-link__dot {
	background: #ffffff;

	box-shadow:
		0
		0
		0
		4px
		rgba(255, 255, 255, 0.14);
}


.ph-department-service-link.is-current
.ph-department-service-link__arrow {
	background:
		rgba(255, 255, 255, 0.14);

	color: #ffffff;
}


/* ==========================================================================
   SERVICES HOVER
   ========================================================================== */

@media (hover: hover) and (pointer: fine) {

	.ph-department-service-link:not(.is-current):hover {
		border-color:
			rgba(20, 92, 245, 0.18);

		background: #f7faff;

		color: #0f52d8;

		transform:
			translateX(4px);

		box-shadow:
			0
			10px
			22px
			rgba(35, 65, 128, 0.075);
	}


	.ph-department-service-link:not(.is-current):hover
	.ph-department-service-link__dot {
		background: var(--dept-blue);

		box-shadow:
			0
			0
			0
			4px
			rgba(20, 92, 245, 0.09);
	}


	.ph-department-service-link:not(.is-current):hover
	.ph-department-service-link__arrow {
		background: var(--dept-blue);

		color: #ffffff;

		transform: translateX(2px);
	}


	.ph-department-service-link.is-current:hover {
		transform: translateY(-2px);

		box-shadow:
			0
			15px
			32px
			rgba(20, 92, 245, 0.26);
	}
}


/* ==========================================================================
   DOCTOR CARD
   ========================================================================== */

.ph-department-doctor {
	position: relative;

	padding: 14px;

	overflow: hidden;

	border:
		1px solid rgba(220, 228, 243, 0.95);

	border-radius: 24px;

	background: #ffffff;

	box-shadow:
		0
		16px
		42px
		rgba(26, 52, 110, 0.07);

	box-sizing: border-box;
}


.ph-department-doctor__image {
	position: relative;

	display: block;

	height: 310px;

	overflow: hidden;

	border-radius: 18px;

	background:
		linear-gradient(
			145deg,
			#edf2ff,
			#e6edff
		);
}


.ph-department-doctor__image::before {
	position: absolute;

	top: -95px;
	right: -85px;

	width: 240px;
	height: 240px;

	border:
		1px solid rgba(30, 97, 238, 0.10);

	border-radius: 50%;

	content: "";
}


.ph-department-doctor__image img {
	position: relative;

	z-index: 2;

	display: block;

	width: 100%;
	height: 100%;

	object-fit: contain;
	object-position: center bottom;

	transition:
		transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}


.ph-department-doctor:hover
.ph-department-doctor__image img {
	transform: scale(1.03);
}


.ph-department-doctor__content {
	padding:
		17px
		7px
		5px;
}


.ph-department-doctor__content h2 {
	margin:
		0
		0
		5px;

	font-size: 19px;
	font-weight: 760;
	line-height: 1.2;
}


.ph-department-doctor__content h2 a {
	color: var(--dept-navy);

	text-decoration: none;
}


.ph-department-doctor__content p {
	margin: 0;

	color: var(--dept-muted);

	font-size: 12px;
	font-weight: 500;
	line-height: 1.45;
}


/* ==========================================================================
   DEPARTMENT SIDEBAR APPOINTMENT
   ========================================================================== */

.ph-department-sidebar-appointment {
	position: relative;

	display: block;

	width: 100%;
	height: auto;

	margin: 0;
	padding: 0;

	overflow: visible;

	border: 0;

	background: transparent;

	box-shadow: none;

	box-sizing: border-box;
}


/* ==========================================================================
   FORM CARD
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form-card {
	position: relative !important;

	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;

	display: block !important;

	width: 100% !important;
	max-width: none !important;

	height: auto !important;
	min-height: 0 !important;

	margin: 0 !important;

	padding:
		28px
		22px
		24px !important;

	overflow: visible !important;

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;

	border:
		1px solid #e1e8f5 !important;

	border-radius: 24px !important;

	background: #ffffff !important;

	box-shadow:
		0
		16px
		42px
		rgba(28, 55, 116, 0.08) !important;

	box-sizing: border-box !important;
}


/* ==========================================================================
   FORM BADGE
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form-card__badge {
	position: absolute !important;

	top: 18px !important;
	right: 18px !important;

	display: grid !important;

	width: 52px !important;
	height: 52px !important;

	place-items: center;

	margin: 0 !important;

	border-radius: 50% !important;

	background:
		linear-gradient(
			145deg,
			#0d4ac8,
			#1767f5
		) !important;

	box-shadow:
		0
		10px
		24px
		rgba(20, 92, 245, 0.18);

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;

	z-index: 4;
}


.ph-department-sidebar-appointment
.ph-appt-form-card__badge svg {
	width: 27px !important;
	height: 27px !important;

	fill: none;

	stroke: #ffffff;

	stroke-width: 1.7;
}


/* ==========================================================================
   FORM HEADER
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form-card__header {
	position: relative;

	display: block !important;

	width: 100%;

	margin:
		0
		0
		22px !important;

	padding:
		0
		58px
		0
		0 !important;

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;
}


.ph-department-sidebar-appointment
.ph-appt-kicker {
	display: flex !important;

	align-items: center;

	gap: 8px;

	margin:
		0
		0
		8px !important;

	color: #1761f5;

	font-size: 9px !important;

	font-weight: 750;

	line-height: 1;

	letter-spacing: 0.13em;

	text-transform: uppercase;

	opacity: 1 !important;

	visibility: visible !important;
}


.ph-department-sidebar-appointment
.ph-appt-kicker i {
	display: block;

	width: 28px;
	height: 2px;

	border-radius: 999px;

	background: #1761f5;
}


.ph-department-sidebar-appointment
.ph-appt-form-card__header h2 {
	display: block !important;

	margin: 0 !important;

	padding: 0 !important;

	color: #061f5b !important;

	font-size: 24px !important;

	font-weight: 750 !important;

	line-height: 1.1 !important;

	letter-spacing: -0.55px;

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;
}


/* ==========================================================================
   FORM
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form {
	position: relative !important;

	display: block !important;

	width: 100% !important;
	max-width: none !important;

	height: auto !important;

	margin: 0 !important;
	padding: 0 !important;

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;

	box-sizing: border-box;
}


/* ==========================================================================
   HONEYPOT
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-honeypot {
	position: absolute !important;

	left: -9999px !important;

	width: 1px !important;
	height: 1px !important;

	overflow: hidden !important;

	opacity: 0 !important;

	pointer-events: none !important;
}


/* ==========================================================================
   FORM GRIDS
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form__grid,
.ph-department-sidebar-appointment
.ph-appt-form__grid--three {
	display: grid !important;

	grid-template-columns: 1fr !important;

	gap: 10px !important;

	width: 100% !important;

	margin:
		0
		0
		10px !important;

	padding: 0 !important;
}


/* ==========================================================================
   FIELDS
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-field {
	position: relative !important;

	display: flex !important;

	align-items: center !important;

	width: 100% !important;
	max-width: none !important;

	min-height: 52px !important;

	margin: 0 !important;

	padding:
		0
		14px !important;

	overflow: hidden;

	border:
		1px solid #dfe7f5 !important;

	border-radius: 13px !important;

	background: #ffffff !important;

	box-shadow: none !important;

	opacity: 1 !important;

	visibility: visible !important;

	transform: none !important;

	box-sizing: border-box !important;

	transition:
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		background 0.25s ease;
}


.ph-department-sidebar-appointment
.ph-appt-field:focus-within {
	border-color:
		rgba(20, 92, 245, 0.55) !important;

	box-shadow:
		0
		0
		0
		3px
		rgba(20, 92, 245, 0.07) !important;

	background: #ffffff !important;
}


/* ==========================================================================
   FIELD ICONS
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-field > svg {
	display: block !important;

	width: 19px !important;
	height: 19px !important;

	flex: 0 0 19px !important;

	margin:
		0
		11px
		0
		0 !important;

	fill: none !important;

	stroke: #17428a !important;

	stroke-width: 1.7 !important;

	stroke-linecap: round;
	stroke-linejoin: round;

	opacity: 1 !important;

	visibility: visible !important;
}


/* ==========================================================================
   INPUTS + SELECT
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-field input,
.ph-department-sidebar-appointment
.ph-appt-field select {
	display: block !important;

	width: 100% !important;
	min-width: 0 !important;

	height: 50px !important;

	margin: 0 !important;
	padding: 0 !important;

	border: 0 !important;
	outline: 0 !important;

	background: transparent !important;

	box-shadow: none !important;

	color: #284575 !important;

	font-family: inherit !important;

	font-size: 12px !important;

	font-weight: 500;

	opacity: 1 !important;

	visibility: visible !important;

	box-sizing: border-box;
}


.ph-department-sidebar-appointment
.ph-appt-field input::placeholder {
	color: #7586a9 !important;

	opacity: 1 !important;
}


.ph-department-sidebar-appointment
.ph-appt-field select {
	cursor: pointer;
}


/* ==========================================================================
   MESSAGE
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-field--message {
	display: flex !important;

	align-items: flex-start !important;

	min-height: 112px !important;

	margin:
		0
		0
		12px !important;

	padding:
		14px !important;
}


.ph-department-sidebar-appointment
.ph-appt-field--message > svg {
	margin-top: 2px !important;
}


.ph-department-sidebar-appointment
.ph-appt-field--message textarea {
	display: block !important;

	width: 100% !important;

	min-height: 86px !important;

	margin: 0 !important;

	padding: 0 !important;

	border: 0 !important;

	outline: 0 !important;

	background: transparent !important;

	box-shadow: none !important;

	color: #284575 !important;

	font-family: inherit !important;

	font-size: 12px !important;

	line-height: 1.5;

	resize: vertical;

	opacity: 1 !important;

	visibility: visible !important;

	box-sizing: border-box;
}


.ph-department-sidebar-appointment
.ph-appt-field--message textarea::placeholder {
	color: #7586a9 !important;

	opacity: 1;
}


/* ==========================================================================
   FORM BOTTOM
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-form__bottom {
	display: block !important;

	width: 100% !important;

	margin: 0 !important;
	padding: 0 !important;

	opacity: 1 !important;

	visibility: visible !important;
}


/* ==========================================================================
   SUBMIT BUTTON
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-submit {
	display: flex !important;

	align-items: center !important;

	justify-content: center !important;

	gap: 10px !important;

	width: 100% !important;

	min-height: 52px !important;

	margin: 0 !important;

	padding:
		12px
		16px !important;

	border: 0 !important;

	border-radius: 13px !important;

	background:
		linear-gradient(
			90deg,
			#1059f3,
			#216eff
		) !important;

	box-shadow:
		0
		12px
		25px
		rgba(20, 92, 245, 0.20) !important;

	color: #ffffff !important;

	font-family: inherit !important;

	font-size: 12px !important;

	font-weight: 700 !important;

	cursor: pointer;

	opacity: 1 !important;

	visibility: visible !important;

	box-sizing: border-box;
}


.ph-department-sidebar-appointment
.ph-appt-submit svg {
	width: 17px !important;
	height: 17px !important;

	fill: none;

	stroke: currentColor;

	stroke-width: 1.8;

	stroke-linecap: round;
	stroke-linejoin: round;
}


.ph-department-sidebar-appointment
.ph-appt-submit:hover {
	transform:
		translateY(-2px) !important;

	box-shadow:
		0
		16px
		30px
		rgba(20, 92, 245, 0.26) !important;
}


/* ==========================================================================
   HIDE LARGE ABOUT-US DECORATION
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-priority {
	display: none !important;
}


/* ==========================================================================
   FORM RESPONSE
   ========================================================================== */

.ph-department-sidebar-appointment
.ph-appt-response {
	display: block;

	width: 100%;

	margin:
		12px
		0
		0;

	padding: 0;

	font-size: 12px;

	font-weight: 600;

	line-height: 1.45;

	box-sizing: border-box;
}


.ph-department-sidebar-appointment
.ph-appt-response.is-success {
	padding:
		10px
		12px;

	border:
		1px solid #bfe9d0;

	border-radius: 10px;

	background: #effbf4;

	color: #187443;
}


.ph-department-sidebar-appointment
.ph-appt-response.is-error {
	padding:
		10px
		12px;

	border:
		1px solid #f1c1c1;

	border-radius: 10px;

	background: #fff4f4;

	color: #c93030;
}


/* ==========================================================================
   FAQ
   ========================================================================== */

.ph-department-faq {
	position: relative;

	width: 100%;

	padding:
		0
		0
		72px;

	background: #ffffff;
}


.ph-department-faq__container {
	width: calc(100% - 200px);
	max-width: 1600px;

	margin-inline: auto;

	padding:
		42px
		48px
		48px;

	border:
		1px solid #e3e9f5;

	border-radius: 28px;

	background:
		linear-gradient(
			145deg,
			#ffffff,
			#f8faff
		);

	box-shadow:
		0
		16px
		45px
		rgba(26, 53, 112, 0.06);

	box-sizing: border-box;
}


.ph-department-faq__heading {
	margin-bottom: 27px;
}


.ph-department-faq__heading > span {
	display: block;

	margin-bottom: 8px;

	color: var(--dept-blue);

	font-size: 11px;
	font-weight: 750;

	letter-spacing: 0.12em;

	text-transform: uppercase;
}


.ph-department-faq__heading h2 {
	margin: 0;

	color: var(--dept-navy);

	font-size:
		clamp(
			32px,
			3vw,
			45px
		);

	font-weight: 760;
	line-height: 1.08;

	letter-spacing: -1px;
}


.ph-department-faq__grid {
	display: grid;

	grid-template-columns:
		repeat(
			2,
			minmax(0, 1fr)
		);

	gap: 12px;
}


.ph-department-faq__item {
	overflow: hidden;

	border:
		1px solid #e4e9f4;

	border-radius: 14px;

	background:
		linear-gradient(
			135deg,
			#fbfcff,
			#f4f7ff
		);

	transition:
		border-color 0.3s ease,
		box-shadow 0.3s ease,
		transform 0.3s ease;
}


.ph-department-faq__item:hover {
	transform: translateY(-2px);

	border-color:
		rgba(20, 92, 245, 0.18);

	box-shadow:
		0
		9px
		22px
		rgba(29, 56, 120, 0.06);
}


.ph-department-faq__item.is-open {
	border-color:
		rgba(20, 92, 245, 0.30);

	box-shadow:
		0
		11px
		26px
		rgba(29, 56, 120, 0.075);
}


.ph-department-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;

	gap: 18px;

	width: 100%;
	min-height: 58px;

	padding:
		14px
		17px;

	border: 0;

	background: transparent;

	color: var(--dept-navy);

	font-family: inherit;

	font-size: 14px;
	font-weight: 650;

	text-align: left;

	cursor: pointer;
}


.ph-department-faq__plus {
	display: grid;

	width: 28px;
	height: 28px;

	flex: 0 0 28px;

	place-items: center;

	border-radius: 50%;

	background: #ffffff;

	box-shadow:
		0
		4px
		12px
		rgba(34, 64, 130, 0.08);

	color: var(--dept-blue);

	font-size: 19px;

	transition:
		transform 0.3s ease,
		background 0.3s ease,
		color 0.3s ease;
}


.ph-department-faq__item.is-open
.ph-department-faq__plus {
	background: var(--dept-blue);

	color: #ffffff;

	transform: rotate(45deg);
}


.ph-department-faq__answer {
	display: grid;

	grid-template-rows: 0fr;

	transition:
		grid-template-rows
		0.4s
		cubic-bezier(0.22, 1, 0.36, 1);
}


.ph-department-faq__item.is-open
.ph-department-faq__answer {
	grid-template-rows: 1fr;
}


.ph-department-faq__answer-inner {
	min-height: 0;

	overflow: hidden;
}


.ph-department-faq__answer-inner p {
	margin:
		0
		17px
		18px;

	color: var(--dept-text);

	font-size: 14px;
	line-height: 1.65;
}


/* ==========================================================================
   ENTRANCE ANIMATION
   ========================================================================== */

.ph-department-reveal {
	opacity: 0;

	will-change:
		transform,
		opacity;

	transition:
		opacity
		0.85s
		ease,
		transform
		0.95s
		cubic-bezier(0.22, 1, 0.36, 1);
}


.ph-department-reveal[
	data-department-reveal="left"
] {
	transform:
		translate3d(
			-38px,
			20px,
			0
		);
}


.ph-department-reveal[
	data-department-reveal="right"
] {
	transform:
		translate3d(
			38px,
			20px,
			0
		);
}


.ph-department-reveal[
	data-department-reveal="up"
] {
	transform:
		translate3d(
			0,
			28px,
			0
		);
}


.ph-department-reveal.is-visible {
	opacity: 1;

	transform:
		translate3d(
			0,
			0,
			0
		);
}


/* ==========================================================================
   LARGE DESKTOP
   ========================================================================== */

@media (min-width: 1800px) {

	.ph-department-hero__container,
	.ph-department-layout__container,
	.ph-department-faq__container {
		width: calc(100% - 200px);
		max-width: 1600px;
	}
}


/* ==========================================================================
   LAPTOP
   ========================================================================== */

@media (max-width: 1440px) {

	.ph-department-hero {
		min-height: 470px;
	}


	.ph-department-hero__container {
		width: calc(100% - 150px);
		max-width: none;

		min-height: 470px;

		padding:
			135px
			0
			38px;
	}


	.ph-department-layout__container,
	.ph-department-faq__container {
		width: calc(100% - 150px);
		max-width: none;
	}


	.ph-department-layout__container {
		grid-template-columns:
			minmax(0, 1fr)
			315px;

		gap: 27px;
	}


	.ph-department-content__inner {
		padding:
			40px
			44px
			50px;
	}
}


/* ==========================================================================
   SHORT LAPTOP
   ========================================================================== */

@media
	(min-width: 1025px)
	and
	(max-height: 850px) {

	.ph-department-hero {
		min-height: 430px;
	}


	.ph-department-hero__container {
		min-height: 430px;

		padding:
			125px
			0
			32px;
	}


	.ph-department-hero__title {
		font-size:
			clamp(
				44px,
				4vw,
				62px
			);
	}


	.ph-department-layout {
		padding-top: 40px;
	}
}


/* ==========================================================================
   TABLET
   ========================================================================== */

@media (max-width: 1024px) {

	.ph-department-hero {
		min-height: 440px;
	}


	.ph-department-hero__container {
		width: calc(100% - 64px);

		min-height: 440px;

		padding:
			125px
			0
			35px;
	}


	.ph-department-hero__content {
		width: 72%;
	}


	.ph-department-hero__media {
		width: 67%;
	}


	.ph-department-layout__container {
		grid-template-columns: 1fr;

		width: calc(100% - 64px);
	}


	.ph-department-sidebar {
		position: static;

		display: grid;

		grid-template-columns:
			repeat(
				2,
				minmax(0, 1fr)
			);
	}


	.ph-department-doctor {
		grid-column:
			1
			/
			-1;
	}


	.ph-department-faq__container {
		width: calc(100% - 64px);
	}


	.ph-department-sidebar-appointment
	.ph-appt-form-card {
		padding:
			28px
			24px
			25px !important;
	}
}


/* ==========================================================================
   MOBILE
   ========================================================================== */

@media (max-width: 767px) {

	.ph-department-hero {
		min-height: 410px;
	}


	.ph-department-hero__container {
		width: calc(100% - 40px);

		min-height: 410px;

		padding:
			120px
			0
			32px;
	}


	.ph-department-hero__content {
		width: 100%;
		max-width: none;
	}


	.ph-department-hero__media {
		width: 100%;

		opacity: 0.42;
	}


	.ph-department-hero__media::before {
		background:
			linear-gradient(
				90deg,
				rgba(5, 31, 92, 0.83),
				rgba(5, 31, 92, 0.42)
			);
	}


	.ph-department-hero__shade {
		background:
			rgba(3, 24, 74, 0.42);
	}


	.ph-department-hero__eyebrow {
		margin-bottom: 19px;

		font-size: 9px;
	}


	.ph-department-hero__title {
		font-size: 42px;

		letter-spacing: -1.5px;
	}


	.ph-department-hero__breadcrumb {
		margin-top: 26px;

		gap: 7px;

		font-size: 12px;
	}


	.ph-department-layout {
		padding:
			30px
			0
			45px;
	}


	.ph-department-layout__container {
		width: calc(100% - 24px);
	}


	.ph-department-content {
		border-radius: 21px;
	}


	.ph-department-content__inner {
		padding:
			30px
			20px
			38px;
	}


	.ph-department-content h1 {
		font-size: 30px;
	}


	.ph-department-content h2 {
		font-size: 25px;
	}


	.ph-department-content h3 {
		font-size: 20px;
	}


	.ph-department-content p,
	.ph-department-content li {
		font-size: 15px;
	}


	.ph-department-content table {
		display: block;

		width: 100%;

		overflow-x: auto;

		-webkit-overflow-scrolling: touch;
	}


	.ph-department-sidebar {
		display: flex;

		flex-direction: column;
	}


	.ph-department-services-card,
	.ph-department-doctor {
		border-radius: 20px;
	}


	.ph-department-doctor__image {
		height: 340px;
	}


	.ph-department-sidebar-appointment
	.ph-appt-form-card {
		padding:
			25px
			18px
			20px !important;

		border-radius: 19px !important;
	}


	.ph-department-sidebar-appointment
	.ph-appt-form-card__header h2 {
		font-size: 23px !important;
	}


	.ph-department-faq {
		padding-bottom: 45px;
	}


	.ph-department-faq__container {
		width: calc(100% - 24px);

		padding:
			30px
			20px
			32px;

		border-radius: 21px;
	}


	.ph-department-faq__grid {
		grid-template-columns: 1fr;
	}
}


/* ==========================================================================
   SMALL MOBILE
   ========================================================================== */

@media (max-width: 480px) {

	.ph-department-hero__title {
		font-size: 37px;
	}


	.ph-department-hero__breadcrumb-current {
		max-width: 160px;

		overflow: hidden;

		text-overflow: ellipsis;

		white-space: nowrap;
	}


	.ph-department-content__inner {
		padding:
			27px
			17px
			34px;
	}


	.ph-department-faq__question {
		font-size: 13px;
	}
}


/* ==========================================================================
   REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	.ph-department-reveal {
		opacity: 1 !important;

		transform: none !important;

		transition: none !important;
	}


	.ph-department-hero__media img,
	.ph-department-doctor__image img,
	.ph-department-service-link {
		transition: none !important;
	}
}