/* Full-width content — the sidebar has no widgets, so remove the empty column */
#secondary.widget-area { display: none; }

#primary.content-area,
#main.site-main {
	width: 100%;
	float: none;
}

/* Use more of the screen on large monitors */
@media (min-width: 1400px) {
	.wrap { max-width: 1320px; }
}

/* Keep images inside the content area */
.entry-content img,
.entry-content figure { max-width: 100%; height: auto; }

/* --- Fix for pages that embed their own <style> block ---
   Some pages (Home & Decor, etc.) contain a pasted page design whose CSS
   redefines generic class names like .wrap, which squeezed the theme's
   header, menu and footer down to 760px. Restore the theme containers. */
.top-bar > .wrap,
.logo-bar > .wrap,
#sticky-header > .wrap,
#content > .wrap,
.widget-wrap > .wrap,
.site-info > .wrap {
	max-width: 1320px !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Widen the page's own content wrappers to match the rest of the site */
.entry-content .wrap { max-width: 1100px !important; }

/* The embedded page CSS sets img{display:block}, which stops the logo centring */
.custom-logo-link img,
img.custom-logo {
	margin-left: auto !important;
	margin-right: auto !important;
}

/* Hide the theme's duplicate footer (widget area + credits bar).
   The site already has its own EXPLORE / COMPANY footer below it.
   The back-to-top button is left visible. */
#colophon .widget-wrap,
#colophon .site-info { display: none !important; }

/* ---------- Main menu ---------- */

/* Soften the hard blue rule into warm hairlines that match the gold logo */
#sticky-header {
	border-top: 1px solid #e2d6bb !important;
	border-bottom: 1px solid #efe9dd !important;
}

@media (min-width: 1024px) {

	/* Centre the menu under the centred logo */
	#site-navigation {
		float: none !important;
		margin: 0 !important;
		text-align: center;
	}

	.main-navigation ul.nav-menu > li > a {
		padding: 0 26px !important;
		font-size: 13px;
		font-weight: 600;
		letter-spacing: 1.4px;
		position: relative;
		transition: color .25s ease;
	}

	/* Thin gold underline that slides in on hover and marks the current page */
	.main-navigation ul.nav-menu > li > a::after {
		content: "";
		position: absolute;
		left: 26px;
		right: 26px;
		bottom: 14px;
		height: 1px;
		background: #b7944f;
		transform: scaleX(0);
		transition: transform .28s ease;
	}

	.main-navigation ul.nav-menu > li > a:hover::after,
	.main-navigation ul.nav-menu > li.current-menu-item > a::after,
	.main-navigation ul.nav-menu > li.current_page_item > a::after {
		transform: scaleX(1);
	}

	.main-navigation ul.nav-menu > li > a:hover,
	.main-navigation ul.nav-menu > li.current-menu-item > a,
	.main-navigation ul.nav-menu > li.current_page_item > a {
		color: #8a6a34 !important;
	}
}

/* Small laptops: tighten the menu so it never wraps to two lines */
@media (min-width: 1024px) and (max-width: 1199px) {
	.main-navigation ul.nav-menu > li > a { padding: 0 14px !important; }
	.main-navigation ul.nav-menu > li > a::after { left: 14px; right: 14px; }
}

/* Post images fill the content width.
   Left/right-aligned and small images are left alone. */
.entry-content figure.wp-block-image:not(.alignleft):not(.alignright):not(.size-thumbnail):not(.size-medium),
.entry-content figure.wp-block-image:not(.alignleft):not(.alignright):not(.size-thumbnail):not(.size-medium) > a,
.entry-content figure.wp-block-image:not(.alignleft):not(.alignright):not(.size-thumbnail):not(.size-medium) img {
	width: 100% !important;
	max-width: 100% !important;
	height: auto !important;
}

/* Homepage cards use a CSS background-image with background-size:cover,
   which chopped the sides off wide featured images. Show the whole image. */
.image-slider {
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: center center !important;
	background-color: #f6f2ea;
}
