/* ============================================================
   Mirador Law - v4 Practice Area Individual Page
   Scoped under .mdl-pa-v4
   ============================================================ */

.mdl-pa-v4,
.mdl-pa-v4 *,
.mdl-pa-v4 *::before,
.mdl-pa-v4 *::after { box-sizing: border-box; }

.mdl-pa-v4 {
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	color: #506272;
	background: #fff;
}

/* Buttons */
.mdl-pa-v4 .mdl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 36px;
	background: #CAA45D;
	color: #fff !important;
	font-family: 'Montserrat', sans-serif;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none !important;
	border: 0;
	cursor: pointer;
	transition: background-color .15s ease;
}
.mdl-pa-v4 .mdl-btn:hover,
.mdl-pa-v4 .mdl-btn--gold:hover { background: #B5903F; color: #fff !important; }

/* ============ Layout shell: content + STICKY sidebar ============ */
.mdl-pa-shell {
	padding: 64px 32px;
	background: #fff;
}
.mdl-pa-shell__inner {
	max-width: 1440px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 380px;
	gap: 48px;
	align-items: start;
}

/* Sticky sidebar wrapper. The OUTER .mdl-pa-sidebar takes the grey
   background and stretches the full height of the grid cell (which
   includes content + news). The INNER .mdl-pa-sidebar__stick is the
   sticky element holding the actual widgets - it's transparent so
   the grey shows through everywhere. */
.mdl-pa-sidebar {
	background: #879BAB;
	padding: 0;
	color: #fff;
	align-self: stretch;  /* fill grid cell height */
}
.mdl-pa-sidebar__stick {
	position: -webkit-sticky;
	position: sticky;
	top: 144px;
	display: flex;
	flex-direction: column;
	gap: 56px;
	background: transparent;
	padding: 24px 28px 40px;
}

/* Main content column */
.mdl-pa-main { min-width: 0; }
.mdl-pa-title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 46px;
	line-height: 1.25;
	color: #243952;
	text-transform: uppercase;
	margin: 0 0 18px;
}
/* ============================================================
   Article / practice-area BODY CONTENT — exact Figma spec
   (node 25:4568). Design tokens:
     Body (P2): Montserrat 400, 17px / 27px line-height, #506272,
                letter-spacing 0.
     Section H2: Montserrat 600 (SemiBold), 22px / 41.8px line-height,
                 UPPERCASE, #506272 (Paynes Gray).
     List items: 17px / 27px, 10px gap between items, disc bullets,
                 1.5em indent.
     Paragraph rhythm: ~27px vertical gap between blocks.
     Links: underlined; the emphasised CTA link ("Speak with our
            firm") is SemiBold 600 in #243952 (Prussian).
   ============================================================ */
