/*
 * Frogtown refresh (theme v1.5, Setli Solutions).
 * Loaded from includes/head.php. Delete that one <link> line to switch the whole refresh off.
 */

:root {
	--ft-ease: cubic-bezier(.22, .61, .36, 1);
	--ft-speed: .28s;
	--ft-shadow: 0 14px 32px rgba(26, 26, 26, .10);
}

/* 1. Side breathing room: on laptops and tablets the content ran into the screen edges. */
@media only screen and (max-width: 1440px) {
	.wrapper {
		padding-left: clamp(14px, 2.4vw, 34px);
		padding-right: clamp(14px, 2.4vw, 34px);
	}
}

/* 2. Smoother, consistent hover feedback. */
.btn,
.btn::before,
.btn::after {
	transition: all var(--ft-speed) var(--ft-ease);
}
.btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(40, 169, 154, .28);
}
.btn:active {
	transform: translateY(0);
	box-shadow: none;
}

.btm1_boxes section,
.serv_list ul li {
	transition: transform var(--ft-speed) var(--ft-ease), box-shadow var(--ft-speed) var(--ft-ease);
	will-change: transform;
}
.btm1_boxes section:hover,
.serv_list ul li:hover {
	transform: translateY(-4px);
	box-shadow: var(--ft-shadow);
}
.btm1_boxes section figure,
.serv_list ul li figure {
	overflow: hidden;
}
.btm1_boxes section figure img,
.serv_list ul li figure img {
	transition: transform .6s var(--ft-ease);
}
.btm1_boxes section:hover figure img,
.serv_list ul li:hover figure img {
	transform: scale(1.04);
}

/* Visible keyboard focus. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible {
	outline: 3px solid var(--secondaryColor);
	outline-offset: 3px;
}

/* 3. Reviews: the section was forced to 875px tall, leaving a big empty band. */
.btm4_con {
	min-height: 0;
	padding: 90px 0 100px;
}
@media only screen and (max-width: 1010px) {
	.btm4_con {
		padding: 0;
	}
}

/* 4. Phones */
@media only screen and (max-width: 600px) {
	/* Hero text sits on the photo: give it a soft white backdrop so the green words are readable. */
	.bnr_info {
		background: linear-gradient(to top, rgba(255, 255, 255, .96) 0%, rgba(255, 255, 255, .9) 62%, rgba(255, 255, 255, 0) 100%);
		padding-top: 70px;
	}

	/* The opening-hours block was 376px wide and ran off a 375px screen. */
	.footer_hours {
		width: auto;
		left: 0;
		max-width: 100%;
	}

	/* Language switcher: a bit smaller so it doesn't crowd the hero photo. */
	.gtrans {
		transform: scale(.86);
		transform-origin: top right;
	}
}

/* Long email addresses and links wrap instead of being cut off. */
footer a,
.footer_content {
	overflow-wrap: anywhere;
}

/* 5. Respect "reduce motion": no fade-ins, no hover movement, no smooth-scroll easing. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
	.wow {
		visibility: visible !important;
		animation-name: none !important;
	}
	.btn:hover,
	.btm1_boxes section:hover,
	.serv_list ul li:hover {
		transform: none;
	}
}

/* ---------------------------------------------------------------
   6. Pill buttons: richer green (white text was hard to read on the
   old light green), deeper teal on hover, and a livelier arrow.
   --------------------------------------------------------------- */
