/*
 * Vatan Foods contact page.
 */

.fusion-body .vatan-contact-page {
	background: var(--vatan-cream);
	color: var(--vatan-text);
	margin-inline: calc(50% - 50vw);
	overflow-x: hidden;
	width: 100vw;
}

.fusion-body .vatan-contact-hero {
	background: linear-gradient(135deg, rgba(7, 17, 17, 0.96), rgba(21, 38, 37, 0.96));
	color: var(--vatan-white);
	padding-block: clamp(4rem, 8vw, 6.5rem);
}

.fusion-body .vatan-contact-hero h1 {
	color: var(--vatan-white);
	font-size: clamp(2.35rem, 5vw, 4.6rem);
	line-height: 1.08;
	margin-bottom: 0.8rem;
	max-width: 56rem;
}

.fusion-body .vatan-contact-hero p {
	color: #dce2de;
	font-size: clamp(1.05rem, 1.5vw, 1.2rem);
	line-height: 1.75;
	max-width: 50rem;
}

.fusion-body .vatan-contact-info,
.fusion-body .vatan-contact-form-section,
.fusion-body .vatan-contact-business,
.fusion-body .vatan-contact-location {
	padding-block: clamp(3.5rem, 7vw, 5.5rem);
}

.fusion-body .vatan-contact-section-header {
	margin-bottom: clamp(1.5rem, 3vw, 2.25rem);
	max-width: 48rem;
}

.fusion-body .vatan-contact-card-grid {
	display: grid;
	gap: clamp(1rem, 2vw, 1.5rem);
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.fusion-body .vatan-contact-card {
	background: var(--vatan-white);
	border: 1px solid var(--vatan-border);
	border-radius: var(--vatan-radius);
	border-top: 3px solid var(--vatan-gold);
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	min-height: 13rem;
	padding: clamp(1.25rem, 2.4vw, 1.75rem);
	transition: border-color 180ms ease, transform 180ms ease;
}

.fusion-body .vatan-contact-card:hover {
	border-color: var(--vatan-gold);
	transform: translateY(-2px);
}

.fusion-body .vatan-contact-card span {
	color: var(--vatan-gold-dark);
	font-size: 0.78rem;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fusion-body .vatan-contact-card h3 {
	margin: 0;
}

.fusion-body .vatan-contact-card p {
	color: var(--vatan-muted);
	line-height: 1.65;
	margin: 0;
}

.fusion-body .vatan-contact-form-section {
	background: var(--vatan-white);
}

.fusion-body .vatan-contact-form-layout {
	display: grid;
	gap: clamp(1.5rem, 4vw, 3.5rem);
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
}

.fusion-body .vatan-contact-form-layout > div p:last-child {
	color: var(--vatan-muted);
	line-height: 1.75;
}

.fusion-body .vatan-contact-form {
	background: var(--vatan-cream);
	border: 1px solid var(--vatan-border);
	border-radius: var(--vatan-radius);
	display: grid;
	gap: 0.7rem;
	padding: clamp(1.25rem, 3vw, 2rem);
}

.fusion-body .vatan-contact-hp {
	display: none;
}

.fusion-body .vatan-contact-alert {
	border-radius: var(--vatan-radius);
	line-height: 1.6;
	padding: 0.85rem 1rem;
}

.fusion-body .vatan-contact-alert p,
.fusion-body .vatan-contact-alert ul {
	margin: 0;
}

.fusion-body .vatan-contact-alert ul {
	padding-left: 1.2rem;
}

.fusion-body .vatan-contact-alert--success {
	background: rgba(111, 143, 56, 0.14);
	border: 1px solid rgba(111, 143, 56, 0.34);
	color: var(--vatan-charcoal);
}

.fusion-body .vatan-contact-alert--error {
	background: rgba(201, 154, 71, 0.14);
	border: 1px solid rgba(201, 154, 71, 0.4);
	color: var(--vatan-charcoal);
}

.fusion-body .vatan-contact-form label {
	color: var(--vatan-charcoal);
	font-weight: 900;
}

.fusion-body .vatan-contact-form input:not([type="checkbox"]),
.fusion-body .vatan-contact-form textarea {
	background: var(--vatan-white);
	border: 1px solid var(--vatan-border);
	border-radius: var(--vatan-radius);
	color: var(--vatan-text);
	padding: 0.85rem 0.95rem;
	width: 100%;
}

.fusion-body .vatan-contact-consent {
	align-items: flex-start;
	display: grid;
	font-weight: 600;
	gap: 0.65rem;
	grid-template-columns: auto 1fr;
	line-height: 1.55;
	margin-top: 0.4rem;
}

.fusion-body .vatan-contact-consent input {
	height: 1.1rem;
	margin-top: 0.2rem;
	width: 1.1rem;
}

.fusion-body .vatan-contact-form textarea {
	resize: vertical;
}

.fusion-body .vatan-contact-form button {
	margin-top: 0.55rem;
	justify-self: start;
}

.fusion-body .vatan-contact-business {
	background: var(--vatan-charcoal);
}

.fusion-body .vatan-contact-business-panel {
	align-items: center;
	border: 1px solid rgba(228, 199, 122, 0.28);
	border-radius: var(--vatan-radius);
	display: flex;
	gap: 1.5rem;
	justify-content: space-between;
	padding: clamp(1.5rem, 4vw, 2.5rem);
}

.fusion-body .vatan-contact-business-panel h2,
.fusion-body .vatan-contact-business-panel p {
	color: var(--vatan-white);
}

.fusion-body .vatan-contact-business-panel p:last-child {
	color: #dce2de;
	margin: 0;
}

.fusion-body .vatan-map-placeholder {
	align-items: center;
	background:
		linear-gradient(135deg, rgba(21, 38, 37, 0.88), rgba(7, 17, 17, 0.92)),
		var(--vatan-charcoal);
	border: 1px solid rgba(201, 154, 71, 0.32);
	border-radius: var(--vatan-radius);
	color: var(--vatan-white);
	display: flex;
	justify-content: center;
	min-height: clamp(18rem, 36vw, 28rem);
	padding: 2rem;
	text-align: center;
}

.fusion-body .vatan-map-placeholder p {
	color: #dce2de;
	font-weight: 800;
	margin: 0;
}

@media (max-width: 1024px) {
	.fusion-body .vatan-contact-card-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.fusion-body .vatan-contact-form-layout {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 640px) {
	.fusion-body .vatan-contact-card-grid {
		grid-template-columns: 1fr;
	}

	.fusion-body .vatan-contact-business-panel {
		align-items: stretch;
		flex-direction: column;
	}

	.fusion-body .vatan-contact-form button,
	.fusion-body .vatan-contact-business-panel .vatan-btn {
		width: 100%;
	}
}