/* Shared dark hero language inspired by the Contact page composition. */
:is(.buy-hero, .sell-hero, .location-hero, .estimation-page-hero, .financing-page-hero, .contact-page-hero, .property-archive-hero, .finance-hero, .legal-hero) {
	position: relative;
	isolation: isolate;
	overflow-x: clip;
	background:
		radial-gradient(ellipse at 82% 46%, rgba(141, 91, 50, .16), transparent 48%),
		linear-gradient(125deg, #0b0b0b 0%, #11100f 57%, #21160f 100%) !important;
}

:is(.buy-hero, .sell-hero, .location-hero, .estimation-page-hero, .financing-page-hero, .contact-page-hero, .property-archive-hero, .finance-hero, .legal-hero)::before {
	position: absolute;
	top: 50%;
	right: clamp(-70px, -2vw, -18px);
	bottom: auto;
	left: auto;
	z-index: 0;
	width: auto;
	height: auto;
	color: rgba(201, 154, 85, .045);
	font: 600 clamp(22rem, 42vw, 40rem)/.76 Georgia, "Times New Roman", serif;
	letter-spacing: -.08em;
	content: "M";
	transform: translateY(-45%);
	pointer-events: none;
	user-select: none;
}

.hero {
	position: relative;
	isolation: isolate;
	min-height: 0;
	background:
		radial-gradient(ellipse at 82% 42%, rgba(141, 91, 50, .17), transparent 46%),
		linear-gradient(125deg, #0b0b0b 0%, #11100f 56%, #21160f 100%) !important;
}

.hero::before {
	content: none;
}

.hero-overlay {
	z-index: 0;
	background: linear-gradient(120deg, rgba(11, 11, 11, .16), rgba(33, 22, 15, .06) 62%, rgba(11, 11, 11, .08));
}

.hero-container {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
	align-items: center;
	row-gap: clamp(24px, 3vw, 40px);
	width: min(100%, 1440px);
	max-width: 1440px;
	box-sizing: border-box;
	padding-inline: clamp(24px, 4vw, 64px);
	padding-block: clamp(128px, 14vh, 168px) clamp(36px, 5vw, 64px);
}

.hero-content {
	grid-column: 1;
	grid-row: 1;
	width: 100%;
	max-width: 760px;
}

.hero-brand-visual { grid-column: 2; grid-row: 1; display: grid; place-items: center; width: 100%; min-width: 0; margin: 0; }
.hero-brand-visual img { display: block; width: min(100%, 620px); height: auto; max-height: 500px; object-fit: contain; }
.hero-search { grid-column: 1 / -1; }

.hero-image {
	top: clamp(150px, 17vh, 205px);
	right: clamp(32px, calc((100vw - 1300px) / 2 + 32px), 110px);
	width: min(39%, 520px);
	height: clamp(330px, 33vw, 460px);
	margin-top: 0;
	border-radius: 26px;
	object-position: center;
}

.hero-image-img { object-position: center 52%; }

.hero-buttons { gap: 14px; margin-bottom: 0; }

.hero-search .search-submit button { min-height: 54px !important; border-radius: 999px; }

:is(.hero-title, .buy-hero h1, .sell-hero-content h1, .location-hero h1, .estimation-page-hero h1, .financing-page-hero h1, .contact-page-hero h1, .property-archive-heading h1, .finance-hero h1, .legal-hero h1) {
	font-family: Georgia, "Times New Roman", serif;
	font-size: clamp(2.75rem, 5.4vw, 5rem);
	font-weight: 600;
	letter-spacing: -.035em;
	line-height: 1.03;
	text-wrap: balance;
}

:is(.buy-hero-inner, .sell-hero-inner, .location-hero-inner, .estimation-page-hero__inner, .financing-page-hero__inner, .contact-page-hero__inner, .property-archive-hero-inner, .finance-hero__inner, .legal-hero-content) {
	position: relative;
	z-index: 1;
}

.location-hero::after,
.estimation-page-hero::after,
.legal-hero::after { content: none !important; }

.buy-hero,
.sell-hero,
.location-hero,
.estimation-page-hero,
.financing-page-hero,
.contact-page-hero,
.property-archive-hero,
.finance-hero,
.legal-hero {
	color: #f5eee3;
}

.property-archive-hero { padding-block: clamp(160px, 20vh, 210px) 72px; }

@media (max-width: 1100px) {
	.hero { min-height: 0; }
	.hero-container { display: grid; grid-template-columns: minmax(0, 1fr); }
	.hero-content { max-width: 760px; }
	.hero-brand-visual { grid-column: 1; grid-row: auto; width: min(100%, 520px); margin-inline: auto; }
	.hero-brand-visual img { width: min(100%, 440px); max-height: 360px; }
	.hero-image {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
		max-width: 760px;
		height: clamp(260px, 48vw, 420px);
		margin: 34px auto 0;
	}
}

@media (max-width: 720px) {
	.hero-brand-visual { width: 100%; }
	.hero-brand-visual img { width: min(100%, 360px); max-height: 280px; }
	.hero-container { padding-inline: 20px; }
	:is(.hero-title, .buy-hero h1, .sell-hero-content h1, .location-hero h1, .estimation-page-hero h1, .financing-page-hero h1, .contact-page-hero h1, .property-archive-heading h1, .finance-hero h1, .legal-hero h1) { font-size: clamp(2.55rem, 10.6vw, 4rem); }
	:is(.buy-hero, .sell-hero, .location-hero, .estimation-page-hero, .financing-page-hero, .contact-page-hero, .property-archive-hero, .finance-hero, .legal-hero)::before {
		top: 34%;
		right: -88px;
		font-size: clamp(19rem, 78vw, 27rem);
	}
	.hero-image { height: clamp(230px, 66vw, 330px); border-radius: 20px; }
}

/* Legal pages share the same top clearance, composition and brand monogram. */
.legal-hero {
	padding-block: max(160px, calc(var(--mm-header-height, 120px) + 40px)) clamp(62px, 8vw, 90px);
}

.legal-hero h1 { color: var(--mm-cream, #f5eee3); }

@media (prefers-reduced-motion: reduce) {
	.hero-image { scroll-behavior: auto; }
}