:root {
	--gradient1: linear-gradient(180deg, #73b064 0%, #4f8a43 100%);
	--ft-pill-hover: #1d867a;
	--ft-spring: cubic-bezier(.34, 1.56, .64, 1);
}
.btn:hover {
	background: var(--ft-pill-hover);
}
q.btn3 {
	transition: transform .45s var(--ft-spring), box-shadow .3s ease;
}
.btn:hover q.btn3,
.btn:focus-visible q.btn3 {
	transform: translateY(-50%) translateX(4px) rotate(-45deg) scale(1.12);
	box-shadow: 0 0 0 5px rgba(255, 255, 255, .22);
}

/* The round arrow on the homepage service cards turns to point the way on hover. */
.btm1_boxes section a {
	transition: transform .45s var(--ft-spring), background .3s ease, box-shadow .3s ease;
}
.btm1_boxes section:hover a {
	transform: rotate(-45deg) scale(1.08);
	box-shadow: 0 6px 16px rgba(79, 138, 67, .35);
}

/* ---------------------------------------------------------------
   7. Desktop navigation: drop the black outline on the white text,
   animated underline, cleaner dropdown.
   --------------------------------------------------------------- */
@media only screen and (min-width: 1011px) {
	.page_nav ul li a {
		font-weight: 600;
		text-shadow: 0 1px 3px rgba(0, 0, 0, .55), 0 0 1px rgba(0, 0, 0, .35);
		position: relative;
	}
	.page_nav .nav-menu > ul > li > a::before {
		content: "";
		position: absolute;
		left: 14px;
		right: 14px;
		bottom: 14px;
		height: 2px;
		border-radius: 2px;
		background: currentColor;
		transform: scaleX(0);
		transform-origin: left center;
		transition: transform .3s var(--ft-ease);
	}
	.page_nav ul li a:hover,
	.page_nav ul li.current_page_item > a {
		text-decoration: none;
	}
	.page_nav .nav-menu > ul > li:hover > a::before,
	.page_nav .nav-menu > ul > li.current_page_item > a::before,
	.page_nav .nav-menu > ul > li.current-menu-ancestor > a::before,
	.page_nav .nav-menu > ul > li.current-menu-parent > a::before {
		transform: scaleX(1);
	}
	.page_nav ul li::after {
		opacity: .55;
	}
	.page_nav ul ul {
		border: 0;
		border-radius: 14px;
		padding: 8px 0;
		box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
		animation: ftDrop .22s var(--ft-ease);
	}
	.page_nav ul ul li a {
		padding: 0 46px 0 18px !important;
		line-height: 42px !important;
		text-align: left;
		transition: background-color .2s ease, color .2s ease;
	}
	.page_nav ul ul li a:hover,
	.page_nav ul ul li.current_page_item a {
		background: rgba(40, 169, 154, .09) !important;
		color: #1d7f73 !important;
		text-decoration: none !important;
	}
	.page_nav ul ul li::before {
		right: 12px;
	}
}
@keyframes ftDrop {
	from { opacity: 0; margin-top: 8px; }
	to { opacity: 1; margin-top: 0; }
}

/* ---------------------------------------------------------------
   8. Phone menu: readable dark text on the white drawer (it was
   white text with a black outline), left-aligned rows, no dashes.
   --------------------------------------------------------------- */
@media only screen and (max-width: 800px) {
	.page_nav ul {
		padding: 76px 18px 20px;
		text-align: left;
	}
	.page_nav ul li {
		margin: 0 !important;
		border-bottom: 1px solid #e7eeeb;
	}
	.page_nav ul li::after {
		display: none !important;
	}
	.page_nav ul li a,
	.page_nav ul ul li a {
		color: var(--bodyColor) !important;
		text-shadow: none !important;
		border: 0 !important;
		border-radius: 10px;
		text-align: left;
		font-weight: 600;
		line-height: 52px !important;
		padding: 0 46px 0 8px !important;
		background: none;
	}
	.page_nav ul li a:hover,
	.page_nav ul li.current_page_item > a {
		background: rgba(40, 169, 154, .09) !important;
		color: #1d7f73 !important;
		text-decoration: none !important;
	}
	.page_nav ul ul {
		margin: 0 0 8px !important;
		padding: 0 0 0 12px !important;
		border: 0 !important;
		box-shadow: none;
	}
	.page_nav ul ul li {
		border-bottom: 0;
	}
	.page_nav ul ul li::before {
		display: none;
	}
	.page_nav ul ul li a {
		font-weight: 400;
		font-size: 16px;
		line-height: 42px !important;
	}
	.page_nav ul li.menu-item-has-children > span {
		top: 14px !important;
		right: 4px !important;
		color: #1d7f73 !important;
	}
}

/* ---------------------------------------------------------------
   9. Language selector: a compact rounded pill instead of a box.
   --------------------------------------------------------------- */
.gtrans .gt_float_switcher {
	font-family: var(--priFont) !important;
	font-size: 14px !important;
	border-radius: 999px !important;
	background: rgba(255, 255, 255, .92) !important;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(40, 169, 154, .35) !important;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .14) !important;
	overflow: hidden;
	transition: border-radius .2s ease, box-shadow .2s ease;
}
.gtrans .gt_float_switcher:has(.gt_options.gt-open) {
	border-radius: 16px !important;
}
.gtrans .gt_float_switcher .gt-selected {
	background: transparent !important;
}
.gtrans .gt_float_switcher .gt-selected .gt-current-lang {
	display: flex !important;
	align-items: center;
	gap: 7px;
	padding: 7px 14px 7px 9px !important;
	color: var(--bodyColor) !important;
	font-weight: 600 !important;
}
.gtrans .gt_float_switcher img {
	width: 22px !important;
	height: 22px !important;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}
