/* Restoration compatibility + responsive layout */
*, *::before, *::after {box-sizing: border-box;}
html {overflow-x: hidden;}
body {overflow-x: hidden; max-width: 100%;}
figure {margin: 0;}
figure.alignright {margin: 0 0 1em 1.5em; clear:right;}
.entry_content > .alignright, .entry_content > p > a > .alignright {margin-left:1.5em;}
img {max-width:100%; height:auto;}
.mainlogo-img {max-width:100%; height:auto;}

/* Feature slider */
#cycle {position:relative;height:350px;overflow:hidden;}
#cycle .fcontainer {position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 750ms ease;}
#cycle .fcontainer:first-child, #cycle .fcontainer.active-slide {opacity:1;visibility:visible;}
#cycle.initialized .fcontainer:not(.active-slide) {opacity:0;visibility:hidden;}
#feature-footer .playpause {cursor:pointer;}
#feature-footer a:focus-visible, #feature-footer [role=button]:focus-visible {outline:2px solid #225E9B;outline-offset:3px;}

/* Keep banner title small label matching "WE CREATE" */
#feature_slider .fcontent .ftitle small {
	display: block;
	font-size: 16px !important;
	line-height: 25px;
	font-weight: normal;
}

/* Justified intro copy under banners */
.home .entry_content .intro-copy {
	text-align: justify !important;
	text-justify: inter-word;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.sharedaddy {clear:both;padding-top:18px;margin-bottom:20px;}
.sharedaddy h3 {font:bold 12px Arial,sans-serif;display:inline-block;border-top:1px solid #ddd;padding-top:14px;margin:0 0 14px;}
.share-links {display:flex;gap:6px;flex-wrap:wrap;}
.share-links a {font:13px Arial,sans-serif;color:#333;background:#f5f5f5;border:1px solid #ccc;border-radius:3px;padding:5px 9px;text-decoration:none;}
.share-links a:hover {background:#e9e9e9;}
.jgd-lightbox {border:0;background:#fff;padding:14px;max-width:92vw;max-height:92vh;border-radius:3px;box-shadow:0 12px 60px #0008;}
.jgd-lightbox::backdrop {background:rgba(0,0,0,.82);}
.jgd-lightbox img {display:block;max-height:80vh;max-width:85vw;width:auto;object-fit:contain;}
.jgd-lightbox button {display:block;margin:0 0 8px auto;padding:6px 12px;color:#222;border:1px solid #aaa;background:#fff;cursor:pointer;font:14px Arial,sans-serif;}

/* ---------- Tablet & below ---------- */
@media (max-width:980px) {
	#site {min-width:0 !important; width:100%;}
	.canvas #page-canvas,
	.fixed_width #page,
	.fixed_width #footer {width:100% !important; max-width:100%;}
	#site .content,
	#page-main .content,
	.wcontent,
	#primary-nav ul.main-nav.nosearch,
	#page-main .content,
	.fullwidth #pagelines_content #column-main,
	.fullwidth #pagelines_content #column-wrap,
	.fullwidth .wmain {width:100% !important; max-width:100%;}
	.content {width:100% !important; max-width:100%;}

	#branding .content-pad {padding:20px 16px 8px;}
	#primary-nav .content-pad {padding-left:12px;padding-right:12px;}
	#feature .content-pad {padding:0 12px;}
	#theloop .copy-pad {padding-left:16px;padding-right:16px;}
	.mcolumn-pad {padding-left:0;padding-right:0;}

	/* Keep banner text overlay on the left — do not push it below the image */
	#feature-area,
	.feature-wrap,
	#feature_slider .fmedia,
	#feature_slider .fcontent,
	#cycle {height:320px !important;}

	#feature_slider .feature-wrap {
		background-position: center top !important;
		background-size: cover !important;
		height:320px !important;
	}
	#feature_slider .fcontent {
		float: left !important;
		position: relative !important;
		top: auto !important;
		left: auto !important;
		width: 38% !important;
		min-width: 0 !important;
		max-width: 320px;
		height: 320px !important;
		background: rgba(0,0,0,.55);
	}
	#feature_slider .fmedia {
		float: left !important;
		width: 62% !important;
		height: 320px !important;
	}
	#feature_slider .fcontent .dcol-pad {
		padding: 28px 18px 16px;
		height: auto;
		max-height: 320px;
		overflow: hidden;
	}
	#feature_slider .fcontent .fheading {padding: .4em 0;}
	#feature_slider .fcontent .ftitle {font-size: 2em; line-height: 1.05;}
	#feature_slider .fcontent .ftitle small {font-size: 13px !important; line-height: 1.35; letter-spacing: .12em;}
	#feature_slider .fcontent .fexcerpt {font-size: 14px; line-height: 1.45;}
	#feature_slider .fcontent .fexcerpt p {margin: .5em 0;}

	.entry_content br {display: initial;}
	.home .entry_content br {display: none;}
	h1 {font-size: 2em; line-height: 1.2;}
}

/* ---------- Mobile ---------- */
@media (max-width:640px) {
	body {padding-top: 0;}
	#branding .content-pad {padding:14px 12px 6px;}
	.mainlogo-img {max-height: 72px; width: auto;}
	#primary-nav ul.main-nav {
		float: none;
		width: 100% !important;
		display: flex;
		flex-wrap: wrap;
	}
	#primary-nav ul.main-nav li {float: none;}
	#primary-nav ul.main-nav li a {
		padding: 10px 10px;
		font-size: 11px;
		letter-spacing: .08em;
	}

	/* Overlay stays on left of banner; shorter banner on phones */
	#feature-area,
	.feature-wrap,
	#feature_slider .fmedia,
	#feature_slider .fcontent,
	#cycle {height:280px !important;}

	#feature_slider .feature-wrap {
		height: 280px !important;
		background-size: cover !important;
		background-position: 70% top !important;
	}
	#feature_slider .fcontent {
		width: 48% !important;
		max-width: none;
		height: 280px !important;
		background: rgba(0,0,0,.62);
	}
	#feature_slider .fmedia {
		width: 52% !important;
		height: 280px !important;
	}
	#feature_slider .fcontent .dcol-pad {
		padding: 16px 12px 12px;
	}
	#feature_slider .fcontent .fheading {padding: .25em 0;}
	#feature_slider .fcontent .ftitle {font-size: 22px; line-height: 1.1;}
	#feature_slider .fcontent .ftitle small {font-size: 11px !important; line-height: 1.3; letter-spacing: .1em;}
	#feature_slider .fcontent .fexcerpt {font-size: 12px; line-height: 1.4;}
	#feature_slider .fcontent .fexcerpt p {margin: .4em 0;}
	#feature_slider .fcontent {font-size: 1em;}

	#feature-footer .feature-footer-pad {padding: 6px 4px;}
	#featurenav a {padding: 4px 7px; font-size: 11px;}

	#theloop .copy-pad {padding-left:12px;padding-right:12px;}
	figure.alignright,
	.entry_content > p > a > .alignright {
		float: none;
		width: auto !important;
		max-width: 100%;
		margin: 0 auto 1.2em;
	}
	.entry_content > p > a > .alignright {display: block;}
	.wp-caption {box-sizing: border-box; max-width: 100%;}
	.entry_content {font-size: 15px; line-height: 1.6;}
	.home .entry_content br {display: none;}
	h1 {font-size: 24px; line-height: 1.2;}
}

/* ---------- Narrow phones ---------- */
@media (max-width:400px) {
	#feature-area,
	.feature-wrap,
	#feature_slider .fmedia,
	#feature_slider .fcontent,
	#cycle {height:260px !important;}

	#feature_slider .feature-wrap {height: 260px !important;}
	#feature_slider .fcontent {
		width: 55% !important;
		height: 260px !important;
	}
	#feature_slider .fmedia {
		width: 45% !important;
		height: 260px !important;
	}
	#feature_slider .fcontent .ftitle {font-size: 18px;}
	#feature_slider .fcontent .ftitle small {font-size: 10px !important;}
	#feature_slider .fcontent .fexcerpt {font-size: 11px; line-height: 1.35;}
	#primary-nav ul.main-nav li a {padding: 9px 7px; font-size: 10px;}
}

@media (prefers-reduced-motion: reduce) {
	#cycle .fcontainer {transition: none;}
}