/* GALAA Estate — Property Card + Contact Card */

/* ============ Property Card ============ */
.gae-card {
	background: var(--gae-bg);
	border-radius: var(--gae-radius);
	overflow: hidden;
	box-shadow: var(--gae-shadow-sm);
	transition: all var(--gae-transition);
	display: flex;
	flex-direction: column;
	border: 1px solid transparent;
}
.gae-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--gae-shadow);
	border-color: var(--gae-border);
}

.gae-card-media {
	position: relative;
	line-height: 0;
}
.gae-card-image-wrap {
	display: block;
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: var(--gae-card-bg);
}
.gae-card-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 600ms ease;
}
.gae-card:hover .gae-card-image { transform: scale(1.06); }

/* Dark overlay on hover for sophistication */
.gae-card-image-wrap::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(26,20,20,.5) 0%, transparent 50%);
	opacity: 1;
	transition: opacity var(--gae-transition);
	pointer-events: none;
}

.gae-badge {
	position: absolute;
	top: 1rem;
	padding: .35rem .85rem;
	font-size: .7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .08em;
	border-radius: var(--gae-radius-sm);
	color: #fff;
	z-index: 2;
}
.gae-badge-featured { left: 1rem; background: var(--gae-accent); color: var(--gae-text); }
.gae-badge-type     { right: 1rem; background: rgba(26,20,20,.82); backdrop-filter: blur(4px); }
.gae-badge-sold     { right: 1rem; background: var(--gae-sold); }

.gae-price-overlay {
	position: absolute;
	bottom: 1rem;
	left: 1rem;
	padding: .5rem 1rem;
	background: var(--gae-primary);
	color: #fff;
	font-weight: 700;
	font-size: 1.05rem;
	border-radius: var(--gae-radius-sm);
	box-shadow: 0 6px 16px rgba(100,8,16,.32);
	z-index: 2;
	letter-spacing: -.01em;
}

.gae-card-body { padding: 1.25rem; position: relative; }
.gae-card-title {
	font-size: 1.15rem;
	margin: 0 0 .35rem;
	font-weight: 600;
	letter-spacing: -.01em;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 2.6em;
	overflow-wrap: anywhere;
}
.gae-card-title a { color: var(--gae-text); }
.gae-card-title a:hover { color: var(--gae-primary); }
.gae-card-location {
	font-size: .9rem;
	color: var(--gae-muted);
	margin: 0 0 1rem;
	display: flex;
	align-items: center;
	gap: .35rem;
}

.gae-card-specs {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	gap: 1.25rem;
	font-size: .85rem;
	color: var(--gae-muted);
	border-top: 1px solid var(--gae-border);
	padding-top: 1rem;
}
.gae-card-specs strong { color: var(--gae-text); font-weight: 700; }
.gae-card-specs li { display: flex; align-items: center; gap: .35rem; }

