/* Custom overrides — keeps uploaded images a consistent, cropped size
   regardless of the original photo's dimensions, so the layout never
   breaks or looks oversized just because someone uploaded a big photo. */

/* Card images: Practice Areas, Case Studies, Blog listing */
.practice-img,
.blog_item_img {
	overflow: hidden !important;
}
.practice-img img,
.blog_item_img img {
	width: 100% !important;
	height: 240px !important;
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
}

/* Team photos (homepage + /team archive) */
.team-img,
.single-teams .team-img {
	overflow: hidden !important;
}
.team-img img {
	width: 100% !important;
	height: 280px !important;
	object-fit: cover !important;
	object-position: top center !important;
	display: block !important;
}

/* Team modal popup photo */
.lawyer-modal .modal-body img {
	width: 100% !important;
	height: 260px !important;
	object-fit: cover !important;
	object-position: top center !important;
}

/* Single-page featured/detail images: Practice Area, Case Study, Blog Post */
.about-low-area img.img-fluid,
.single-post-content img,
.blog_item_img img.card-img {
	width: 100% !important;
	max-height: 450px !important;
	object-fit: cover !important;
	object-position: center !important;
}

/* Content-body images (pasted inside the rich text editor) shouldn't be
   force-cropped like cards — just keep them from overflowing their column. */
.single-post-content .ql-editor img,
.about-low-area p img {
	max-width: 100% !important;
	height: auto !important;
	object-fit: initial !important;
}

/* Homepage hero text — force white with a soft shadow so it stays readable
   over any background photo, regardless of how bright the photo is. */
.hero__caption p,
.hero__caption h1,
.hero__caption h2 {
	color: #ffffff !important;
	text-shadow: 0 2px 10px rgba(0, 0, 0, 0.55) !important;
}

/* Keep the main navigation on a single line at every desktop width,
   instead of wrapping "Contact Us" (or any item) onto a second row. */
.main-menu nav ul#navigation {
	display: flex !important;
	flex-wrap: nowrap !important;
	white-space: nowrap !important;
	align-items: center;
}
.main-menu nav ul#navigation > li {
	margin-right: 18px !important;
}
.main-menu nav ul#navigation > li:last-child {
	margin-right: 0 !important;
}
@media (max-width: 1450px) {
	.main-menu nav ul#navigation > li { margin-right: 12px !important; }
	.main-menu nav ul#navigation > li > a { font-size: 15px !important; }
}
@media (max-width: 1300px) {
	.main-menu nav ul#navigation > li { margin-right: 8px !important; }
	.main-menu nav ul#navigation > li > a { font-size: 14px !important; }
}