.gtrans .gt_float_switcher .gt-lang-code {
	text-transform: uppercase;
	letter-spacing: .04em;
}
.gtrans .gt_float_switcher .gt_options a {
	padding: 8px 14px !important;
	font-size: 14px !important;
	transition: background-color .2s ease, color .2s ease;
}
.gtrans .gt_float_switcher .gt_options a:hover {
	background: rgba(40, 169, 154, .1) !important;
	color: #1d7f73 !important;
}

/* ---------------------------------------------------------------
   10. Sticky call / book bar.
   --------------------------------------------------------------- */
.ft-cta {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 999;
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 6px;
	background: rgba(255, 255, 255, .96);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border-radius: 999px;
	box-shadow: 0 14px 36px rgba(10, 60, 55, .22);
	font-family: var(--priFont);
	opacity: 0;
	transform: translateY(24px);
	pointer-events: none;
	transition: opacity .35s var(--ft-ease), transform .35s var(--ft-ease);
}
.ft-cta.ft-cta--show {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}
.ft-cta a {
	text-decoration: none !important;
	display: flex;
	align-items: center;
	border-radius: 999px;
	transition: background-color .25s ease, color .25s ease, transform .25s var(--ft-ease);
}
.ft-cta__call {
	gap: 10px;
	padding: 6px 16px 6px 6px;
	color: var(--bodyColor);
	line-height: 1.15;
	font-weight: 700;
	font-size: 16px;
}
.ft-cta__call small {
	display: block;
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #5b6b67;
}
.ft-cta__icon {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	display: grid;
	place-items: center;
	background: var(--primaryColor);
	color: #fff;
}
.ft-cta__call:hover {
	background: rgba(40, 169, 154, .09);
}
.ft-cta__book {
	padding: 0 22px;
	height: 50px;
	background: var(--gradient1);
	color: #fff !important;
	font-weight: 600;
	font-size: 15px;
	white-space: nowrap;
}
.ft-cta__book:hover {
	background: var(--ft-pill-hover);
	transform: translateY(-1px);
}
/* Keep the cookie-settings button clear of the bar. */
.cky-btn-revisit-wrapper {
	bottom: 100px !important;
}

@media only screen and (max-width: 800px) {
	.ft-cta {
		left: 0;
		right: 0;
		bottom: 0;
		border-radius: 18px 18px 0 0;
		padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
		gap: 8px;
		box-shadow: 0 -8px 26px rgba(10, 60, 55, .16);
	}
	.ft-cta a {
		flex: 1;
		justify-content: center;
		height: 48px;
	}
	.ft-cta__call {
		padding: 0 12px;
		background: rgba(40, 169, 154, .1);
		font-size: 15px;
	}
	.ft-cta__call small {
		display: none;
	}
	.ft-cta__icon {
		width: 30px;
		height: 30px;
	}
	.ft-cta__book {
		padding: 0 12px;
		height: 48px;
		font-size: 15px;
	}
	body.ft-has-cta-bar {
		padding-bottom: 68px;
	}
	/* Lift the chat bubble and cookie button above the bar. */
	#tidio-chat-iframe {
		bottom: 66px !important;
	}
	.cky-btn-revisit-wrapper {
		bottom: 80px !important;
	}
}

