/**
 * About Us and Contact Us (page-about-us.php, page-contact-us.php).
 * Loaded after giftwise.css on those two pages only. Giftwise tokens only: no raw colors, sizes or radii.
 */

.vlu-trust { color: var(--bds-on-surface); }

.vlu-trust a:not(.gw-button) {
	color: var(--bds-primary);
	text-decoration: underline;
	text-underline-offset: 0.2em;
}

/* Page header */
.vlu-trust-hero {
	display: grid;
	gap: var(--bds-space-3);
	padding-block: var(--bds-space-8) var(--bds-space-2);
}

.vlu-trust-hero h1 {
	margin: 0;
	color: var(--bds-secondary);
	font: var(--bds-text-display-lg-weight) var(--bds-text-display-lg) / var(--bds-text-display-lg-lh) var(--bds-font-display);
}

.vlu-trust-lede {
	max-width: calc(var(--bds-space-24) * 7);
	margin: 0;
	color: var(--bds-on-surface-variant);
	font: var(--bds-text-body-lg-weight) var(--bds-text-body-lg) / var(--bds-text-body-lg-lh) var(--bds-font-body);
}

.vlu-trust-h2 {
	margin: 0 0 var(--bds-space-4);
	color: var(--bds-secondary);
	font: var(--bds-text-headline-md-weight) var(--bds-text-headline-md) / var(--bds-text-headline-md-lh) var(--bds-font-display);
}

.vlu-trust p {
	margin: 0 0 var(--bds-space-3);
	font: var(--bds-text-body-lg-weight) var(--bds-text-body-lg) / var(--bds-text-body-lg-lh) var(--bds-font-body);
}

.vlu-trust-muted { color: var(--bds-on-surface-variant); }

/* Unconfirmed fact. Never ships: go-live needs 0 of these on the rendered page. */
.vlu-confirm {
	display: block;
	padding: var(--bds-space-3) var(--bds-space-4);
	border-left: var(--bds-space-1) solid var(--bds-warning);
	border-radius: var(--bds-radius-sm);
	background: var(--bds-surface-container-high);
	color: var(--bds-on-surface);
	font: var(--bds-text-body-sm-weight) var(--bds-text-body-sm) / var(--bds-text-body-sm-lh) var(--bds-font-body);
}

/* Real catalog photos */
.vlu-trust-products {
	display: grid;
	grid-template-columns: repeat(var(--bds-grid-cols), minmax(0, 1fr));
	gap: var(--bds-grid-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.vlu-trust-products a {
	display: grid;
	gap: var(--bds-space-2);
	color: var(--bds-on-surface) !important;
	text-decoration: none !important;
}

.vlu-trust-products img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: var(--bds-radius-card);
	background: var(--bds-surface-container);
}

.vlu-trust-products span { font: 500 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body); }

/* Two columns from desktop */
.vlu-trust-split {
	display: grid;
	gap: var(--bds-space-10);
}

@media (min-width: 1024px) {
	.vlu-trust-split { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bds-space-16); }
}

/* How it is made */
.vlu-trust-steps {
	display: grid;
	gap: var(--bds-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 768px) {
	.vlu-trust-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bds-grid-gap); }
}

@media (min-width: 1024px) {
	.vlu-trust-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.vlu-trust-steps li,
.vlu-trust-card {
	padding: var(--bds-space-6);
	border: 1px solid var(--bds-outline-variant);
	border-radius: var(--bds-radius-card);
	background: var(--bds-surface-container-lowest);
}

.vlu-trust-steps .gw-icon {
	width: var(--bds-space-6);
	height: var(--bds-space-6);
	margin-bottom: var(--bds-space-3);
	color: var(--bds-primary);
}

.vlu-trust-steps h3 {
	margin: 0 0 var(--bds-space-2);
	color: var(--bds-secondary);
	font: 600 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body);
}

.vlu-trust-steps p { margin: 0; font-size: var(--bds-text-body-md); line-height: var(--bds-text-body-md-lh); }

/* Shopping with us */
.vlu-trust-facts {
	display: grid;
	gap: var(--bds-space-6);
	margin: 0;
	padding: 0;
	list-style: none;
}

@media (min-width: 1024px) {
	.vlu-trust-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.vlu-trust-facts li { display: grid; gap: var(--bds-space-2); align-content: start; }
.vlu-trust-facts strong { color: var(--bds-secondary); font: 600 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body); }
.vlu-trust-facts span { font: var(--bds-text-body-md-weight) var(--bds-text-body-md) / var(--bds-text-body-md-lh) var(--bds-font-body); }
.vlu-trust-facts .vlu-confirm { margin-top: var(--bds-space-2); }

/* Policy links: each one a full tap target */
.vlu-policy-links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--bds-space-1) var(--bds-space-6);
	margin: 0 0 var(--bds-space-6);
	padding: 0;
	list-style: none;
}

