/* ---------------------------------------------------------------------------
 * "Plate v1 Footer" (Royal Addons footer template, post 32424).
 * Built from Royal Addons widgets (Logo, Button, Page List, Separator) plus core
 * Elementor Heading / Text Editor inside Elementor containers. Colours, type and
 * spacing live in the widget controls; this file only adds the details the
 * controls can't express (pseudo-elements, filters) so the template matches the
 * hand-built .plate-footer on the home designs.
 * Place it on a page with the Royal "Elementor Template" widget.
 * ------------------------------------------------------------------------- */

.plate-v1-footer {
	--pk-accent: #966954;
	--pk-accent-tint: #D9B7A4;
	position: relative;
}

/* Thin warm accent line along the top edge */
.plate-v1-footer::before {
	content: "";
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--pk-accent), var(--pk-accent-tint));
	pointer-events: none;
}

/* Logo is a dark PNG: knock it to white on the dark ground */
.plate-v1-footer .wpr-logo img {
	filter: brightness(0) invert(1);
	height: auto;
}

/* Column headings: short accent underline */
.plate-v1-footer .plate-v1-footer-col .elementor-heading-title {
	position: relative;
	display: inline-block;
	padding-bottom: 10px;
	opacity: 0.9;
}
.plate-v1-footer .plate-v1-footer-col .elementor-heading-title::after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 28px; height: 2px;
	background: var(--pk-accent);
}

/* Page List links: soft by default, underline sweeps in on hover */
.plate-v1-footer .wpr-page-list-item {
	opacity: 0.78;
	transition: opacity 0.2s ease;
}
.plate-v1-footer .wpr-page-list-item:hover { opacity: 1; }
.plate-v1-footer .wpr-page-list-item a {
	position: relative;
	text-decoration: none;
}
.plate-v1-footer .wpr-page-list-item a[href]::after {
	content: "";
	position: absolute;
	left: 0; bottom: -2px;
	width: 100%; height: 1px;
	background: var(--pk-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}
.plate-v1-footer .wpr-page-list-item a[href]:hover::after { transform: scaleX(1); }

/* Visit rows: icon sits on the first text line */
.plate-v1-footer .plate-v1-footer-visit .wpr-page-list-item-icon { margin-top: 3px; }

/* Social buttons: fixed 40px circle with the icon centred, lift on hover.
 * Elementor's per-widget CSS (icon-position-right) adds a 12px icon margin meant for a text
 * label and sizes the link like a text button; those rules are more specific than ours,
 * so the overrides below use !important. */
.plate-v1-footer .plate-v1-footer-social .wpr-button-wrap { width: 40px; max-width: 40px; }
.plate-v1-footer .plate-v1-footer-social .wpr-button {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 40px !important;
	height: 40px;
	padding: 0 !important;
	box-sizing: border-box;
	line-height: 1;
	transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.plate-v1-footer .plate-v1-footer-social .wpr-button:hover { transform: translateY(-2px); }
.plate-v1-footer .plate-v1-footer-social .wpr-button-content,
.plate-v1-footer .plate-v1-footer-social .wpr-button-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1;
}
.plate-v1-footer .plate-v1-footer-social .wpr-button-icon svg {
	display: block;
	width: 16px;
	height: 16px;
}

/* Order Online CTA: arrow nudges right on hover, whole button lifts */
.plate-v1-footer .plate-v1-footer-brand .wpr-button {
	transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.plate-v1-footer .plate-v1-footer-brand .wpr-button-icon { transition: transform 0.25s ease; }
.plate-v1-footer .plate-v1-footer-brand .wpr-button:hover { transform: translateY(-2px); }
.plate-v1-footer .plate-v1-footer-brand .wpr-button:hover .wpr-button-icon { transform: translateX(3px); }

/* Tablet / mobile: brand block is centred by the container controls; keep its
 * text and tagline centred too, and let very narrow phones stack the columns. */
@media (max-width: 1024px) {
	.plate-v1-footer .plate-v1-footer-brand { border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
	.plate-v1-footer .plate-v1-footer-brand .elementor-widget-text-editor { text-align: center; }
}
@media (max-width: 380px) {
	.plate-v1-footer .plate-v1-footer-col { width: 100% !important; }
}