/* Klein Therapy Navigation Styles - Highly Specific Classes */
.kleintherapy-main-nav {
	background-color: var(--background-white);
	padding: 0.5rem 1rem; /* This padding ensures space around tallest element */
	width: 100%;
	box-shadow: var(--box-shadow-standard); /* Using about.html's definition */
	border-bottom: 1px solid #eeeeee;
	position: sticky;
	top: 0;
	z-index: 1000;
}
 
.kleintherapy-nav-container { /* Specific for nav, can be different from general .container */
	max-width: 1100px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	align-items: center; /* Key for vertical centering */
}

.kleintherapy-nav-logo {
	display: flex;
	align-items: center;
}

.kleintherapy-nav-logo-link {
	display: flex;
	align-items: center;
	text-decoration: none;
}

.kleintherapy-logo-img {
	height: 50px;
	margin-right: 10px;
}

.kleintherapy-logo-text-group {
	display: flex;
	flex-direction: column;
}

.kleintherapy-logo-main-text {
	font-family: var(--font-secondary);
	color: var(--primary-color);
	font-size: 1.8rem;
	font-weight: bold;
	line-height: 1.2;
	transition: var(--transition-standard); /* Added for hover effect */
}
.kleintherapy-logo-main-text:hover {
	color: var(--accent-color);
}

.kleintherapy-tagline {
	font-family: var(--font-secondary);
	font-size: 1.3rem;
	color: var(--primary-color);
	line-height: 1;
	margin-top: -2px;
}

.kleintherapy-nav-menu { /* Targets the UL */
	list-style: none;
	display: flex;
	align-items: center;
	margin-left: auto;	
	padding-left: 0; /* Reset UA padding */
}

.kleintherapy-nav-menu li {
	margin-left: 20px;
}

.kleintherapy-nav-menu a {
	color: var(--primary-color);
	text-decoration: none;
	font-size: 1rem;
	font-weight: 600; /* Added from old nav for consistency if desired, or remove */
	padding: 0.5rem 0.2rem;
	transition: var(--transition-standard);
	position: relative;
}
.kleintherapy-nav-menu a:hover, .kleintherapy-nav-menu a:focus {
	color: var(--accent-color);
}
.kleintherapy-nav-menu a.active-nav-link { /* Style for active link */
	color: var(--accent-color);
	font-weight: bold;
}
/* Optional: underline effect for active/hover (can be adapted from old nav if desired) */
.kleintherapy-nav-menu a::after {
	content: '';	
	position: absolute;	
	width: 0;	
	height: 2px;
	display: block;	
	margin-top: 2px;	
	right: 0;	
	background: var(--accent-color);
	transition: width 0.3s ease;
}
.kleintherapy-nav-menu a:hover::after,	
.kleintherapy-nav-menu a.active-nav-link::after,
.kleintherapy-nav-menu li:hover > a::after { /* Adjusted for direct a hover */
	width: 100%;	
	left: 0;	
}


.kleintherapy-dropdown {
	position: relative;
}

.kleintherapy-dropdown-toggle .kleintherapy-arrow-down { /* Target the span directly */
	font-size: 0.7em;
	margin-left: 5px;
	display: inline-block;
	transition: transform 0.3s ease;
}
/* Simpler rotation for hover on parent li.kleintherapy-dropdown */
.kleintherapy-dropdown:hover .kleintherapy-dropdown-toggle .kleintherapy-arrow-down {
	transform: rotate(180deg);
}


.kleintherapy-dropdown-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background-color: var(--primary-color);
	list-style: none;
	padding: 10px 0;
	margin-top: 5px; /* Space between toggle and menu */
	min-width: 200px;
	box-shadow: var(--box-shadow-standard);
	border-radius: 0 0 var(--border-radius) var(--border-radius);
	z-index: 1001;
	opacity: 0; /* For transition */
	transform: translateY(10px); /* For transition */
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.kleintherapy-dropdown:hover .kleintherapy-dropdown-menu,
.kleintherapy-dropdown.is-open .kleintherapy-dropdown-menu { 
	display: block;
	opacity: 1;
	transform: translateY(0);
}



.kleintherapy-dropdown-menu li {
	margin-left: 0;
}

.kleintherapy-dropdown-menu a {
	display: block;
	padding: 8px 15px;
	white-space: nowrap;
	color: var(--text-color-light);
	font-weight: normal; /* Reset from main nav link */
}
.kleintherapy-dropdown-menu a::after { /* Remove underline effect from dropdown items */
	display: none;
}
.kleintherapy-dropdown-menu a:hover, .kleintherapy-dropdown-menu a:focus {
	background-color: var(--secondary-color);
	color: var(--text-color-light); /* Ensure contrast */
}

.kleintherapy-cta-area {
	display: flex;
	flex-direction: column;
	align-items: flex-end;	
	margin-left: 25px;	
	margin-right: 15px;	
}
.kleintherapy-nav-cta {	
	margin-left: 0;	
	margin-right: 0;
}
.kleintherapy-nav-cta a {
	background-color: var(--primary-color);
	color: var(--text-color-light) !important; /* Ensure text color overrides general link color */
	padding: 8px 15px;
	border-radius: var(--border-radius);
	text-decoration: none;
	font-weight: bold;
	font-size: 0.9rem;
	transition: var(--transition-standard);
	display: inline-block;
}
.kleintherapy-nav-cta a:hover, .kleintherapy-nav-cta a:focus {
	background-color: var(--accent-color-dark); /* Use variable from about.html */
	color: var(--text-color-light) !important;
}
.kleintherapy-nav-cta a::after { /* Remove underline from CTA button */
	display:none;
}