/* ---------------------------------------------------------------
   11. About Us: Mission and Vision cards. Same cards, cleaner finish.
   --------------------------------------------------------------- */
.about_boxes section {
	border-radius: 22px;
	padding: 46px 42px 42px;
	box-shadow: 0 18px 40px rgba(8, 60, 54, .18);
	transition: transform var(--ft-speed) var(--ft-ease), box-shadow var(--ft-speed) var(--ft-ease);
}
.about_boxes section:hover {
	transform: translateY(-4px);
	box-shadow: 0 24px 48px rgba(8, 60, 54, .24);
}
.about_boxes section h2 {
	text-shadow: none;
	color: #1d7f73;
	font-weight: 400;
	line-height: 1.15;
	padding-bottom: 18px;
}
.about_boxes section h2 span {
	color: var(--bodyColor);
}
.about_boxes section h2::before {
	width: 56px;
	height: 3px;
	background: var(--secondaryColor);
}
.about_boxes section p {
	color: #3d4a47;
	line-height: 1.75;
}
.about_boxes section mark.comp {
	background: none;
	color: #1d7f73;
	font-weight: 700;
}
@media (prefers-reduced-motion: reduce) {
	.ft-cta,
	.about_boxes section:hover {
		transition: none;
		transform: none;
	}
}

/* ---------------------------------------------------------------
   12. Soften the hard 3px offset shadows on the "Reach Out to Us Now!"
   box (every inner page) and the About Us intro box.
   --------------------------------------------------------------- */
.cta,
.about_info {
	border-radius: 18px;
	box-shadow: 0 12px 32px rgba(8, 60, 54, .12);
	border: 1px solid rgba(40, 169, 154, .14);
}
.cta h2 {
	text-shadow: none;
}

/* Phone bar refinements: short "Call us" label, and lift the chat widget above the bar. */
@media only screen and (max-width: 800px) {
	.ft-cta__text {
		font-size: 0;
	}
	.ft-cta__call small {
		display: block !important;
		font-size: 15px;
		font-weight: 700;
		text-transform: none;
		letter-spacing: 0;
		color: var(--bodyColor);
	}
	.ft-cta__book {
		font-size: 14px;
	}
	body.ft-has-cta-bar #tidio-chat {
		bottom: 66px !important;
		height: calc(100% - 66px) !important;
	}
}
@media only screen and (max-width: 600px) {
	.footer_hours li,
	.footer_hours li * {
		white-space: nowrap;
	}
}
@media only screen and (max-width: 800px) {
	/* Long items like "Patient Education" wrap as one row, not two. */
	.page_nav ul li a {
		line-height: 1.3 !important;
		padding: 15px 46px 15px 8px !important;
	}
	.page_nav ul ul li a {
		line-height: 1.3 !important;
		padding: 10px 40px 10px 8px !important;
	}
}
/* Hide the call/book bar while the phone menu is open. */
body.active .ft-cta {
	opacity: 0 !important;
	pointer-events: none !important;
}
@media only screen and (max-width: 800px) {
	/* Menu titles like "24/7 Emergency <q>Assistance</q>" read as one line in the drawer. */
	.page_nav ul ul a q {
		display: inline;
		top: 0;
	}
	.page_nav ul ul a q::before {
		content: " ";
	}
}

/* ---------------------------------------------------------------
   13. Inner pages (service pages and others), desktop and tablet:
   a shorter banner so the content starts above the fold, a readable
   text column, and the bullet lists as tidy tiles.
   --------------------------------------------------------------- */
