/* ==========================================================================
   Contact Page – PlanBTheme
   ========================================================================== */

/* ── Reset overrides ── */
.page-template-page-contact #page.site.grid-container.container {
	max-width: none;
}

.page-template-page-contact #page {
	background-color: transparent !important;
}

.planb-contact-page .site-content,
.planb-contact-page .inside-article {
	padding: 0;
	margin: 0;
	max-width: none;
}

.planb-contact-page .entry-content:not(:first-child) {
	margin-top: 0;
}

/* ── Remove sidebar ── */
.page-template-page-contact #right-sidebar,
.page-template-page-contact #left-sidebar {
	display: none !important;
}

.page-template-page-contact .site-content {
	display: block !important;
}

/* ==========================================================================
   Backdrop circle
   ========================================================================== */
.planb-contact-page {
	position: relative;
}

.planb-contact-page > .section-backdrop {
	height: calc(100% - 250px);
	margin-top: 100px;
	opacity: 0.8;
}

.planb-contact-page .back-circle {
	width: min(500px, 80vw, 60vh);
	height: min(500px, 80vw, 60vh);
}

/* ==========================================================================
   Main Section
   ========================================================================== */
.cp-main {
	width: 100%;
	color: #ffffff;
	padding: 140px 0;
	position: relative;
}

.cp-inner {
	max-width: 1300px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-column-gap: 16px;
	position: relative;
	z-index: 1;
}

/* ── Content column ── */
.cp-col-content {
	color: #ffffff;
}

.cp-col-content p {
	color: #ffffff;
}

.cp-col-content a {
	color: var(--accent, #e8a87c);
}

/* ── Contact subtitle (custom block class) ── */
.contact-subtitle {
	margin-top: 20px;
	margin-bottom: 10px;
	font-size: 58px !important;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
	color: #ffffff;
}

/* ── Form column ── */
.cp-col-form {
	color: #ffffff;
}

/* ── Form field styles ── */
.form-text-field input,
.form-textarea-field textarea,
.contact-submit-button {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	color: var(--white) !important;
	background-color: var(--base-2) !important;
	min-height: 60px !important;
	margin-bottom: 20px;
	padding-left: 20px;
	font-size: 16px;
}

.form-textarea-field textarea {
	min-height: 250px !important;
}

.form-text-field input:focus,
.form-textarea-field textarea:focus {
	border-color: var(--accent-orange) !important;
}

.contact-submit-button {
	background-color: #000000 !important;
	border: 1px solid white !important;
	font-size: 18px !important;
	font-weight: 400 !important;
}

/* ==========================================================================
   Responsive – max-width: 990px
   ========================================================================== */
@media screen and (max-width: 990px) {
	.cp-inner {
		grid-template-columns: 1fr;
	}

	.contact-subtitle {
		font-size: 40px !important;
		line-height: 45px;
	}
}

/* ==========================================================================
   Responsive – max-width: 768px
   ========================================================================== */
@media screen and (max-width: 768px) {
	.contact-subtitle {
		font-size: 30px !important;
		line-height: 35px;
	}
}

/* ==========================================================================
   Responsive – max-width: 480px
   ========================================================================== */
@media screen and (max-width: 480px) {
	.contact-subtitle {
		font-size: 25px !important;
		line-height: 30px;
	}
}