/**
 * Site chrome — the header and footer that wrap every page.
 *
 * Divi paints both from Theme Options defaults that predate this brand: a flat
 * white bar with blue links, and a dark widget footer. Everything here is
 * scoped to `body:not(.et-fb)` so the Visual Builder's own chrome is left
 * alone, and to Divi's own ids so specificity lands without !important.
 */

/* ==========================================================================
   1. Header
   ========================================================================== */

body:not(.et-fb) #main-header {
	background-color: rgba(246, 243, 236, 0.92);
	/* The header is fixed over content that scrolls under it, so it needs to be
	   opaque enough to read against — the blur does that without hiding the
	   page. Browsers without backdrop-filter fall back to the 92% wash above,
	   which is already legible. */
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	backdrop-filter: saturate(1.4) blur(14px);
	border-bottom: 1px solid rgba(31, 42, 46, 0.08);
	box-shadow: none;
	transition:
		background-color 0.4s var(--dalua-ease),
		box-shadow 0.4s var(--dalua-ease),
		border-color 0.4s var(--dalua-ease);
}

/* Divi adds .et-fixed-header once the page has scrolled. Lifting the shadow
   only then keeps the bar flat against the hero and gives it depth exactly
   when it starts to overlap content. */
body:not(.et-fb).et-fixed-header #main-header {
	background-color: rgba(246, 243, 236, 0.97);
	border-bottom-color: rgba(31, 42, 46, 0.1);
	box-shadow: 0 6px 24px -14px rgba(31, 42, 46, 0.45);
}

body:not(.et-fb) #main-header .container {
	padding-block: 0.35rem;
}

/* Divi emits width="43" height="43" on the logo regardless of the real file.
   The wordmark is 1314x438 (3:1), so both axes are forced back to auto — with
   neither attribute winning, the browser falls back to the image's own ratio
   and max-block-size does the sizing. */
body:not(.et-fb) #logo {
	inline-size: auto;
	block-size: auto;
	max-block-size: 62px;
	max-inline-size: 100%;
	transition: max-block-size 0.4s var(--dalua-ease);
}

body:not(.et-fb).et-fixed-header #logo {
	max-block-size: 46px;
}

/* --------------------------------------------------------------------------
   Primary navigation
   -------------------------------------------------------------------------- */

body:not(.et-fb) #top-menu li {
	padding-inline-end: 1.6rem;
}

body:not(.et-fb) #top-menu li:last-child {
	padding-inline-end: 0;
}

body:not(.et-fb) #top-menu li a {
	position: relative;
	padding-block: 0.35rem;
	font-family: var(--dalua-font-body);
	font-size: 0.78rem;
	font-weight: 400;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--dalua-ink-muted);
	opacity: 1;
	transition: color 0.3s var(--dalua-ease);
}

/* The underline grows from the left rather than fading in, so the hover reads
   as a deliberate mark instead of a colour change. */
body:not(.et-fb) #top-menu li a::after {
	content: "";
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	inline-size: 100%;
	block-size: 1px;
	background: var(--dalua-sage-deep);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.35s var(--dalua-ease);
}

body:not(.et-fb) #top-menu li a:hover,
body:not(.et-fb) #top-menu li.current-menu-item > a,
body:not(.et-fb) #top-menu li.current_page_item > a {
	color: var(--dalua-night);
	opacity: 1;
}

body:not(.et-fb) #top-menu li a:hover::after,
body:not(.et-fb) #top-menu li.current-menu-item > a::after,
body:not(.et-fb) #top-menu li.current_page_item > a::after {
	transform: scaleX(1);
}

/* --------------------------------------------------------------------------
   Mobile navigation
   -------------------------------------------------------------------------- */

body:not(.et-fb) .et_mobile_menu {
	background-color: var(--dalua-plaster);
	border-top: 3px solid var(--dalua-sage);
	box-shadow: 0 18px 32px -22px rgba(31, 42, 46, 0.5);
}

body:not(.et-fb) .et_mobile_menu li a {
	font-family: var(--dalua-font-body);
	font-size: 0.82rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--dalua-ink);
	border-block-end-color: rgba(31, 42, 46, 0.08);
}

body:not(.et-fb) .mobile_nav .select_page,
body:not(.et-fb) .mobile_menu_bar::before {
	color: var(--dalua-night);
}

/* ==========================================================================
   2. Footer
   The contact block is styled in sections.css — it was written for the bottom
   of the home page and moved here wholesale. Only the surrounding shell and
   the legal bar are new.
   ========================================================================== */

body:not(.et-fb) #main-footer.dalua-footer {
	background: var(--dalua-night);
	padding: 0;
}

/* Divi's footer heading defaults are sized for widget titles. */
body:not(.et-fb) .dalua-footer h2 {
	padding-block-end: 0;
}

body:not(.et-fb) .dalua-footer p {
	padding-block-end: 0;
}

/* Four fields now instead of three: address, hours, contact, Instagram. Two
   columns keeps the list from running taller than the map beside it. */
@media (min-width: 34rem) {
	.dalua-footer .dalua-contact__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.5rem 2rem;
	}
}

.dalua-footer__bar {
	border-block-start: 1px solid rgba(246, 243, 236, 0.12);
	background: rgba(0, 0, 0, 0.18);
}

.dalua-footer__bar-inner {
	inline-size: min(72rem, 100%);
	margin-inline: auto;
	padding-block: 1.35rem;
	padding-inline: var(--dalua-gutter);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem 1.5rem;
}

.dalua-footer__legal {
	margin: 0;
	font-family: var(--dalua-font-body);
	font-size: 0.74rem;
	font-weight: 300;
	letter-spacing: 0.08em;
	line-height: 1.6;
	color: rgba(246, 243, 236, 0.5);
}

body:not(.et-fb) .dalua-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

body:not(.et-fb) .dalua-footer__links li {
	margin: 0;
	padding: 0;
}

body:not(.et-fb) .dalua-footer__links a {
	font-family: var(--dalua-font-body);
	font-size: 0.72rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(246, 243, 236, 0.62);
	transition: color 0.3s var(--dalua-ease);
}

body:not(.et-fb) .dalua-footer__links a:hover,
body:not(.et-fb) .dalua-footer__links a:focus-visible,
body:not(.et-fb) .dalua-footer__links .current-menu-item > a {
	color: var(--dalua-sage);
}