@media only screen and (min-width: 801px) {
	body:not(.front_page) .non_ban_img img {
		width: 100%;
		height: clamp(300px, 31.25vw, 600px);
		object-fit: cover;
		object-position: center 35%;
	}
}
body:not(.front_page) main {
	max-width: 1120px;
	margin-left: auto;
	margin-right: auto;
}
body:not(.front_page) .entry-content > p {
	font-size: 18px;
	line-height: 1.8;
	color: #2f3b38;
}
body:not(.front_page) .intro_txt {
	font-family: var(--secFont);
	font-size: clamp(22px, 2.2vw, 30px);
	line-height: 1.3;
	color: #1d7f73;
}
body:not(.front_page) .entry-content h2.nh {
	font-family: var(--secFont);
	font-size: clamp(24px, 2.2vw, 30px);
	color: #1d7f73;
	margin: 42px 0 18px;
	line-height: 1.2;
}
body:not(.front_page) .entry-content ul.bullet {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 14px;
	padding: 0;
	margin: 0 0 10px;
}
body:not(.front_page) .entry-content ul.bullet li {
	position: relative;
	list-style: none;
	margin: 0;
	padding: 16px 18px 16px 52px;
	background: #f4faf8;
	border: 1px solid rgba(40, 169, 154, .14);
	border-radius: 14px;
	line-height: 1.6;
	transition: transform var(--ft-speed) var(--ft-ease), box-shadow var(--ft-speed) var(--ft-ease);
}
body:not(.front_page) .entry-content ul.bullet li:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(8, 60, 54, .10);
}
body:not(.front_page) .entry-content ul.bullet li::before {
	content: "";
	position: absolute;
	left: 16px;
	top: 17px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--primaryColor) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center / 14px no-repeat;
	box-shadow: none;
	transform: none;
}
body:not(.front_page) .entry-content ul.bullet li strong {
	color: #1d7f73;
}
body:not(.front_page) .entry-content .cta {
	margin-top: 46px;
	padding: 34px 28px;
}

/* ---------------------------------------------------------------
   14. Service pages: photo card beside the text (desktop), under the
   intro line (tablet and phone). The banner photo itself is hidden on
   these pages, leaving just the title bar.
   --------------------------------------------------------------- */
body:not(.front_page) main:has(.ft-service) {
	max-width: 1240px;
}
.ft-service {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(320px, 460px);
	gap: 52px;
	align-items: start;
	margin-top: 10px;
}
.ft-service__body > p:first-child {
	margin-top: 0;
}
.ft-service__media {
	position: sticky;
	top: 110px;
	margin: 0;
	border-radius: 24px;
	overflow: hidden;
	background: #f4faf8;
	box-shadow: 0 22px 50px rgba(8, 60, 54, .18);
}
.ft-service__media img {
	display: block;
	width: 100%;
	height: auto;
}
body:not(.front_page) .ft-service ul.bullet {
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}
@media only screen and (max-width: 1010px) {
	.ft-service {
		grid-template-columns: 1fr;
		gap: 28px;
	}
	.ft-service__media {
		position: static;
		order: -1;
		border-radius: 20px;
	}
}
/* Let the photo card stay pinned: the page wrapper used overflow:hidden, which blocks sticky. */
.clearfix:has(.ft-service) {
	overflow: clip;
}
.ft-service__media img.ft-service__img--wide {
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: center;
}

/* ---------------------------------------------------------------
   15. Dropdowns: the header shared z-index 151 with the page section
   below it, which painted over (cut off) the menu. Long menus (Services
   has 14 items) show in two columns and can scroll on short screens.
   --------------------------------------------------------------- */
header {
	z-index: 1000;
}
@media only screen and (min-width: 1011px) {
	.page_nav .nav-menu > ul > li > ul {
		max-height: calc(100vh - 130px);
		overflow-y: auto;
		overscroll-behavior: contain;
	}
	.page_nav .nav-menu > ul > li:hover > ul:has(> li:nth-child(9)) {
		display: grid;
		grid-template-columns: 1fr 1fr;
		column-gap: 4px;
		width: 580px;
	}
}

/* ---------------------------------------------------------------
   16. Homepage hero on desktop and wide monitors: the video fills the
   full width of the screen (it used to stop at 1920px and leave blank
   side gutters on big monitors), and the cream fade behind the text is
   built in CSS so it follows the text instead of the screen edge.
   --------------------------------------------------------------- */
@media only screen and (min-width: 1011px) {
	.front_page #banner {
		overflow: hidden;
	}
	.front_page .slider {
		position: absolute;
		top: 0;
		left: 50%;
		width: 100vw;
		max-width: none;
		height: 100%;
		margin: 0;
		transform: translateX(-50%);
		overflow: hidden;
	}
	.front_page .slider video {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center 12%;
	}
	.front_page #banner::before {
		background: linear-gradient(90deg, rgba(250, 249, 235, 0) 0, rgba(250, 249, 235, .21) 100px, rgba(250, 249, 235, .635) 380px) no-repeat right center;
		background-size: calc((100% - 1375px) / 2 + 650px) 100%;
	}
}
@media only screen and (min-width: 1011px) and (max-width: 1375px) {
	.front_page #banner::before {
		background-size: 650px 100%;
	}
}

