/**
 * Footer CSS — log-core
 * 4-column dark footer matching home_page2.html reference.
 */

footer.log-site-footer {
	background: var(--plum-950);
	color: #e6dbe0;
	padding: 64px 24px 0;
}

/* Container constraint shared by top + bottom */
.log-footer-container {
	max-width: 1220px;
	margin: 0 auto;
}

/* Top grid */
.log-footer-top {
	padding-bottom: 44px;
	border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.log-footer-grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
	gap: 46px;
}

/* Brand column */
.log-footer-tagline {
	font-size: 13.5px;
	line-height: 1.7;
	color: #c6b3bc;
	margin-top: 14px;
	max-width: 300px;
}

/* Logo in footer */
.log-footer-logo {
	display: flex;
	align-items: center;
	gap: 12px;
	font-family: var(--display);
	font-size: 22px;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
}

.log-footer-logo .log-logo-mark {
	width: 38px;
	height: 38px;
}

.log-footer-logo b {
	color: var(--sage-400);
	font-weight: 700;
}

/* Social */
.log-footer-social {
	display: flex;
	gap: 10px;
	margin-top: 20px;
}

.log-fs-btn {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .07);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 700;
	color: #e9dde2;
	text-decoration: none;
	transition: all .25s var(--ease);
}

.log-fs-btn:hover {
	background: var(--sage-500);
	color: var(--plum-950);
}

.log-fs-btn svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

/* Newsletter */
.log-footer-news {
	margin-top: 24px;
}

.log-footer-news p {
	font-size: 13px;
	color: #c6b3bc;
	margin-bottom: 10px;
}

/* Newsletter — real Contact Form 7 markup (form#log-fn-cf7, fields
 * mr-nl-email / mr-nl-submit are CF7's own template class hooks). */
.log-fn-cf7 {
	display: flex;
	align-items: stretch;
}

/* Pill background/padding lives on the input row itself, not the <form> —
 * .wpcf7-response-output is a sibling of this <p>, not a child, so it no
 * longer inherits the pill's rounded background/padding. It renders as its
 * own full-width block after the pill instead of being crammed inside it. */
.log-fn-cf7 p {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 0;
	border-radius: var(--r-pill);
	background: rgba(255, 255, 255, .08);
	padding: 5px;
}

.log-fn-cf7 .wpcf7-form-control-wrap {
	flex: 1;
	display: block;
}

.log-fn-cf7 br {
	display: none;
}

.log-fn-cf7 .mr-nl-email {
	width: 100%;
	background: none;
	border: none;
	color: #fff;
	caret-color: #fff;
	font-size: 13px;
	padding: 10px 14px;
	border-radius: var(--r-pill);
	outline: none;
	transition: box-shadow .2s var(--ease);
}

.log-fn-cf7 .mr-nl-email::placeholder {
	color: #a98fa0;
}

.log-fn-cf7 .mr-nl-email:focus {
	background: inherit;
	color: #fff;
}

/* Chrome/Edge autofill forces its own white/yellow background + black text
 * (ignores color/background entirely, one of the few things !important on
 * a normal declaration can't override) — this is the standard workaround:
 * a huge inset box-shadow paints over the forced background, and
 * -webkit-text-fill-color (not color) is what autofill actually respects. */
.log-fn-cf7 .mr-nl-email:-webkit-autofill,
.log-fn-cf7 .mr-nl-email:-webkit-autofill:focus,
.log-fn-cf7 .mr-nl-email:-webkit-autofill:hover {
	-webkit-text-fill-color: #fff;
	-webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, .08) inset;
	transition: background-color 5000s ease-in-out 0s;
}

.log-fn-cf7 .mr-nl-submit {
	background: var(--sage-500);
	color: var(--plum-950);
	font-weight: 700;
	font-size: 12.5px;
	padding: 10px 18px;
	border-radius: var(--r-pill);
	border: none;
	cursor: pointer;
	transition: background .25s var(--ease);
	font-family: var(--body);
	flex-shrink: 0;
	white-space: nowrap;
}

.log-fn-cf7 .mr-nl-submit:hover {
	background: var(--sage-400);
}

/* issues-docx.css has an unscoped, sitewide
 * ".wpcf7-form.submitting .wpcf7-submit{color:transparent!important}" rule
 * (written for a different form's spinner-replaces-label pattern) that also
 * matches this footer submit button via its shared .wpcf7-submit class. CF7
 * adds .submitting to the form + disables the button while its AJAX request
 * is in flight, and since we hide .wpcf7-spinner entirely below, that rule
 * left the button blank — neither label nor spinner visible. Its selector
 * has 3 classes; this one needs 4+ to out-specificity it despite matching
 * !important, so both class names are repeated. */
.log-fn-cf7.log-fn-cf7.submitting .mr-nl-submit.wpcf7-submit,
.log-fn-cf7 .mr-nl-submit.wpcf7-submit:disabled {
	color: var(--plum-950) !important;
	background: var(--sage-500);
	opacity: 1;
}

.log-fn-cf7 .wpcf7-spinner {
	display: none;
}

/* Per-field inline tip duplicates the same message already shown, more
 * clearly, in the styled .wpcf7-response-output box below — avoid showing
 * the same error twice. */
