/* Contacts Page - Start */

/* Breadcrumbs - Start */
.contact-page .woocommerce-breadcrumb {
	padding-top: 40px;
	padding-bottom: 35px;
}
@media (max-width: 1680px) {
	.contact-page .woocommerce-breadcrumb {
		padding-bottom: 34px;
	}
}
@media (max-width: 1279px) {
	.contact-page .woocommerce-breadcrumb {
		padding-bottom: 18px;
	}
}
/* Breadcrumbs - End */

/* Hero - Start */
.contacts-hero {
	padding-top: 0;
	padding-bottom: 64px;
}
.contacts-hero .one-column {
	gap: 16px;
}
.contacts-hero h1 {
	margin: 0;
}
.contacts-subtitle {
	font-size: 24px;
	line-height: 29px;
	color: var(--gray-text);
}
@media (max-width: 1680px) {
	.contacts-hero {
		padding-bottom: 52px;
	}
	.contacts-subtitle {
		font-size: 16px;
		line-height: 19px;
	}
}
@media (max-width: 1279px) {
	.contacts-hero {
		padding-bottom: 36px;
	}
	.contacts-subtitle {
		font-size: 14px;
		line-height: 17px;
	}
}
/* Hero - End */

/* Contacts - Start */
.contacts-section {
	padding-bottom: 120px;
}
.contacts-section .container {
	padding-left: 32px;
	padding-right: 32px;
}
.contacts-grid {
	display: grid;
	grid-template-columns: 913fr 847fr;
	gap: 16px;
}
.contacts-panel {
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding: 32px;
	background: var(--white);
	border: 1px solid var(--input-border);
	border-radius: var(--radius-medium);
}
.contacts-cards {
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.contacts-card {
	display: flex;
	flex-direction: column;
	gap: 15px;
	padding: 24px;
	background: var(--card-gray);
	border-radius: var(--radius-mid);
	color: var(--black);
	transition: background 0.3s ease;
}
@media not all and (pointer: coarse) {
	a.contacts-card:hover {
		background: var(--light-gray);
	}
}
.contacts-card-value {
	color: var(--black);
}
.contacts-social {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: auto;
}
.contacts-social-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
}
.contacts-social-item {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 77px;
	border-radius: var(--radius-tiny);
	transition: opacity 0.3s ease;
}
@media not all and (pointer: coarse) {
	.contacts-social-item:hover {
		opacity: 0.85;
	}
}
.contacts-social-item .icon-mask {
	width: 32px;
	height: 32px;
	background: var(--white);
}
.contacts-social-item.is-instagram {
	background: linear-gradient(45deg, #f09433 0%, #dc2743 45%, #7747ac 100%);
}
.contacts-social-item.is-tiktok {
	background: var(--overlay);
}
.contacts-social-item.is-telegram {
	background: #0197d4;
}
.contacts-social-item.is-viber {
	background: #665ca7;
}
.contacts-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border: 1px solid var(--input-border);
	border-radius: var(--radius-medium);
}
@media (max-width: 1680px) {
	.contacts-section {
		padding-bottom: 96px;
	}
	.contacts-section .container {
		padding-left: 28px;
		padding-right: 28px;
	}
	.contacts-grid {
		grid-template-columns: 677fr 619fr;
	}
	.contacts-panel {
		gap: 28px;
		padding: 28px;
	}
	.contacts-card {
		padding: 20px;
	}
	.contacts-social-item {
		height: 65px;
	}
	.contacts-social-item .icon-mask {
		width: 28px;
		height: 28px;
	}
}
@media (max-width: 1279px) {
	.contacts-section {
		padding-bottom: 80px;
	}
	.contacts-section .container {
		padding-left: 20px;
		padding-right: 20px;
	}
	.contacts-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}
	.contacts-panel {
		gap: 20px;
		padding: 20px;
	}
	.contacts-cards {
		gap: 12px;
	}
	.contacts-card {
		gap: 16px;
		padding: 16px;
	}
	.contacts-social-label {
		font-size: 16px;
		line-height: 19px;
	}
	.contacts-social-list {
		gap: 8px;
	}
	.contacts-social-item .icon-mask {
		width: 24px;
		height: 24px;
	}
	.contacts-photo img {
		aspect-ratio: 303 / 381;
		height: auto;
	}
}
/* Contacts - End */

/* FAQ - Start */
.contact-page .faq-head {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 24px;
	text-align: center;
}
.contact-page .faq-head .h2 {
	margin-bottom: 0;
	text-transform: uppercase;
}
.contact-page section.faq {
	padding-top: 0;
	padding-bottom: 120px;
	scroll-margin-top: 171px;
}
@media (max-width: 1680px) {
	.contact-page .faq-head {
		gap: 20px;
	}
	.contact-page section.faq {
		padding-bottom: 96px;
		scroll-margin-top: 152px;
	}
}
@media (max-width: 1279px) {
	.contact-page .faq-head {
		gap: 16px;
	}
	.contact-page section.faq {
		padding-bottom: 80px;
		scroll-margin-top: 122px;
	}
}
/* FAQ - End */

/* Contacts Page - End */