/* =============================================================
   front-page.css — Homepage-specific sections
   Sections: ti-einai, psychotherapy, quote-banner, blog-preview
   ============================================================= */

/* ── 1. Τι Είναι — white bg, 2-col (photo + text) ── */

.home-ti-einai {
	background-color: var(--color-white);
}

.home-ti-einai__inner {
	padding-top: var(--section-py);
	padding-bottom: var(--section-py);
}

.home-ti-einai__heading {
	font-family: var(--font-primary);
	font-size: var(--text-h2-lg);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-tight);
	text-align: center;
	margin-bottom: var(--gap-xxl);
}

.home-ti-einai__grid {
	display: grid;
	grid-template-columns: var(--grid-photo-w) 1fr;
	gap: var(--grid-2col-gap);
	align-items: start;
}

.home-ti-einai__image {
	overflow: hidden;
	box-shadow: var(--shadow-image);
	border-radius: var(--radius-none);
	width: var(--grid-photo-w);
	height: var(--grid-photo-h);
}

.home-ti-einai__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.home-ti-einai__image-col {
	display: flex;
	flex-direction: column;
}

.home-ti-einai__name {
	font-family: var(--font-primary);
	font-size: var(--text-body-lg);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-body);
	margin-top: var(--gap-md);
}

.home-ti-einai__cta-link {
	font-family: var(--font-primary);
	font-size: var(--text-body-lg);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-body);
	text-decoration: none;
	margin-top: var(--gap-xs);
	transition: opacity 0.2s;
}

.home-ti-einai__cta-link:hover {
	opacity: 0.7;
}

.home-ti-einai__body {
	font-family: var(--font-primary);
	font-size: var(--text-body-lg);
	font-weight: var(--weight-regular);
	color: var(--color-text);
	line-height: var(--lh-body);
	text-align: left;
}

.home-ti-einai__body p {
	margin-bottom: var(--paragraph-gap);
}

.home-ti-einai__body p:last-child {
	margin-bottom: 0;
}

@media (max-width: 1024px) {
	.home-ti-einai__grid {
		grid-template-columns: 1fr 1fr;
	}

	.home-ti-einai__image {
		width: 100%;
		height: auto;
		aspect-ratio: 3 / 4;
	}
}

@media (max-width: 768px) {
	.home-ti-einai__grid {
		grid-template-columns: 1fr;
	}

	.home-ti-einai__image {
		max-width: 384px;
		margin: 0 auto;
	}

	.home-ti-einai__body {
		font-size: var(--text-body);
	}
}

/* ── 2. Ψυχοθεραπεία — cream bg, left-aligned text ── */

.home-psychotherapy {
	background-color: var(--color-cream);
}

.home-psychotherapy__inner {
	padding-top: var(--section-py);
	padding-bottom: var(--section-py);
}

.home-psychotherapy__heading {
	font-family: var(--font-primary);
	font-size: var(--text-h2);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-heading);
	margin-bottom: var(--gap-lg);
}

.home-psychotherapy__body {
	font-family: var(--font-primary);
	font-size: var(--text-body-lg);
	font-weight: var(--weight-regular);
	color: var(--color-text);
	line-height: var(--lh-body);
	text-align: left;
}

.home-psychotherapy__body p {
	margin-bottom: var(--paragraph-gap);
}

.home-psychotherapy__body p:last-child {
	margin-bottom: 0;
}

@media (max-width: 768px) {
	.home-psychotherapy__body {
		font-size: var(--text-body);
	}
}

/* ── 3. Quote Banner — full-width image + overlay ── */

.home-quote {
	position: relative;
	overflow: hidden;
	width: 100%;
}

.home-quote__bg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.home-quote__overlay {
	position: absolute;
	inset: 0;
	background-color: var(--color-primary-overlay-85);
}

.home-quote__content {
	position: relative;
	z-index: 1;
	padding: 8rem var(--section-px-narrow);
	text-align: center;
}

.home-quote__text {
	font-family: var(--font-primary);
	font-size: var(--text-quote);
	font-weight: var(--weight-regular);
	color: var(--color-white);
	line-height: var(--lh-body);
	max-width: 896px;
	margin: 0 auto;
}

@media (max-width: 768px) {
	.home-quote__content {
		padding: var(--section-py) var(--section-px);
	}
}

/* ── 4. Blog Preview — cream bg, heading + 3-col cards ── */

.home-blog {
	background-color: var(--color-cream);
}

.home-blog__inner {
	padding-top: var(--section-py);
	padding-bottom: var(--section-py);
}

.home-blog__header {
	text-align: center;
	margin-bottom: var(--gap-xl);
}

.home-blog__heading {
	font-family: var(--font-primary);
	font-size: var(--text-h2);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-heading);
	margin-bottom: var(--gap-sm);
}

.home-blog__subtitle {
	font-family: var(--font-primary);
	font-size: var(--text-body);
	font-weight: var(--weight-regular);
	color: var(--color-text-secondary);
	line-height: var(--lh-body);
}

/* ── Blog CTA link ── */

.home-blog__cta {
	text-align: center;
	padding-top: var(--section-py);
}

.home-blog__cta-link {
	font-family: var(--font-primary);
	font-size: var(--text-body-lg);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-body);
	text-decoration: none;
	transition: opacity 0.2s;
}

.home-blog__cta-link:hover {
	opacity: 0.7;
}

/* ── Article Card (compact) ── */

.article-card-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--grid-3col-gap);
}

.article-card {
	background-color: var(--color-white);
	padding: var(--card-padding);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	min-height: 157px;
}

.article-card__title {
	font-family: var(--font-primary);
	font-size: var(--text-h3-xs);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-h3-xs);
	margin-bottom: var(--gap-sm);
}

.article-card__link {
	font-family: var(--font-primary);
	font-size: var(--text-body-sm);
	font-weight: var(--weight-regular);
	color: var(--color-primary);
	line-height: var(--lh-nav);
	text-decoration: none;
	transition: opacity 0.2s;
}

.article-card__link:hover {
	opacity: 0.7;
}

@media (max-width: 1024px) {
	.article-card-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media (max-width: 768px) {
	.article-card-grid {
		grid-template-columns: 1fr;
	}
}

/* ── 5. Υπηρεσίες — white bg, card grid ── */

.home-ypiresia {
	background-color: var(--color-white);
}

.home-ypiresia__inner {
	padding-top: var(--section-py);
	padding-bottom: var(--section-py);
}

.home-ypiresia__header {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: var(--gap-xl);
}

.home-ypiresia__heading {
	font-family: var(--font-primary);
	font-size: var(--text-h2);
	font-weight: var(--weight-medium);
	color: var(--color-primary);
	line-height: var(--lh-heading);
}

.home-ypiresia__all-link {
	font-family: var(--font-primary);
	font-size: var(--text-small);
	font-weight: var(--weight-regular);
	color: var(--color-primary);
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	transition: opacity 0.2s;
}

.home-ypiresia__all-link:hover {
	opacity: 0.7;
}

@media (max-width: 768px) {
	.home-ypiresia__header {
		flex-direction: column;
		gap: var(--gap-sm);
	}
}