/* Preserve the original three-column desktop card width and center the last row. */
body:not(.front_page) main:has(.serv_list) {
	max-width: 1240px;
}
.entry-content .serv_list > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(16px, 2.5vw, 40px);
	list-style: none;
	margin: 0;
	padding: 0;
}
.entry-content .serv_list > ul > li {
	flex: 1 1 min(100%, 290px);
	width: auto;
	max-width: 380px;
	min-width: 0;
	border-radius: 14px;
	background: #366c3d;
}
.entry-content .serv_list > ul > li > a {
	display: grid;
	grid-template-rows: auto 1fr;
	height: 100%;
	overflow: hidden;
	border-radius: inherit;
	color: #fff;
	text-decoration: none;
}
.entry-content .serv_list > ul > li > a:hover {
	background: #1b7165;
}
.entry-content .serv_list > ul > li > a > img {
	display: block;
	width: 100%;
	aspect-ratio: 380 / 290;
	object-fit: cover;
}
.entry-content .serv_list > ul > li > a > h3 {
	display: grid;
	place-items: center;
	width: auto;
	min-height: 62px;
	margin: 0;
	padding: 12px;
	color: inherit;
	font: 600 17px/1.35 var(--priFont);
	overflow-wrap: anywhere;
}

/* Let inner banners fill the window while preserving the regular photo layout. */
body:not(.front_page) #banner,
body:not(.front_page) #banner > .wrapper {
	max-width: none;
	padding-inline: 0;
}
body:not(.front_page) .non_ban_img {
	width: 100%;
	margin: 0;
	transform: none;
}
@media (max-width: 800px) {
	body:not(.front_page) .non_ban_img img {
		width: 100%;
		height: clamp(145px, 42vw, 310px);
		object-fit: cover;
		object-position: center 35%;
	}
}
body:not(.front_page) .entry-content ul.bullet {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}
body:not(.front_page) .ft-service ul.bullet {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
}

