/* Gulf Life - site CSS
   Loaded by the child theme's functions.php with a filemtime version, so edits here
   reach visitors immediately instead of waiting behind a cached style.css?ver=4.4.1.
   -------------------------------------------------------------------------------- */

/* Header: stop two-word menu labels breaking in half.
   Houzez 4.4 rebuilt on Bootstrap 5.3 and the top-level nav links inherit
   white-space: normal, so "About us" and "Contact us" split across two lines once the
   bar gets tight, which drags the whole header out of alignment.
   The header is the Elementor menu widget, so the markup is .houzez-elementor-menu /
   .main-ele-nav - not the theme's .main-nav, which on this site is an empty fallback. */
.houzez-elementor-menu > li > a,
.houzez-elementor-menu a.nav-link,
.main-ele-nav a.nav-link,
.houzez-nav-menu-main a.nav-link {
	white-space: nowrap;
}

/* The link across to the other half of the site - "Residential" on the industrial header,
   "Industrial" on the residential one. Pushed to the right and given a gold outline so it
   reads as a doorway to another section rather than one more menu item. */
.houzez-elementor-menu > li.gl-cross-link {
	margin-left: auto;
	padding-left: 34px;
}

.houzez-elementor-menu > li.gl-cross-link > a {
	border: 1px solid #DABF97;
	border-radius: 3px;
	padding-left: 16px !important;
	padding-right: 16px !important;
	line-height: 30px;
	transition: background-color .18s ease, color .18s ease;
}

.houzez-elementor-menu > li.gl-cross-link > a:hover,
.houzez-elementor-menu > li.gl-cross-link > a:focus {
	background-color: #DABF97;
	color: #1d1f2c !important;
}

/* On a phone the menu stacks, so the auto margin would shove it to the bottom edge. */
@media (max-width: 991px) {
	.houzez-elementor-menu > li.gl-cross-link {
		margin-left: 0;
		padding-left: 0;
	}
	.houzez-elementor-menu > li.gl-cross-link > a {
		display: inline-block;
		margin: 6px 0;
	}
}

/* Industrial home "On the books" card grid - the same 1260px box as the residential hub's grid.
   The widget replaced a full-bleed carousel and inherited its full-width container, which made
   every card ~11% larger than the residential ones. 7a798b8 is the widget's Elementor id.
   The doubled class matches the specificity of Elementor's own "width-inherit" rule, which
   otherwise wins and forces max-width back to 100%. */
.elementor-22501 .elementor-element.elementor-element-7a798b8.elementor-widget {
	width: 100%;
	max-width: 1260px;
	margin-left: auto;
	margin-right: auto;
}

/* Eight items plus the logo leaves little room at laptop widths; buy the pixels back
   from the padding rather than shrinking the type. */
@media (min-width: 992px) and (max-width: 1399px) {
	.houzez-elementor-menu > li > a,
	.main-ele-nav a.nav-link {
		padding-left: 9px;
		padding-right: 9px;
	}
}