.mcm-contact {
	direction: rtl;
	inline-size: min(1180px, calc(100vw - 2rem));
	margin: 0 calc(50% - min(590px, calc(50vw - 1rem)));
	color: var(--wp--preset--color--ink, #16181d);
}

.mcm-contact,
.mcm-contact * {
	box-sizing: border-box;
}

.mcm-contact__hero {
	position: relative;
	overflow: hidden;
	margin-block: clamp(1rem, 4vw, 2.5rem) clamp(1.5rem, 5vw, 3.5rem);
	padding: clamp(2.5rem, 6vw, 5rem);
	border-radius: var(--wp--custom--radius--lg, 22px);
	color: #fff;
	background:
		linear-gradient(135deg, rgba(29, 78, 137, 0.96), rgba(21, 49, 91, 0.98) 64%, rgba(230, 57, 70, 0.54)),
		url("/wp-content/themes/light-streaming/assets/images/morsi-archive-hero.webp") center/cover;
	box-shadow: var(--wp--preset--shadow--card-hover, 0 18px 44px rgba(21, 49, 91, 0.16));
	isolation: isolate;
}

.mcm-contact__hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(8, 18, 38, 0.55), rgba(8, 18, 38, 0.08));
}

.mcm-contact__eyebrow {
	display: inline-block;
	margin: 0 0 1rem;
	padding: 0.35rem 0.85rem;
	border: 1px solid rgba(255, 255, 255, 0.28);
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: rgba(255, 255, 255, 0.12);
	color: var(--wp--preset--color--pearl, #f4f1ec);
	font-size: 0.86rem;
	font-weight: 700;
}

.mcm-contact__hero h1 {
	max-inline-size: 10ch;
	margin: 0 0 1rem;
	color: #fff;
	font-size: clamp(2.35rem, 6vw, 4.8rem);
	line-height: 1.1;
	letter-spacing: 0;
}

.mcm-contact__hero p:last-child {
	max-inline-size: 56ch;
	margin: 0;
	color: rgba(255, 255, 255, 0.86);
	font-size: clamp(1rem, 1.8vw, 1.24rem);
	line-height: 1.85;
}

.mcm-contact__layout {
	display: grid;
	grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1.35fr);
	gap: clamp(1rem, 3vw, 2rem);
	align-items: start;
	margin-block-end: clamp(3rem, 8vw, 6rem);
}

.mcm-contact__info {
	display: grid;
	gap: 0.9rem;
}