header .header_con .social_media,
.page_nav_mobile .head_info .social_media {
	position: static;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	padding: 0;
}
header .header_con .social_media section,
.page_nav_mobile .head_info .social_media section {
	display: block;
	margin: 0;
}
.social_media h3 {
	color: inherit;
	font: 500 14px/1.3 var(--priFont);
}
.social_media img {
	display: block;
	width: 30px;
}
header .header_con .head_info,
.page_nav_mobile .head_info {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 16px;
	margin: 0;
}
header .header_con .gtrans,
.page_nav_mobile .head_info .gtrans {
	position: relative;
	inset: auto;
	transform: none;
	flex-shrink: 0;
}
.gtrans:empty {
	display: none;
}
.ft-submenu-toggle {
	display: none;
}
@media (min-width: 1011px) {
	header .header_con {
		display: grid;
		grid-template: "logo utility" auto "logo menu" auto / clamp(210px, 21vw, 334px) minmax(0, 1fr);
		align-items: center;
		column-gap: clamp(12px, 2vw, 30px);
	}
	.header_con .main_logo {
		grid-area: logo;
		float: none;
	}
	.header_con .head_info {
		grid-area: utility;
		color: #fff;
	}
	.header_con #nav_area {
		grid-area: menu;
	}
	.header_con .page_nav {
		position: static;
		padding: 0;
	}
	.header_con .page_nav > .wrapper {
		padding: 0;
	}
	.page_nav .nav-menu > ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}
	.page_nav .nav-menu > ul > li > a {
		line-height: 44px;
		padding-inline: clamp(5px, .75vw, 14px);
		letter-spacing: normal;
	}
	.page_nav .nav-menu > ul > li > a::before {
		inset-inline: 8px;
		bottom: 5px;
	}
	.page_nav .nav-menu > ul > li:focus-within > ul,
	.page_nav .nav-menu > ul > li:hover > ul {
		display: block;
	}
	.page_nav .nav-menu > ul > li:is(:hover, :focus-within) > ul:has(> li:nth-child(9)) {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		width: min(580px, calc(100vw - 32px));
	}
	.page_nav .nav-menu > ul > li.ft-submenu-dismissed > ul {
		display: none;
	}
	.page_nav .nav-menu > ul > li > ul {
		max-height: max(140px, calc(100dvh - 145px));
	}
	.page_nav .nav-menu > ul > li:nth-last-child(-n+2) > ul {
		inset-inline: auto 0;
		transform: none;
	}
	.page_nav ul ul li a {
		padding-block: 8px !important;
		line-height: 1.4 !important;
	}
	.page_nav ul ul li a q {
		display: inline;
		top: auto;
	}
	.page_nav ul ul li a q::before {
		content: " ";
	}
}
@media (min-width: 801px) and (max-width: 1010px) {
	header .header_con {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 18px;
	}
	header .main_logo {
		position: relative;
		top: auto;
		transform: none;
	}
	header .head_info {
		color: #fff;
	}
	.page_nav .nav-menu > ul > li > a {
		padding-inline: 8px 42px;
	}
}
@media (max-width: 1010px) {
	.page_nav .nav-menu li > ul {
		display: none;
	}
	.page_nav .nav-menu li.ft-submenu-open > ul {
		display: block;
		z-index: 600;
	}
	.page_nav li.menu-item-has-children > .ft-submenu-toggle {
		display: grid;
		place-items: center;
		position: absolute;
		right: 4px;
		top: 4px;
		z-index: 1;
		width: 44px;
		height: 44px;
		border: 0;
		border-radius: 8px;
		background: #f2f8f7;
		color: #176d62;
		font-size: 22px;
		cursor: pointer;
	}
	.ft-submenu-toggle[aria-expanded="true"] i {
		transform: rotate(180deg);
	}
}
@media (max-width: 800px) {
	body.active #nav_area {
		z-index: 1100;
	}
	.toggle_right_nav {
		transition: background-color .3s ease;
	}
	body.active #tidio-chat,
	body.active #tidio-chat-iframe {
		display: none !important;
	}
	body:has(#nav_area .page_nav_mobile .head_info) header {
		display: none;
	}
	.page_nav {
		width: min(330px, 100%);
		right: -100%;
		height: 100dvh;
		overscroll-behavior: contain;
	}
	body.admin-bar .page_nav {
		height: calc(100dvh - 32px);
	}
	.page_nav > .wrapper {
		padding-inline: 16px;
	}
	.page_nav .nav-menu > ul {
		padding: 12px 0 0;
	}
	.page_nav .menu_slide_right {
		position: sticky;
		top: 0;
		z-index: 700;
		background: #22877b;
		padding: 16px 12px;
	}
	.page_nav.toggle_right_style .logo_slide_right {
		visibility: visible;
	}
	.nav_toggle_button .toggle_holder,
	.page_nav .toggle_holder {
		display: flex;
		align-items: center;
	}
	.page_nav .toggle_holder small,
	.nav_toggle_button .toggle_holder small {
		display: none;
	}
	.page_nav .ft-menu-close.is-active .hamburger-inner::before,
	.page_nav .ft-menu-close.is-active .hamburger-inner::after {
		background-color: #fff;
	}
	.page_nav_mobile {
		padding: 20px 16px;
	}
	.page_nav_mobile .head_info {
		flex-direction: column;
		color: var(--bodyColor);
	}
	.page_nav_mobile .head_info .gtrans {
		z-index: 1;
	}
	.page_nav .nav-menu > ul > li > a {
		min-height: 52px;
	}
	.page_nav ul ul {
		inset-inline: auto;
		transform: none;
	}
}
@media (max-width: 782px) {
	body.admin-bar .page_nav {
		height: calc(100dvh - 46px);
	}
}
@media (max-width: 400px) {
	body:not(.front_page) #main_area {
		padding-inline: 12px;
	}
	body:not(.front_page) #main_area > .wrapper {
		padding-inline: 0;
	}
}