.log-fn-cf7 .wpcf7-not-valid-tip {
	display: none !important;
}

/* CF7's own plugin CSS (.wpcf7 form.invalid/.unaccepted/.payment-required
 * .wpcf7-response-output) beats a plain .log-fn-cf7 override on specificity
 * alone (it adds a `form` type selector) — !important is the only clean
 * way to override a plugin default here, matching the border-color and
 * background rules it also otherwise applies. */
.log-fn-cf7 .wpcf7-response-output {
	/* issues-fixes.css sets an unscoped ".wpcf7-response-output{order:-1}"
	 * for the Contact Us page's own form (Issue #21) — it matches every
	 * CF7 form sitewide, including this one, and flips the notice above
	 * the pill-shaped input row here, rendering as a disconnected floating
	 * bubble. .log-fn-cf7 .wpcf7-response-output already has higher
	 * specificity than the unscoped rule, so this wins without !important
	 * and puts it back after the input row where it visually belongs. */
	order: 0;
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin: 8px 0 0 !important;
	font-size: 12px;
	color: #c6b3bc;
	border: 1px solid rgba(255, 255, 255, .15) !important;
	background: rgba(255, 255, 255, .05);
	border-radius: var(--r-md, 10px);
	padding: 8px 12px !important;
}

.log-fn-cf7.invalid .wpcf7-response-output,
.log-fn-cf7 .wpcf7-response-output.wpcf7-validation-errors {
	color: #ffb0b0;
	border-color: rgba(255, 90, 90, .35) !important;
	background: rgba(255, 90, 90, .08);
}

.log-fn-cf7.sent .wpcf7-response-output,
.log-fn-cf7 .wpcf7-response-output.wpcf7-mail-sent-ok {
	color: var(--sage-400);
	border-color: rgba(94, 238, 192, .35) !important;
	background: rgba(94, 238, 192, .08);
}

/* Link columns */
.log-footer-col h5,
.log-footer-heading {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #fff;
	margin-bottom: 7px;
	margin-top: 0;
}

.log-footer-col ul,
.log-footer-links {
	display: flex;
	flex-direction: column;
	list-style: none;
	margin: 0;
	padding: 0;
}

.log-footer-col ul li,
.log-footer-links li {
	margin: 0;
}

.log-footer-col ul a,
.log-footer-links a {
	font-size: 13.5px;
	color: #c6b3bc;
	text-decoration: none;
	transition: color .25s var(--ease);
}

.log-footer-col ul a:hover {
	color: var(--sage-400);
}

/* Contact column */
.log-ft-contact-line,
.log-footer-contact-item {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13px;
	color: #c6b3bc;
	margin-bottom: 13px;
	line-height: 1.5;
}

.log-ft-contact-line svg,
.log-footer-contact-item svg {
	width: 15px;
	height: 15px;
	color: var(--sage-400);
	flex-shrink: 0;
	margin-top: 2px;
	stroke: currentColor;
	fill: none;
	stroke-width: 1.8;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Payment chips */
.log-pay-row {
	display: flex;
	gap: 8px;
	margin-top: 4px;
	flex-wrap: wrap;
}

.log-pay-chip {
	background: rgba(255, 255, 255, .08);
	padding: 6px 12px;
	border-radius: 6px;
	font-size: 11px;
	font-weight: 800;
	color: #e9dde2;
}

/* Bottom bar */
.log-footer-bottom {
	font-size: 12.5px;
	color: #a98fa0;
}

.log-footer-bottom-row {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding: 26px 0;
}

.log-footer-bottom a,
.log-footer-links-bar a {
	color: #a98fa0;
	text-decoration: none;
	transition: color .2s;
}

.log-footer-bottom a:hover,
.log-footer-links-bar a:hover {
	color: var(--sage-400);
}

.log-footer-links-bar {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

/* Back to top */
.log-to-top {
	position: fixed;
	bottom: 26px;
	right: 26px;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--plum-700);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--shadow-md);
	opacity: 0;
	transform: translateY(10px);
	transition: all .3s var(--ease);
	z-index: 90;
	border: none;
	cursor: pointer;
}

.log-to-top.show {
	opacity: 1;
	transform: translateY(0);
}

.log-to-top:hover {
	background: var(--sage-500);
	color: var(--plum-950);
}

.log-to-top svg {
	width: 18px;
	height: 18px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* Responsive */
@media (max-width: 1080px) {
	.log-footer-grid {
		grid-template-columns: 1fr 1fr;
		gap: 32px;
	}
}

@media (max-width: 600px) {
	.log-footer-grid {
		grid-template-columns: 1fr;
	}

	.log-footer-bottom-row {
		flex-direction: column;
		align-items: center;
		text-align: center;
		gap: 8px;
	}

	.log-fn-cf7 {
		flex-direction: column;
		border-radius: var(--r-md);
		padding: 8px;
	}

	.log-fn-cf7 p {
		flex-direction: column;
	}

	.log-fn-cf7 .mr-nl-email {
		padding: 10px 12px;
	}

	.log-fn-cf7 .mr-nl-submit {
		border-radius: var(--r-md);
		padding: 11px 18px;
		width: 100%;
		margin-top: 6px;
	}
}