.mcm-info-card,
.mcm-contact__panel {
	border: 1px solid var(--wp--preset--color--line, #e3e1dc);
	border-radius: var(--wp--custom--radius--md, 14px);
	background: color-mix(in srgb, var(--wp--preset--color--base, #fff) 92%, transparent);
	box-shadow: var(--wp--preset--shadow--card, 0 8px 24px rgba(21, 49, 91, 0.08));
}

.mcm-info-card {
	padding: 1.25rem;
}

.mcm-info-card__icon {
	display: inline-grid;
	place-items: center;
	inline-size: 2.3rem;
	block-size: 2.3rem;
	margin-block-end: 0.75rem;
	border-radius: 50%;
	background: color-mix(in srgb, var(--wp--preset--color--primary, #1d4e89) 13%, var(--wp--preset--color--base, #fff));
	color: var(--wp--preset--color--primary-strong, #15315b);
	font-weight: 800;
}

.mcm-info-card h2 {
	margin: 0 0 0.45rem;
	color: var(--wp--preset--color--primary-strong, #15315b);
	font-size: 1.05rem;
	line-height: 1.35;
}

.mcm-info-card p,
.mcm-info-card a {
	margin: 0;
	color: var(--wp--preset--color--muted, #5b6472);
	font-size: 0.96rem;
	line-height: 1.75;
}

.mcm-info-card a {
	color: var(--wp--preset--color--primary, #1d4e89);
	font-weight: 700;
	text-decoration: none;
	overflow-wrap: anywhere;
}

.mcm-info-card a:hover {
	color: var(--wp--preset--color--primary-strong, #15315b);
}

.mcm-contact__panel {
	padding: clamp(1.1rem, 3vw, 2rem);
}

.mcm-alert {
	margin: 0 0 1rem;
	padding: 0.95rem 1rem;
	border-radius: var(--wp--custom--radius--sm, 8px);
	border: 1px solid transparent;
	font-weight: 600;
	line-height: 1.7;
}

.mcm-alert p {
	margin: 0 0 0.35rem;
}

.mcm-alert ul {
	margin: 0;
	padding-inline-start: 1.2rem;
}

.mcm-alert--success {
	border-color: color-mix(in srgb, var(--wp--preset--color--primary, #1d4e89) 42%, #fff);
	background: color-mix(in srgb, var(--wp--preset--color--primary, #1d4e89) 9%, #fff);
	color: var(--wp--preset--color--primary-strong, #15315b);
}

.mcm-alert--warning {
	border-color: color-mix(in srgb, var(--wp--preset--color--accent, #e63946) 34%, #fff);
	background: color-mix(in srgb, var(--wp--preset--color--accent, #e63946) 8%, #fff);
	color: color-mix(in srgb, var(--wp--preset--color--accent, #e63946) 68%, var(--wp--preset--color--primary-strong, #15315b));
}

.mcm-alert--error {
	border-color: color-mix(in srgb, #e63946 42%, #fff);
	background: color-mix(in srgb, #e63946 10%, #fff);
	color: #8e1d28;
}

.mcm-form {
	display: grid;
	gap: 1rem;
}

.mcm-form__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.mcm-field {
	display: grid;
	gap: 0.45rem;
	margin: 0;
}

.mcm-field label {
	color: var(--wp--preset--color--primary-strong, #15315b);
	font-weight: 700;
	line-height: 1.4;
}

.mcm-field label span {
	color: var(--wp--preset--color--accent, #e63946);
}

.mcm-field input,
.mcm-field select,
.mcm-field textarea {
	inline-size: 100%;
	min-block-size: 3.1rem;
	border: 1px solid var(--wp--preset--color--line, #e3e1dc);
	border-radius: var(--wp--custom--radius--sm, 8px);
	background: var(--wp--preset--color--base, #fff);
	color: var(--wp--preset--color--ink, #16181d);
	font: inherit;
	line-height: 1.5;
	padding: 0.75rem 0.9rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.mcm-field textarea {
	resize: vertical;
	min-block-size: 12rem;
}

.mcm-field input:focus,
.mcm-field select:focus,
.mcm-field textarea:focus {
	outline: none;
	border-color: color-mix(in srgb, var(--wp--preset--color--primary, #1d4e89) 58%, #fff);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--wp--preset--color--primary, #1d4e89) 14%, transparent);
	background: #fff;
}

.mcm-form__privacy {
	margin: 0;
	color: var(--wp--preset--color--muted, #5b6472);
	font-size: 0.9rem;
	line-height: 1.75;
}

.mcm-submit {
	justify-self: start;
	min-inline-size: 12rem;
	min-block-size: 3.15rem;
	border: 0;
	border-radius: var(--wp--custom--radius--pill, 999px);
	background: linear-gradient(135deg, var(--wp--preset--color--primary, #1d4e89), var(--wp--preset--color--primary-strong, #15315b));
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-weight: 800;
	padding: 0.8rem 1.6rem;
	box-shadow: 0 12px 30px rgba(29, 78, 137, 0.22);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.mcm-submit:hover,
.mcm-submit:focus-visible {
	transform: translateY(-1px);
	box-shadow: 0 16px 36px rgba(29, 78, 137, 0.28);
}

.mcm-form__trap {
	position: absolute;
	inset-inline-start: -9999px;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
}

@media (max-width: 860px) {
	.mcm-contact__layout,
	.mcm-form__grid {
		grid-template-columns: 1fr;
	}

	.mcm-contact__hero {
		padding: 2rem 1.25rem;
	}

	.mcm-submit {
		inline-size: 100%;
	}
}
