/**
 * Walden Wall Co Child: site chrome (shell, sections, header, hero, CTA bands, footer).
 * Tokens come from theme.css.
 */

/* ===== Shell and sections ===== */
.wwc-shell {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--wwc-shell) + var(--wwc-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--wwc-gutter);
}

.wwc-section { padding-block: var(--wwc-sec-y); position: relative; }
.wwc-bg-cream { background-color: var(--wwc-cream); }
.wwc-bg-white { background-color: var(--wwc-white); }
.wwc-bg-navy { background-color: var(--wwc-navy); }
.wwc-bg-navy-deep { background-color: var(--wwc-navy-deep); }

.wwc-on-dark, .wwc-on-dark p, .wwc-bg-navy, .wwc-bg-navy-deep { color: var(--wwc-on-dark); }
.wwc-on-dark h1, .wwc-on-dark h2, .wwc-on-dark h3, .wwc-on-dark h4,
.wwc-on-dark .elementor-heading-title,
.wwc-bg-navy .elementor-heading-title, .wwc-bg-navy-deep .elementor-heading-title { color: var(--wwc-white); }

/* Skip link (printed by Hello Elementor) */
.wwc-theme .skip-link:focus,
.wwc-theme .skip-link:focus-visible {
	position: fixed;
	top: 12px;
	left: 12px;
	z-index: 100000;
	clip: auto;
	clip-path: none;
	width: auto;
	height: auto;
	padding: 12px 20px;
	background: var(--wwc-white);
	color: var(--wwc-navy);
	font: 700 15px/1 var(--wwc-font-body);
	border-radius: var(--wwc-r-pill);
	outline: 3px solid var(--wwc-amber);
	text-decoration: none;
}

/* ===== Header: transparent over hero, sticky navy on scroll ===== */
.wwc-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 999;
	color: var(--wwc-white);
	background-color: transparent;
	border-bottom: 1px solid transparent;
	transition: background-color var(--wwc-dur) var(--wwc-ease), box-shadow var(--wwc-dur) var(--wwc-ease), padding var(--wwc-dur) var(--wwc-ease);
}
.admin-bar .wwc-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .wwc-header { top: 46px; } }

.wwc-header.is-solid,
.wwc-header.is-open {
	background-color: var(--wwc-navy);
	box-shadow: 0 8px 24px rgba(17, 27, 48, .18);
	border-bottom-color: rgba(255, 255, 255, .08);
}

.wwc-header__inner {
	display: flex;
	align-items: center;
	gap: 40px;
	min-height: var(--wwc-header-h);
	transition: min-height var(--wwc-dur) var(--wwc-ease);
}
.wwc-header.is-solid .wwc-header__inner { min-height: 72px; }

.wwc-brand { display: flex; flex-direction: column; line-height: 1.1; text-decoration: none; color: inherit; flex: none; }
.wwc-brand img { max-height: 48px; width: auto; }
.wwc-brand__name { font: 800 26px/1.1 var(--wwc-font-heading); letter-spacing: -0.02em; color: var(--wwc-white); }
.wwc-brand__tag { font: 400 13px/1.3 var(--wwc-font-body); color: var(--wwc-on-dark-muted); }

.wwc-nav { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 32px; }
.wwc-header__inner > nav { margin-left: auto; }
.wwc-nav a { color: var(--wwc-white); font: 500 16px/1.2 var(--wwc-font-body); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.wwc-nav a:hover { border-bottom-color: var(--wwc-amber); }

.wwc-nav-toggle {
	display: none;
	margin-left: auto;
	background: transparent;
	color: var(--wwc-white);
	border: 1.5px solid rgba(255, 255, 255, .6);
	border-radius: var(--wwc-r-pill);
	padding: 9px 16px;
	font: 600 14px/1 var(--wwc-font-body);
	cursor: pointer;
}
.wwc-nav-mobile { display: none; padding-bottom: 20px; }
.wwc-nav-mobile.is-open { display: block; }
.wwc-nav-mobile .wwc-nav { flex-direction: column; align-items: stretch; gap: 0; }
.wwc-nav-mobile .wwc-nav a { display: block; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .12); }

@media (max-width: 900px) {
	.wwc-header__inner > nav { display: none; }
	.wwc-header__cta { display: none; }
	.wwc-nav-toggle { display: inline-flex; }
	.wwc-header__inner { gap: 12px; }
	.wwc-brand__name { font-size: 22px; }
	.wwc-brand__tag { font-size: 12px; }
}