.mdl-pa-copy {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 17px;
	line-height: 27px;
	letter-spacing: 0;
	color: #506272;
}
.mdl-pa-copy p {
	margin: 0 0 27px;
	font-size: 17px;
	line-height: 27px;
	color: #506272;
}
.mdl-pa-copy p:last-child { margin-bottom: 0; }
.mdl-pa-copy h2, .mdl-pa-copy h3, .mdl-pa-copy h4 {
	font-family: 'Montserrat', sans-serif;
	color: #506272;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0;
	margin: 32px 0 14px;
}
.mdl-pa-copy h2 { font-size: 22px; line-height: 30px; }
.mdl-pa-copy h3 { font-size: 18px; line-height: 1.4; }
.mdl-pa-copy ul, .mdl-pa-copy ol {
	margin: 0 0 27px;
	padding-left: 1.5em;
	color: #506272;
	list-style-position: outside;
}
.mdl-pa-copy ul { list-style-type: disc; }
.mdl-pa-copy ol { list-style-type: decimal; }
.mdl-pa-copy ul li,
.mdl-pa-copy ol li {
	font-size: 17px;
	line-height: 27px;
	margin-bottom: 10px;
	display: list-item;     /* force list rendering even when theme resets it */
}
.mdl-pa-copy ul li:last-child,
.mdl-pa-copy ol li:last-child { margin-bottom: 0; }
.mdl-pa-copy ul li::marker { color: #506272; }
.mdl-pa-copy a {
	color: #CAA45D;
	font-weight: 600;
	text-decoration: underline;
}
.mdl-pa-copy a:hover { color: #B5903F; }
.mdl-pa-copy strong { color: #243952; font-weight: 700; }


/* Sidebar widget: watermark + title + light-blue card */
.mdl-pa-side-widget {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 24px 0;  /* breathing room top and bottom of each widget */
}
.mdl-pa-side-watermark {
	position: relative;  /* normal flow, not absolute */
	width: 100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 18px;  /* gap between watermark and the section title below */
	flex-shrink: 0;
}
.mdl-pa-side-watermark svg { display: block; width: 100px; height: 100px; }
/* Uploaded watermark image: same size as SVG fallback */
.mdl-pa-side-watermark__img {
	display: block !important;
	width: 100px !important;
	height: 100px !important;
	max-width: 100px !important;
	max-height: 100px !important;
	object-fit: contain !important;
}

/* In-card watermark (Ready widget) - sits inside the blue card above the title */
.mdl-pa-side-card__watermark {
	width: 100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 4px;
	flex-shrink: 0;
}
.mdl-pa-side-card__watermark svg {
	display: block;
	width: 100px;
	height: 100px;
}
.mdl-pa-side-card__watermark svg path { stroke: #243952 !important; }
.mdl-pa-side-card__watermark .mdl-pa-side-watermark__img {
	width: 100px !important;
	height: 100px !important;
	max-width: 100px !important;
	max-height: 100px !important;
	object-fit: contain !important;
}

/* Button icon (uploaded or SVG): 24×24 baseline for clear visibility */
.mdl-pa-btn-icon {
	display: inline-block !important;
	width: 24px !important;
	height: 24px !important;
	max-width: 24px !important;
	max-height: 24px !important;
	object-fit: contain !important;
	flex: 0 0 auto;
}
.mdl-pa-side-title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 28px;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-align: center;
	color: #fff;
	margin: 0 0 22px;
	width: 100%;
}
.mdl-pa-side-card {
	background: #BECCD7;
	padding: 28px 24px 32px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	width: 100%;
}
.mdl-pa-side-card__title,
.mdl-pa-side-card h3.mdl-pa-side-card__title {
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 600 !important;
	font-size: 21px !important;
	line-height: 1.4 !important;
	color: #243952 !important;
	margin: 0 !important;
	text-align: center !important;
	text-transform: none !important;  /* parent theme forces h3 uppercase - override */
	letter-spacing: 0 !important;
}
.mdl-pa-side-card__lede {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 16px;
	line-height: 1.55;
	color: #506272;
	margin: 0;
	text-align: center;
}
.mdl-pa-side-card__rule {
	display: block;
	width: 72px;
	height: 2.5px;
	background: #CAA45D;
	margin: 4px auto;
}

/* List of practice areas */
.mdl-pa-side-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 100%;
	text-align: center;
}
.mdl-pa-side-list li {
	margin: 0;
	padding: 0;
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 18px;
	line-height: 2.15;
	color: #506272;
	list-style: none;
}
.mdl-pa-side-list li a {
	color: #506272 !important;
	text-decoration: none !important;
	transition: color .15s ease;
}
.mdl-pa-side-list li a:hover { color: #CAA45D !important; }
.mdl-pa-side-list .sub-menu { display: none; } /* hide nested submenus in sidebar */

/* LEARN MORE button inside card */
.mdl-pa-side-card__btn {
	margin-top: 6px;
	padding: 14px 50px !important;
	font-size: 16px !important;
	font-weight: 500 !important;
}

/* Ready to Discuss buttons: full-width with icon, gold */
.mdl-pa-side-cta-btn {
	width: 100%;
	padding: 14px 24px !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	letter-spacing: 1px !important;
}
.mdl-pa-side-cta-btn svg {
	flex: 0 0 auto;
}

/* ============ Recent News (inside main column) ============ */
.mdl-pa-news {
	background: transparent;
	padding: 0;
	margin-top: 40px;
	/* Thin light separator line above the section (matches location page). */
	border-top: 1px solid #647C90;
	padding-top: 32px;
}
.mdl-pa-news__head {
	background: transparent;
	padding: 0 0 8px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.mdl-pa-news__title {
	color: #243952;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0;
}
.mdl-pa-news__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 24px;
	margin-top: 24px;
}
@media (min-width: 700px) {
	.mdl-pa-news__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
.mdl-pa-news-card {
	background: #F4F4F4;
	width: 100%;
	padding: 25px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	overflow: hidden;
}
.mdl-pa-news-card__media {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #DDD;
	flex: 0 0 auto;
}
.mdl-pa-news-card__media img {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	display: block;
}
.mdl-pa-news-card__body {
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.mdl-pa-news-card__title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 21px;
	line-height: 1.3;
	color: #243952;
	margin: 0;
}
.mdl-pa-news-card__title a {
	color: #243952 !important;
	text-decoration: none !important;
}
.mdl-pa-news-card__title a:hover { color: #CAA45D !important; }
.mdl-pa-news-card__rule {
	display: block;
	width: 100%;
	height: 0;
	/* Use a border instead of background-color so the 1px line always
	   renders crisply at every device pixel ratio. */
	border: 0;
	border-top: 1px solid #B7BFC7;
	margin: 0 0 14px;
	opacity: 1;
}
.mdl-pa-news-card__excerpt {
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	font-size: 17px;
	line-height: 1.55;
	color: #506272;
	margin: 0;
	/* Truncate to 4 lines for consistent card heights across the grid */
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.mdl-pa-news-card__more {
	color: #CAA45D !important;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none !important;
}
.mdl-pa-news-card__more:hover { color: #B5903F !important; }

/* ============ CTA before footer ============ */
.mdl-pa-cta {
	background: #BECCD7;
	padding: 64px 32px;
}
.mdl-pa-cta__inner {
	max-width: 960px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	text-align: center;
}
.mdl-pa-cta__eyebrow {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 22px;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: #243952;
	margin: 0;
}
.mdl-pa-cta__title {
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: #243952;
	text-transform: uppercase;
	margin: 0;
}
.mdl-pa-cta__body {
	font-family: 'Montserrat', sans-serif;
	font-weight: 600;
	font-size: 21px;
	line-height: 1.5;
	color: #506272;
	margin: 0;
	max-width: 850px;
}
.mdl-pa-cta .mdl-btn { margin-top: 14px; padding: 16px 44px; }

/* ============ Responsive ============ */
@media (max-width: 1100px) {
	.mdl-pa-shell__inner {
		grid-template-columns: 1fr;
		gap: 40px;
	}
	/* Disable sticky on tablet/mobile - sidebar becomes a normal block below content */
	.mdl-pa-sidebar { max-width: 480px; margin: 0 auto; width: 100%; }
	.mdl-pa-sidebar__stick {
		position: static !important;
		top: auto;
	}
}

@media (max-width: 768px) {
	.mdl-pa-shell { padding: 40px 20px; }
	.mdl-pa-title { font-size: 28px; line-height: 1.2; }
	.mdl-pa-copy p, .mdl-pa-copy ul li, .mdl-pa-copy ol li { font-size: 16px; }
	.mdl-pa-news { padding-top: 24px; margin-top: 28px; }
	.mdl-pa-news__head { padding: 0 0 6px; }
	.mdl-pa-news__title { font-size: 22px; }
	.mdl-pa-news-card {
		max-width: 100%;
		min-height: 0;
		padding: 20px;
	}
	.mdl-pa-cta { padding: 48px 20px; }
	.mdl-pa-cta__eyebrow { font-size: 16px; }
	.mdl-pa-cta__title { font-size: 24px; }
	.mdl-pa-cta__body { font-size: 17px; line-height: 1.5; }
	.mdl-pa-cta .mdl-btn,
	.mdl-pa-side-cta-btn,
	.mdl-pa-side-card__btn {
		white-space: normal !important;
		max-width: 100% !important;
		padding: 14px 20px !important;
		font-size: 12px !important;
		line-height: 1.35 !important;
	}
	.mdl-pa-sidebar__stick { padding: 24px 20px 32px; }
}
/* ==========================================================================
   FAQ inside the Practice-Area / Location-by-Service content column.
   The shared accordion markup (.mdl-pi-faq) is centered and full-width by
   default; in this narrower left column we left-align it, tighten the spacing,
   and match the section heading to the page's other H2s (e.g. RECENT NEWS).
   ========================================================================== */
.mdl-pa-main .mdl-pa-faq-wrap { margin-top: 40px; }
.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-faq {
	background: transparent;
	padding: 0;
}
.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-faq__wrap {
	text-align: left;
	max-width: none;
	margin: 0;
	padding-left: 0;
	padding-right: 0;
	width: 100%;
}
.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-h2 {
	color: #243952;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0 0 20px;
	text-align: left;
}
.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-faq__sub {
	font-size: 17px;
	text-align: left;
	margin: 0 0 20px;
	max-width: none;
}
.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-faq__list { max-width: none; margin: 0; }

@media (max-width: 575px) {
	.mdl-pa-main .mdl-pa-faq-wrap .mdl-pi-h2 { font-size: 24px; }
}

/* ==========================================================================
   "Ready to discuss your case?" CTA spacing inside the Practice-Area column.
   Visual design comes from the universal .mdl-ready-cta--card rules in
   personal-injury-v4.css (shared across all pages).
   ========================================================================== */
.mdl-pa-main .mdl-ready-cta.mdl-ready-cta--card { margin: 32px 0 0; }