/*
 * MA-ZAL Group — home page sections: hero, coffee strip, divisions, about, presence, contact.
 * Layout only; buttons, cards, chips, forms and section heads come from components.css. Reads tokens.css only.
 */

/* ---------- hero ---------- */
.mzs-hero {
	padding-block: var(--s-8) var(--s-7);
}

.mzs-hero__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--s-8);
	align-items: center;
}

.mzs-hero__text {
	display: grid;
	gap: var(--s-5);
	align-content: center;
}

.mzs-hero__title {
	font-size: var(--fs-display);
	line-height: 1.15;
}

.mzs-hero__lead {
	max-width: 33rem;
	color: var(--c-ink-2);
	font-size: var(--fs-lead);
	line-height: 1.8;
}

.mzs-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-3);
}

.mzs-hero__facts {
	padding-top: var(--s-5);
	border-top: var(--b-1);
}

.mzs-hero__media {
	position: relative;
	border-radius: var(--r-xl);
	overflow: hidden;
}

.mzs-hero__img {
	width: 100%;
	height: clamp(15rem, 10rem + 22vw, 32.5rem);
	object-fit: cover;
}

.mzs-hero__badge {
	position: absolute;
	inset-inline: var(--s-5);
	bottom: var(--s-5);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--s-3);
	padding: var(--s-3) var(--s-4);
	border-radius: var(--r-md);
	background: var(--c-scrim);
	color: var(--c-on-night);
	backdrop-filter: blur(6px);
}

.mzs-hero__badge small { display: block; color: var(--c-gold-night); font-size: var(--fs-tiny); }
.mzs-hero__badge strong { font-size: var(--fs-body); }
.mzs-hero__badge a { color: var(--c-gold-night); font-size: var(--fs-small); font-weight: var(--fw-semi); white-space: nowrap; }

/* ---------- coffee strip ---------- */
.mzs-strip {
	display: grid;
	grid-template-columns: 16rem minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--s-6);
	padding: var(--s-5) var(--s-7) var(--s-5) var(--s-5);
	border-radius: var(--r-lg);
	background: var(--c-night);
	color: var(--c-on-night);
}

[dir="rtl"] .mzs-strip { padding: var(--s-5) var(--s-5) var(--s-5) var(--s-7); }

.mzs-strip__img {
	width: 100%;
	height: 9.5rem;
	object-fit: cover;
	border-radius: var(--r-md);
}

.mzs-strip__text { display: grid; gap: var(--s-2); }
.mzs-strip__eyebrow { color: var(--c-gold-night); font-size: var(--fs-tiny); font-weight: var(--fw-semi); }
.mzs-strip__title { font-size: var(--fs-h2); font-weight: var(--fw-bold); }
.mzs-strip__lead { color: var(--c-on-night-2); font-size: var(--fs-body); }

/* ---------- divisions ---------- */
.mzs-divisions {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--s-5);
}

/* ---------- about ---------- */
.mzs-about {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--s-8);
}

.mzs-about__side { display: grid; gap: var(--s-4); align-content: start; }

.mzs-about__founder {
	display: grid;
	gap: var(--s-2);
	margin-top: var(--s-4);
	padding: var(--s-5);
	background: var(--c-surface);
	border: var(--b-1);
	border-radius: var(--r-md);
}

.mzs-about__founder strong { font-size: var(--fs-h3); }

.mzs-about__story {
	display: grid;
	gap: var(--s-5);
	font-size: var(--fs-lead);
	line-height: 1.9;
	color: var(--c-ink-3);
}

.mzs-entities {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: var(--s-4);
	font-size: var(--fs-small);
	line-height: 1.6;
}

.mzs-entity {
	display: grid;
	gap: var(--s-1);
	padding-top: var(--s-3);
	border-top: 2px solid var(--c-gold);
}

.mzs-entity span { color: var(--c-ink-2); font-size: var(--fs-tiny); }
.mzs-entity strong { direction: ltr; unicode-bidi: isolate; text-align: start; }

/* ---------- presence ---------- */
.mzs-markets {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--s-5);
}

.mzs-market {
	display: grid;
	gap: var(--s-3);
	align-content: start;
	padding: var(--s-5);
	border: 1px solid var(--c-night-line);
	border-radius: var(--r-md);
}

.mzs-market .mzs-chip { justify-self: start; }
.mzs-market strong { font-size: var(--fs-h3); color: var(--c-on-night); }
.mzs-market p { color: var(--c-on-night-2); font-size: var(--fs-small); line-height: 1.7; }

/* ---------- contact ---------- */
.mzs-contact {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--s-8);
	align-items: start;
}

.mzs-contact__info { display: grid; gap: var(--s-4); }

.mzs-contact__lines {
	display: grid;
	gap: var(--s-3);
	margin: var(--s-3) 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--fs-small);
}

.mzs-contact__lines span { display: block; color: var(--c-ink-2); font-size: var(--fs-tiny); }

/* ---------- phones and tablets ---------- */
@media (max-width: 63.99rem) {
	.mzs-hero { padding-block: var(--s-5) var(--s-6); }
	.mzs-hero__grid,
	.mzs-about,
	.mzs-contact { grid-template-columns: 1fr; gap: var(--s-6); }
	.mzs-hero__media { order: -1; }
	.mzs-hero__badge { display: none; }
	.mzs-divisions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mzs-markets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mzs-strip,
	[dir="rtl"] .mzs-strip { grid-template-columns: 1fr; padding: var(--s-4); gap: var(--s-4); }
}

@media (max-width: 47.99rem) {
	.mzs-divisions,
	.mzs-markets { grid-template-columns: 1fr; }
	.mzs-hero__actions .mzs-btn { flex: 1 1 0; }
}
