/**
 * Contact page — match Sophia Pro demo layout.
 * https://demo-sophia-pro.wpcustomthemes.com/contact-us/
 *
 * Demo: flow main + post-content alignfull sections (no nested constrained wrappers).
 */

body.sophia-contact-pro-page .wp-block-post-title,
body.sophia-contact-pro-page .entry-title {
	display: none !important;
}

body.sophia-contact-pro-page {
	background-color: var(--wp--preset--color--body-background, #fdf6f2) !important;
	position: relative;
}

/* Demo: top 50% gradient (deep → light) under header + hero */
body.sophia-contact-pro-page.page::before {
	background-image: var(--wp--preset--gradient--gradient-bg-color) !important;
	content: '';
	display: block;
	height: 50%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: -1;
}

body.sophia-contact-pro-page .wp-site-blocks,
body.sophia-contact-pro-page .wp-site-blocks main {
	background: transparent !important;
}

/* Demo: header deep peach at top (page-no-title + has-dark-bg hero) */
body.sophia-contact-pro-page:has(.header-media-inner-post.has-dark-bg) .wp-block-header {
	background-color: var(--wp--preset--color--body-background-deep, #f7daca) !important;
}

/* Demo: hero transparent — gradient shows through (not flat solid fill) */
body.sophia-contact-pro-page .wp-block-post-content > .header-media-inner-post.has-body-background-deep-background-color,
body.sophia-contact-pro-page .wp-block-post-content > .header-media-inner-post.has-dark-bg.shop-header {
	background-color: transparent !important;
}

/* post-content: same as demo — alignfull sections break out to viewport edges */
body.sophia-contact-pro-page .wp-block-post-content,
body.sophia-contact-pro-page .entry-content.wp-block-post-content {
	max-width: none !important;
	padding-inline: 0 !important;
	width: 100%;
}

body.sophia-contact-pro-page .wp-block-post-content > .alignfull {
	box-sizing: border-box;
	margin-inline: calc(50% - 50vw);
	max-width: 100vw;
	padding-inline: 0 !important;
	width: 100vw;
}

body.sophia-contact-pro-page .wp-block-post-content > .alignfull.is-layout-constrained {
	max-width: 100vw !important;
}

/* Content column inside sections — demo uses ~1090px alignwide */
body.sophia-contact-pro-page .wp-block-post-content .alignwide {
	box-sizing: border-box;
	margin-inline: auto;
	max-width: 1090px;
	padding-inline: var(--wp--preset--spacing--42, 42px);
	width: 100%;
}

/* Section backgrounds */
body.sophia-contact-pro-page .wp-block-post-content > .wp-contact-info-four-columns.has-secondary-background-color {
	background-color: var(--wp--preset--color--secondary, #fbede5) !important;
}

body.sophia-contact-pro-page .wp-block-post-content > .wp-block-contact-info-with-form.has-body-background-background-color {
	background-color: var(--wp--preset--color--body-background, #fdf6f2) !important;
	padding-block: var(--wp--custom--spacing--section-block-top, clamp(42px, 7.5vw, 91px));
}

body.sophia-contact-pro-page .wp-block-post-content > .gallery-container.has-body-background-background-color {
	background-color: var(--wp--preset--color--body-background, #fdf6f2) !important;
	padding-block: var(--wp--custom--spacing--section-block-top, clamp(42px, 7.5vw, 91px));
}

/* Form: only the card is white */
body.sophia-contact-pro-page .wp-block-contact-info-with-form .wp-block-column {
	background: transparent !important;
}

body.sophia-contact-pro-page .wp-block-contact-info-with-form .contact-form {
	box-sizing: border-box;
	max-width: 100%;
	width: 100%;
}

/* Accordion — same single alignwide column as form section above */
body.sophia-contact-pro-page .gallery-container > .alignwide {
	box-sizing: border-box;
	margin-inline: auto;
	max-width: 1090px;
	padding-inline: var(--wp--preset--spacing--42, 42px);
	width: 100%;
}

body.sophia-contact-pro-page .gallery-container .accordion-wrapper,
body.sophia-contact-pro-page .gallery-container .accordion {
	box-sizing: border-box;
	margin-inline: 0;
	max-width: 100%;
	padding-inline: 0;
	width: 100%;
}

body.sophia-contact-pro-page .gallery-container .wp-block-group-heading {
	margin-bottom: var(--wp--preset--spacing--24, 24px);
}

body.sophia-contact-pro-page .gallery-container .wp-block-group-heading p {
	overflow-wrap: anywhere;
}

/* Hero — match demo shop-header / contact hero */
body.sophia-contact-pro-page .wp-site-blocks main:has(.header-media-inner-post),
body.sophia-contact-pro-page.page-template-page-contact-us .wp-site-blocks main,
body.sophia-contact-pro-page.page-template-page-no-title .wp-site-blocks main {
	margin-top: 0;
	padding-top: 0 !important;
}

body.sophia-contact-pro-page .wp-site-blocks main {
	padding-bottom: var(--wp--custom--spacing--main-block-gap, clamp(56px, 5.5vw, 91px));
}

body.sophia-contact-pro-page .header-media-inner-post {
	overflow: visible;
	padding-top: var(--wp--custom--spacing--block-footer-gap, 28px);
	padding-bottom: var(--wp--custom--spacing--wp-block-post, 42px);
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-cover,
body.sophia-contact-pro-page .header-media-inner-post.shop-header .wp-block-cover {
	background: transparent !important;
	background-color: transparent !important;
	min-height: auto !important;
	overflow: visible;
	padding: 0;
	position: relative;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-cover__background {
	background: transparent !important;
	background-color: transparent !important;
	opacity: 0 !important;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-cover .wp-block-cover__inner-container,
body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images {
	position: initial;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-cover .wp-block-group.alignwide.has-global-padding {
	position: relative;
	z-index: 2;
}

body.sophia-contact-pro-page .header-media-inner-post .has-huge-post-title-font-size {
	font-family: var(--wp--preset--font-family--merriweather, Merriweather, serif);
	font-size: var(--wp--preset--font-size--huge-post-title, clamp(2.5rem, 5vw, 3.5rem));
	line-height: 1.15;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images {
	margin: 0;
	width: 100%;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image {
	margin: 0;
	max-width: 195px;
	position: absolute;
	width: 13vw;
	z-index: 1;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image > img {
	border-radius: 50%;
	display: block;
	height: auto;
	overflow: hidden;
	width: 100%;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-header-image-first {
	bottom: 5%;
	left: -3%;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-image-first::before {
	background: url('../images/right-splash.svg');
	background-repeat: no-repeat;
	background-size: 100%;
	content: '';
	filter: drop-shadow(0 1000px 0 var(--wp--preset--color--shape-bg, #f2e8e3));
	height: 40vw;
	left: -15%;
	max-width: 600px;
	pointer-events: none;
	position: absolute;
	top: -115%;
	transform: translateY(-1000px);
	width: 40vw !important;
	z-index: -1;
}

body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-header-image-second {
	right: -3%;
	top: 5%;
}

@media screen and (min-width: 992px) {
	body.sophia-contact-pro-page .wp-block-group.alignfull.no-margin-top.header-media-inner-post.shop-header .wp-block-cover {
		padding-bottom: 100px;
	}

	body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-header-image-first {
		left: 0;
	}

	body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-header-image-second {
		right: 0;
	}

	body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images figure.wp-block-image.wp-block-header-image-first::before {
		left: -64%;
	}
}

/* Four columns */
body.sophia-contact-pro-page .wp-contact-info-four-columns {
	padding-bottom: var(--wp--custom--spacing--section-block-top, clamp(42px, 7.5vw, 91px));
	padding-top: var(--wp--custom--spacing--section-block-top, clamp(42px, 7.5vw, 91px));
}

body.sophia-contact-pro-page .wp-contact-info-four-columns > .wp-block-columns {
	display: flex !important;
	flex-wrap: wrap;
	gap: 1.5rem;
}

@media screen and (min-width: 782px) {
	body.sophia-contact-pro-page .wp-contact-info-four-columns > .wp-block-columns {
		flex-wrap: nowrap !important;
	}

	body.sophia-contact-pro-page .wp-contact-info-four-columns > .wp-block-columns > .wp-block-column {
		flex: 1 1 25% !important;
		min-width: 0;
	}

	body.sophia-contact-pro-page .contact-columns.content-on-right {
		align-items: flex-start !important;
		display: flex !important;
		flex-wrap: nowrap !important;
		gap: clamp(24px, 3vw, 40px);
	}

	body.sophia-contact-pro-page .contact-columns.content-on-right > .wp-block-column:first-child {
		flex: 1 1 58% !important;
		max-width: 58%;
	}

	body.sophia-contact-pro-page .contact-columns.content-on-right > .wp-block-column:last-child {
		flex: 1 1 42% !important;
		max-width: 42%;
	}
}

body.sophia-contact-pro-page .contact-form .wpcf7 form p {
	margin: 0;
}

@media screen and (max-width: 991px) {
	body.sophia-contact-pro-page .header-media-inner-post .wp-block-group.wp-block-header-images {
		display: none;
	}
}

@media screen and (max-width: 781px) {
	body.sophia-contact-pro-page .wp-block-post-content .alignwide,
	body.sophia-contact-pro-page .gallery-container > .alignwide {
		padding-inline: var(--wp--preset--spacing--24, 24px);
	}

	body.sophia-contact-pro-page .contact-columns.content-on-right {
		display: block !important;
	}

	body.sophia-contact-pro-page .contact-columns.content-on-right > .wp-block-column {
		flex: none !important;
		max-width: 100% !important;
	}

	body.sophia-contact-pro-page .wp-block-contact-info-with-form .wp-block-group-heading {
		padding-inline: 0 !important;
	}

	body.sophia-contact-pro-page .wp-block-contact-info-with-form .contact-form {
		padding: var(--wp--preset--spacing--24, 24px) !important;
	}

	body.sophia-contact-pro-page .wp-contact-info-four-columns > .wp-block-columns > .wp-block-column {
		flex: 1 1 100% !important;
		max-width: 100%;
	}

	body.sophia-contact-pro-page .header-media-inner-post .has-text-align-center p {
		overflow-wrap: anywhere;
		padding-inline: 0;
	}
}