.gae-fav-btn {
	position: absolute;
	right: .75rem;
	bottom: .75rem;
	background: rgba(255,255,255,.92);
	border: 1px solid rgba(255,255,255,.6);
	border-radius: 50%;
	width: 32px;
	height: 32px;
	cursor: pointer;
	font-size: .9rem;
	line-height: 1;
	color: var(--gae-primary);
	transition: all var(--gae-transition);
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--gae-shadow-sm);
}
.gae-fav-btn:hover { transform: scale(1.12); background: #fff; }
.gae-fav-btn.is-active { color: #fff; background: var(--gae-primary); border-color: var(--gae-primary); }

/* ============ Featured (large) variant ============ */
.is-featured .gae-card-image-wrap { aspect-ratio: 1 / 1; }

/* ============ Company Contact Card ============ */
.gae-contact-card {
	background: var(--gae-bg);
	border: 1px solid var(--gae-border);
	border-radius: var(--gae-radius);
	padding: 2rem;
	box-shadow: var(--gae-shadow-sm);
}
.gae-contact-logo img { max-width: 140px; margin-bottom: 1.25rem; }
.gae-contact-name {
	font-size: 1.4rem;
	margin: 0 0 .35rem;
	color: var(--gae-text);
	font-weight: 700;
	letter-spacing: -.02em;
}
.gae-contact-tagline { color: var(--gae-muted); margin: 0 0 1.5rem; font-size: .9rem; }
.gae-listing-staff {
	font-size: .85rem;
	color: var(--gae-muted);
	margin: 0 0 1.25rem;
	padding: .75rem 1rem;
	background: var(--gae-card-bg);
	border-radius: var(--gae-radius);
}

.gae-contact-phones { margin: 1.25rem 0; }
.gae-reveal-phone, .gae-phone-link {
	display: flex;
	gap: .75rem;
	align-items: center;
	width: 100%;
	background: var(--gae-card-bg);
	border: 1px solid var(--gae-border);
	border-radius: var(--gae-radius);
	padding: 1rem 1.25rem;
	font-size: 1rem;
	font-weight: 500;
	color: var(--gae-text);
	text-decoration: none;
	cursor: pointer;
	margin-bottom: .65rem;
	transition: all var(--gae-transition);
	font-family: var(--gae-font);
}
.gae-reveal-phone:hover, .gae-phone-link:hover {
	background: var(--gae-primary);
	color: #fff;
	border-color: var(--gae-primary);
}

.gae-contact-channels {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 1.25rem 0;
}
.gae-contact-channels .gae-btn { flex: 1; min-width: 110px; font-size: .8rem; padding: .75rem .85rem; }

.gae-inquiry-form { margin-top: 1.5rem; }
.gae-inquiry-form input,
.gae-inquiry-form textarea {
	width: 100%;
	padding: .85rem 1rem;
	border: 1px solid var(--gae-border);
	border-radius: var(--gae-radius);
	font: inherit;
	background: #fff;
	margin-top: .35rem;
	transition: border-color var(--gae-transition), box-shadow var(--gae-transition);
}
.gae-inquiry-form input:focus, .gae-inquiry-form textarea:focus {
	outline: none;
	border-color: var(--gae-primary);
	box-shadow: 0 0 0 3px rgba(100,8,16,.14);
}
.gae-inquiry-form label { display: block; margin-bottom: 1rem; font-size: .85rem; color: var(--gae-text); font-weight: 500; }
.gae-inquiry-form button { width: 100%; }

/* ============ Mortgage calculator ============ */
.gae-mortgage {
	background: var(--gae-card-bg);
	padding: 2rem;
	border-radius: var(--gae-radius);
	border: 1px solid var(--gae-border);
}
.gae-mortgage h4 {
	margin: 0 0 1.25rem;
	color: var(--gae-primary);
	font-weight: 700;
	letter-spacing: -.01em;
}
.gae-mortgage label {
	display: block;
	margin-bottom: 1rem;
	font-size: .9rem;
	font-weight: 500;
	color: var(--gae-text);
}
.gae-mortgage input {
	width: 100%;
	padding: .65rem .85rem;
	border: 1px solid var(--gae-border);
	border-radius: var(--gae-radius);
	font: inherit;
	margin-top: .35rem;
	background: #fff;
}
.gae-m-result {
	margin-top: 1.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--gae-border);
	font-size: 1rem;
	color: var(--gae-muted);
}
.gae-m-monthly {
	color: var(--gae-primary);
	font-size: 1.75rem;
	font-weight: 800;
	display: block;
	margin-top: .25rem;
	letter-spacing: -.02em;
}

/* ============ Property details ============ */
.gae-property-details {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0;
	margin: 1.5rem 0;
	border: 1px solid var(--gae-border);
	border-radius: var(--gae-radius);
	overflow: hidden;
	background: var(--gae-bg);
}
@media (min-width: 640px) {
	.gae-property-details { grid-template-columns: 1fr 1fr; }
}
.gae-detail-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: 1rem 1.25rem;
	border-bottom: 1px solid var(--gae-border);
	background: #fff;
}
.gae-detail-row:nth-child(odd) { background: var(--gae-card-bg); }
.gae-detail-row dt {
	font-weight: 500;
	color: var(--gae-muted);
	margin: 0;
	font-size: .85rem;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.gae-detail-row dd { margin: 0; color: var(--gae-text); font-weight: 600; }

/* ============ Compare table ============ */
.gae-compare-table {
	width: 100%;
	border-collapse: collapse;
}
.gae-compare-table th, .gae-compare-table td {
	padding: 1rem;
	border: 1px solid var(--gae-border);
	text-align: left;
	vertical-align: top;
}
.gae-compare-table th { background: var(--gae-card-bg); font-weight: 600; }
.gae-compare-empty { color: var(--gae-muted); text-align: center; padding: 3rem; }

/* ============ Property actions (Print / Brochure) ============ */
.gae-property-actions {
	display: flex;
	flex-wrap: wrap;
	gap: .65rem;
	margin: .25rem 0 1.5rem;
}
.gae-property-actions .gae-btn { padding: .7rem 1.25rem; font-size: .85rem; }
.gae-property-actions svg { width: 17px; height: 17px; }

/* ============ Property gallery + lightbox ============ */
.gae-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: .6rem; margin: 1.5rem 0; }
@media (min-width: 700px) { .gae-gallery { grid-template-columns: repeat(3, 1fr); } }
.gae-gallery-item { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--gae-card-bg); }
.gae-gallery-img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; display: block; }
.gae-gallery-item:hover .gae-gallery-img { transform: scale(1.05); }
.gae-lightbox { position: fixed; inset: 0; background: rgba(26,20,20,.93); display: none; align-items: center; justify-content: center; z-index: 9999; padding: 2rem; }
.gae-lightbox.is-open { display: flex; }
.gae-lightbox img { max-width: 95%; max-height: 90vh; object-fit: contain; box-shadow: 0 10px 40px rgba(0,0,0,.5); }
.gae-lightbox-close { position: absolute; top: .75rem; right: 1.25rem; background: none; border: none; color: #fff; font-size: 2.5rem; line-height: 1; cursor: pointer; }
