/* ═══════════════════════════════════════════════════════════════════════════
   LEADER HELLAS — ABOUT SPLIT (φωτογραφία + κάρτα από πάνω)
   Figma @1920: section 936 · φωτό 1667×889 top 88 right 126
                κάρτα 748×716 left 50 · padding 59/77 · τίτλος margin-top 91
   ═══════════════════════════════════════════════════════════════════════════ */

.lh-about,
.lh-about *,
.lh-about *::before,
.lh-about *::after {
	box-sizing: border-box;
}

.lh-about {
	--lh-about-h: 93.6rem;        /* 936px */
	--lh-about-photo-w: 166.7rem; /* 1667px */
	--lh-about-photo-h: 88.9rem;  /*  889px */
	--lh-about-card-w: 74.8rem;   /*  748px */
	--lh-about-card-h: 71.6rem;   /*  716px */
	--lh-about-card-bg: var(--lh-navy);
	--lh-about-card-color: var(--lh-white);

	position: relative;
	width: 100%;
	height: var(--lh-about-h);
	padding: 0 12.7rem;   /* 127px */
}

.lh-about__photo {
	position: absolute;
	z-index: 0;
	top: 8.8rem;      /* 88px */
	right: 12.6rem;   /* 126px */
	width: var(--lh-about-photo-w);
	height: var(--lh-about-photo-h);
	border-radius: var(--lh-radius);
	overflow: hidden;
}

/* (0,2,1) — δες τη σημείωση ειδικότητας στο leader-core.css. */
.lh-about .lh-about__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center 38%;
}

.lh-about__card {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 5rem;   /* 50px */
	width: var(--lh-about-card-w);
	height: var(--lh-about-card-h);
	padding: 5.9rem 7.7rem;   /* 59px 77px */
	border-radius: var(--lh-radius);
	background: var(--lh-about-card-bg);
	color: var(--lh-about-card-color);
}

.lh-about__eyebrow {
	margin: 0;
	font-family: var(--lh-display);
	font-size: 2rem;
	font-weight: 800;
	line-height: 2.2rem;
	letter-spacing: .1rem;
	text-transform: uppercase;
}

.lh-about__title {
	margin: 9.1rem 0 2.6rem;   /* 91px / 26px */
	font-family: var(--lh-display);
	font-size: 5.5rem;
	font-weight: 800;
	line-height: 5.7rem;
	letter-spacing: .11rem;
	text-transform: uppercase;
}

.lh-about__copy {
	margin: 0;
	font-size: 2rem;
	line-height: 3rem;
}

/*
 * Το static είχε ΜΙΑ παράγραφο με <br><br> ανάμεσα· ο WYSIWYG βγάζει δύο <p>.
 * Κενό ίσο με μία line-height (30px) αναπαράγει ακριβώς το ίδιο ύψος.
 */
.lh-about__copy p {
	margin: 0 0 3rem;
}

.lh-about__copy p:last-child {
	margin-bottom: 0;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ≤1024px — κάρτα πάνω, φωτογραφία κάτω (column-reverse όπως στο static)
   ═══════════════════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {

	.lh-about {
		height: auto;
		padding: 0 var(--lh-gutter) 8rem;
		display: flex;
		flex-direction: column-reverse;
	}

	.lh-about__photo,
	.lh-about__card {
		position: relative;
		inset: auto;
		width: 100%;
		height: auto;
	}

	.lh-about__photo {
		min-height: 39rem;
		border-radius: 0 0 var(--lh-radius) var(--lh-radius);
	}

	.lh-about__card {
		padding: 5.2rem 3.2rem;
	}

	.lh-about__title {
		margin-top: 4.5rem;
		font-size: 4.6rem;
		line-height: 4.8rem;
	}
}