/* Pages without a hero: keep header solid and push content below it. */
body.wwc-no-hero .wwc-header { background-color: var(--wwc-navy); }
body.wwc-no-hero #content,
body.wwc-no-hero .site-main { padding-top: var(--wwc-header-h); }

/* ===== Hero ===== */
.wwc-hero {
	position: relative;
	min-height: 800px;
	display: flex;
	align-items: center;
	padding-top: calc(var(--wwc-header-h) + 56px);
	padding-bottom: 96px;
	color: var(--wwc-white);
	background-color: var(--wwc-navy);
	background-size: cover;
	background-position: center;
	overflow: hidden;
}
/* If you set the overlay in Elementor (Background Overlay), skip this class. */
.wwc-hero--overlay::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(17, 27, 48, .95) 0%, rgba(27, 42, 74, .88) 50%, rgba(27, 42, 74, .6) 100%);
	pointer-events: none;
}
.wwc-hero > * { position: relative; z-index: 1; }
.wwc-hero h1, .wwc-hero .elementor-heading-title { color: var(--wwc-white); max-width: 860px; }
.wwc-hero__sub, .wwc-hero__sub p { font-size: 21px; line-height: 1.6; color: var(--wwc-on-dark); max-width: 640px; }
.wwc-eyebrow, .wwc-eyebrow .elementor-heading-title {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font: 600 13px/1.3 var(--wwc-font-mono);
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--wwc-amber-on-dark);
}
.wwc-eyebrow::before { content: ""; width: 36px; height: 3px; border-radius: 3px; background: var(--wwc-amber); flex: none; }
.wwc-trust, .wwc-trust p {
	font-size: 15px;
	color: var(--wwc-on-dark-muted);
	border-top: 1px solid rgba(255, 255, 255, .22);
	padding-top: 22px;
	max-width: 640px;
}
@media (max-width: 767px) {
	.wwc-hero { min-height: 0; padding-top: calc(var(--wwc-header-h) + 40px); padding-bottom: 72px; }
	.wwc-hero__sub, .wwc-hero__sub p { font-size: 18px; }
	.wwc-trust, .wwc-trust p { font-size: 14px; }
}

/* ===== Soft CTA band inside a section (navy, 16px) ===== */
.wwc-soft-cta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	background: var(--wwc-navy);
	color: var(--wwc-white);
	border-radius: var(--wwc-r-card);
	padding: 28px 36px;
	font-size: 19px;
}
.wwc-soft-cta p { margin: 0; color: var(--wwc-white); }
@media (max-width: 767px) { .wwc-soft-cta { flex-direction: column; align-items: flex-start; padding: 24px; } }

/* ===== Hidden-until-real note (editor only; do not publish) ===== */
.wwc-hidden-note {
	border: 2px dashed var(--wwc-amber);
	background: #FFF4E0;
	border-radius: var(--wwc-r-card);
	padding: 18px 22px;
	font-size: 15px;
	color: var(--wwc-ink);
}

/* ===== Footer ===== */
.wwc-footer { background: var(--wwc-navy-deep); color: var(--wwc-on-dark-muted); padding: 72px 0 28px; font-size: 15px; }
.wwc-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 48px; }
.wwc-footer__title, .wwc-footer h3, .wwc-footer h4 {
	font: 600 12px/1.3 var(--wwc-font-mono);
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--wwc-white);
	margin: 0 0 16px;
}
.wwc-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.wwc-footer a { color: var(--wwc-on-dark-muted); text-decoration: none; }
.wwc-footer a:hover { color: var(--wwc-white); text-decoration: underline; }
.wwc-footer address { font-style: normal; display: grid; gap: 10px; }
.wwc-footer__blurb { margin-top: 16px; max-width: 340px; line-height: 1.6; }
.wwc-footer__bottom {
	margin-top: 48px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 12px 20px;
	font-size: 13.5px;
}
.wwc-footer__bottom p { margin: 0; }
@media (max-width: 900px) { .wwc-footer__grid { grid-template-columns: 1fr 1fr; gap: 32px; } }
@media (max-width: 600px) { .wwc-footer__grid { grid-template-columns: 1fr; } }