.vlu-policy-links a {
	display: inline-flex;
	align-items: center;
	min-height: var(--gw-tap);
	font: 500 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body);
}

.vlu-trust-actions { display: flex; flex-wrap: wrap; gap: var(--bds-space-3); margin: 0; }

/* Contact layout: form first on phones, form + help side by side on desktop */
.vlu-contact-layout {
	display: grid;
	gap: var(--bds-space-6);
	padding-block: var(--bds-space-6) var(--bds-space-12);
}

@media (min-width: 1024px) {
	.vlu-contact-layout { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--bds-space-10); align-items: start; }
}

.vlu-contact-aside { display: grid; gap: var(--bds-space-6); }

/* Quick answers */
.vlu-faq { border-bottom: 1px solid var(--bds-outline-variant); }
.vlu-faq:last-child { border-bottom: 0; }

.vlu-faq summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--bds-space-3);
	min-height: var(--gw-tap);
	padding-block: var(--bds-space-2);
	color: var(--bds-secondary);
	font: 600 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body);
	list-style: none;
	cursor: pointer;
}

.vlu-faq summary::-webkit-details-marker { display: none; }
.vlu-faq summary::after { content: "+"; color: var(--bds-primary); font: 600 var(--bds-text-headline-md) / 1 var(--bds-font-body); }
.vlu-faq[open] summary::after { content: "–"; }
.vlu-faq p { font-size: var(--bds-text-body-md); line-height: var(--bds-text-body-md-lh); }

/* Business details */
.vlu-details {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--bds-space-3) var(--bds-space-4);
	align-items: baseline;
	margin: 0;
	font: var(--bds-text-body-md-weight) var(--bds-text-body-md) / var(--bds-text-body-md-lh) var(--bds-font-body);
}

.vlu-details dt { color: var(--bds-secondary); font-weight: 600; }
.vlu-details dd { margin: 0; }
.vlu-details a { display: inline-flex; align-items: center; min-height: var(--gw-tap); }
.vlu-address { font-style: normal; }
.vlu-trust-note { margin: var(--bds-space-4) 0 0; }

/* WPForms contact form, themed through its own custom properties */
.vlu-contact-form-card .wpforms-container {
	--wpforms-field-border-color: var(--bds-outline);
	--wpforms-field-background-color: var(--bds-surface-container-lowest);
	--wpforms-field-text-color: var(--bds-on-surface);
	--wpforms-field-border-radius: var(--bds-radius-input);
	--wpforms-field-size-font-size: max(16px, var(--bds-text-body-md));
	--wpforms-field-size-input-height: var(--gw-control-h);
	--wpforms-label-color: var(--bds-on-surface);
	--wpforms-label-sublabel-color: var(--bds-on-surface-variant);
	--wpforms-label-error-color: var(--bds-error);
	--wpforms-button-background-color: var(--bds-primary);
	--wpforms-button-border-color: var(--bds-primary);
	--wpforms-button-text-color: var(--bds-on-primary);
	--wpforms-button-border-radius: var(--bds-radius-button);
	--wpforms-button-size-height: var(--gw-button-h);
	margin: 0;
}

.vlu-contact-form-card .wpforms-field { padding-block: var(--bds-space-2); }

.vlu-contact-form-card .wpforms-field input,
.vlu-contact-form-card .wpforms-field select,
.vlu-contact-form-card .wpforms-field textarea {
	width: 100%;
	max-width: none;
}

.vlu-contact-form-card .wpforms-field-label {
	color: var(--bds-on-surface);
	font: 600 var(--bds-text-label-lg) / var(--bds-text-label-lg-lh) var(--bds-font-body);
}

.vlu-contact-form-card .wpforms-field-description,
.vlu-contact-form-card .wpforms-field-limit-text {
	color: var(--bds-on-surface-variant);
	font: var(--bds-text-body-sm-weight) var(--bds-text-body-sm) / var(--bds-text-body-sm-lh) var(--bds-font-body);
}

.vlu-contact-form-card .wpforms-submit-container { padding-top: var(--bds-space-4); }
.vlu-contact-form-card .wpforms-submit { width: 100%; }

@media (min-width: 768px) {
	.vlu-contact-form-card .wpforms-submit { width: auto; min-width: calc(var(--bds-space-24) * 2); }
}

/* WPForms styles its own success box with div[submit-success] > … (higher specificity, loaded later). */
.vlu-contact-form-card .wpforms-confirmation-container-full {
	padding: var(--bds-space-6) !important;
	border: 1px solid var(--bds-primary) !important;
	border-radius: var(--bds-radius-card) !important;
	background: var(--bds-primary-container) !important;
	color: var(--bds-on-surface) !important;
}

.vlu-contact-form-card .wpforms-confirmation-container-full p:last-child { margin-bottom: 0; }

.vlu-contact-form-card label.wpforms-error,
.vlu-contact-form-card em.wpforms-error { color: var(--bds-error); }