.kleintherapy-header-subtitle {
	font-size: 0.8rem;	
	color: var(--primary-color);
	margin-top: 4px;	
	line-height: 1;
	text-align: right;	
}

.kleintherapy-nav-toggle {
	display: none;
	background: none;
	border: none;
	color: var(--secondary-color);
	font-size: 1.5rem; /* Hamburger will be sized by its spans */
	cursor: pointer;
	padding: 5px; /* Make it easier to tap */
	margin-left: 0;	
}
.kleintherapy-hamburger {
	display: block;
	width: 25px;
	height: 3px;
	background-color: var(--secondary-color);
	position: relative;
	transition: var(--transition-standard);
}
.kleintherapy-hamburger::before,
.kleintherapy-hamburger::after {
	content: '';
	position: absolute;
	width: 25px;
	height: 3px;
	background-color: var(--secondary-color);
	left: 0;
	transition: var(--transition-standard);
}
.kleintherapy-hamburger::before { top: -8px; }
.kleintherapy-hamburger::after { bottom: -8px; }

/* Nav Media Queries */
@media (max-width: 992px) {
	.kleintherapy-cta-area {	
		display: none;
	}
	.kleintherapy-nav-menu {
		margin-left: auto; /* Ensure it still aligns right if cta-area is hidden */
		display: none !important; /* Hide menu on tablet sizes too */
		flex-direction: column;
		width: 100%;
		position: absolute;
		top: 54px;	
		left: 0;
		background-color: var(--background-white);
		padding-bottom: 10px;
		box-shadow: var(--box-shadow-standard);
		align-items: stretch; /* Make items full width */
		z-index: 1000; /* Ensure menu appears above other content */
	}
	.kleintherapy-nav-menu.is-active { 
		display: flex !important; /* Force display when active */
	}
	.kleintherapy-nav-toggle { /* Add margin back to toggle if CTA area is gone */
		margin-left: 15px;
		display: block; /* Ensure toggle is visible on tablet sizes */
	}
	
	/* Mobile menu items styling for tablet sizes */
	.kleintherapy-nav-menu li { margin-left: 0; width: 100%; text-align: center; }
	.kleintherapy-nav-menu a { padding: 1rem; display: block; border-bottom: 1px solid #eeeeee; }
	.kleintherapy-nav-menu li:last-child a { border-bottom: none; }
	.kleintherapy-nav-menu a::after { display: none; } /* No underlines in mobile dropdown */
	
	/* Dropdown menu styling for mobile */
	.kleintherapy-dropdown-menu {	
		position: static;	
		box-shadow: none;	
		border-radius: 0;	
		margin-top: 0;	
		background-color: var(--secondary-color);
		width: 100%;	
		padding-left: 0;
		opacity: 1;
		transform: none;
		border-bottom: 1px solid var(--primary-color);
		display: none;
	}
	
	.kleintherapy-dropdown:hover .kleintherapy-dropdown-menu {
		display: none; /* Disable hover on mobile */
	}
	.kleintherapy-dropdown.is-open .kleintherapy-dropdown-menu {
		display: block;
	}
	
	.kleintherapy-dropdown-menu a {	
		padding: 0.8rem 1rem;	
		color: var(--text-color-light);	
		border-bottom: 1px solid var(--primary-color);	
		text-align: center;
	}
	.kleintherapy-dropdown-menu li:last-child a { border-bottom: none; }
	.kleintherapy-dropdown-menu a:hover, .kleintherapy-dropdown-menu a:focus { background-color: var(--primary-color); }
	
	/* Hamburger animation */
	.kleintherapy-nav-toggle.is-active .kleintherapy-hamburger { background-color: transparent; }
	.kleintherapy-nav-toggle.is-active .kleintherapy-hamburger::before { transform: rotate(45deg) translate(5px, 6px); }
	.kleintherapy-nav-toggle.is-active .kleintherapy-hamburger::after { transform: rotate(-45deg) translate(5px, -6px); }
}

@media (max-width: 768px) {
	/* Logo adjustments for smaller screens */
	.kleintherapy-logo-main-text { font-size: 1.3rem; }
	.kleintherapy-tagline { font-size: 0.65rem; }
	.kleintherapy-logo-img { height: 30px; }
	.main-nav { padding: 0.5rem; } /* Adjusted padding for smaller screens */
}
@media (max-width: 420px) {
	.kleintherapy-logo-main-text { font-size: 1.1rem; }
	.kleintherapy-tagline { font-size: 0.6rem; }
	.kleintherapy-logo-img { height: 25px; margin-right: 5px;}
	.main-nav {
		/* Calculate based on 25px logo + 0.5rem padding top/bottom */
	}
	.kleintherapy-nav-menu {
		/* Adjust top based on nav height if it changes significantly */
	}
}