/* Responsive layer for the static rebuild of smpklaw.com.
   Desktop (980px and up) is left exactly as the original Hivemind template draws it. */

/* Mobile menu is hidden on desktop */
.m-nav { display: none; }

/* Contact page email buttons (replace the old Formexperts form) */
.contact-email h2 { margin-top: 0; }
#body-padding .item-page::after { content: ""; display: block; clear: both; }
.contact-email a.tel { color: #53783c; }
a.email-btn {
	display: block; max-width: 340px; margin: 0 0 12px; padding: 12px 16px;
	border: 1px solid #ddd; border-radius: 6px; text-decoration: none;
	background: linear-gradient(#fff, #eef1ef); box-shadow: 1px 1px 3px #ddd;
	transition: border-color .15s, background .15s;
}
a.email-btn:hover { border-color: #53783c; background: #fff; }
a.email-btn .email-name { display: block; color: #53783c; font-size: 16px; font-weight: bold; }
a.email-btn .email-name::before { content: "\2709\00a0\00a0"; color: #999; font-weight: normal; }
a.email-btn .email-addr { display: block; color: #777; font-size: 13px; margin-top: 2px; padding-left: 26px; }

/* Footer phone link keeps the original text color */
#footer a.tel { color: inherit; text-decoration: none; }

img { max-width: 100%; }

@media (max-width: 980px) {
	html { -webkit-text-size-adjust: 100%; }
	body { overflow-x: hidden; }

	div.wrapper { width: auto !important; margin: 0 10px !important; }
	#top { height: 10px; }

	/* Header: logo scales, desktop menu swaps for a tap menu */
	#header { height: auto; padding: 4px 16px 14px; }
	#header > a.nounder { display: block; }
	img#logo {
		position: static; float: none; display: block;
		width: 100%; max-width: 615px; height: auto; aspect-ratio: 615 / 65;
		background-size: contain;
	}
	#horiz-menu { display: none; }

	.m-nav { display: block; margin-top: 14px; position: relative; z-index: 60; }
	.m-nav summary {
		list-style: none; cursor: pointer; display: inline-block;
		padding: 9px 16px; border: 1px solid #ccc; border-radius: 6px;
		background: linear-gradient(#fff, #e9eceb); color: #555; font-size: 15px;
		box-shadow: 0 1px 2px rgba(0,0,0,.08);
	}
	.m-nav summary::-webkit-details-marker { display: none; }
	.m-nav summary::before { content: "\2630\00a0\00a0"; }
	.m-nav[open] summary { background: #e3e8e5; }
	.m-nav ul {
		list-style: none; margin: 10px 0 0; padding: 6px 0;
		background: #fff; border: 1px solid #ddd; border-radius: 6px;
		box-shadow: 0 6px 18px rgba(0,0,0,.08);
	}
	.m-nav li { margin: 0; padding: 0; background: none; }
	.m-nav li a { display: block; padding: 11px 16px; color: #555; text-decoration: none; font-size: 15px; }
	.m-nav li a:hover, .m-nav li a[aria-current="page"] { background: #eef1ef; color: #53783c; }
	.m-nav li.m-sub a { padding-left: 32px; font-size: 14px; }
	.m-nav li.m-group { padding: 11px 16px 4px; color: #999; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }

	/* Single column: content, then the sidebar menu */
	#maincol, #sidecol { float: none !important; width: auto !important; margin: 0 !important; }
	#maincol-container { margin-right: 0 !important; padding: 0 16px; }
	#sidecol { margin-top: 0 !important; padding: 0 6px 16px; }
	#body-padding { padding-bottom: 20px; }

	/* Attorney photo and email sit above the bio */
	.attywrapper { float: none; width: auto; margin: 0 auto 20px; max-width: 300px; }
	.powersattyimg, .knierattyimg, .smithattyimg, .martinattyimg, .sullivanattyimg, .conwillattyimg {
		width: 100% !important; height: auto !important; aspect-ratio: 300 / 550;
	}
	.attyclear { width: 100%; height: 100%; }
	.attyemail { float: none; width: auto; margin-top: 8px; }

	/* Inline column layouts from the old editor stack up */
	#body-padding div[style*="float"] {
		float: none !important; width: auto !important; margin-right: 0 !important; height: auto !important;
	}

	/* Contact page: address and phone above the email buttons */
	.item-page:has(.contact-email) { display: flex; flex-direction: column-reverse; }
	.contact-email { margin-top: 28px; }

	/* Embedded map and form fit the screen */
	#body-padding iframe { max-width: 100%; }
	#body-padding iframe[src*="google.com/maps"] { width: 100%; height: 320px; }

	/* Footer: text above, building artwork scaled below */
	#footer { margin: 0; }
	.footerbg {
		box-sizing: border-box; height: auto; margin-top: 0; padding: 10px 16px calc(33vw + 10px);
		background-size: 100% auto; background-position: 50% 100%; text-align: left;
	}
	.footerbg::after { content: ""; display: block; clear: both; }
	.customfooter {
		width: auto !important; float: left; height: auto;
		padding: 0 28px 14px 0; margin-top: 10px; font-size: 15px;
	}
	#footer a.tel { color: #53783c; }
}

@media (max-width: 600px) {
	.firstcharacter { font-size: 46px; line-height: 38px; }
	#body-padding h1 { font-size: 1.6em; line-height: 1.2; }
	#body-padding p[style*="font-size"], #body-padding span[style*="font-size: 14pt"] { font-size: 12pt !important; }
}
