/*
 * Typography architecture.
 *
 * Planned families (Scope v1.4 §6):
 * - Thmanyah Sans          → UI, body, navigation, forms, buttons.
 * - Thmanyah Serif Display → hero, headlines, cinematic moments.
 *
 * The @font-face rules live in fonts.css, loaded by inc/fonts.php only when
 * the font files are installed. They are git-ignored (licence: no
 * redistribution), so a fresh clone has none; browsers then fall through to the
 * system stacks below and text stays readable.
 *
 * Arabic rule: never apply letter-spacing to Arabic text — it breaks the
 * connections between letters. Tracking is a Latin-only adjustment.
 */

:root {
	/* "GB Superscripts" covers only ² ³ ¹ (fonts.css, D-89); every other character skips it. */
	--gb-font-sans: "GB Superscripts", "Thmanyah Sans", system-ui, "Segoe UI", Tahoma, "Geeza Pro", "Noto Sans Arabic", Arial, sans-serif;
	--gb-font-display: "GB Superscripts", "Thmanyah Serif Display", "Noto Naskh Arabic", "Times New Roman", Georgia, serif;

	--gb-weight-regular: 400;
	--gb-weight-medium: 500;
	--gb-weight-bold: 700;
}

body {
	font-family: var(--gb-font-sans);
	font-size: var(--gb-step-0);
	line-height: var(--gb-leading-body);
	font-weight: var(--gb-weight-regular);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	line-height: var(--gb-leading-heading);
	font-weight: var(--gb-weight-bold);
	text-wrap: balance;
}

/* Display face only for the top two levels; smaller headings stay in Sans for legibility. */
h1,
h2 {
	font-family: var(--gb-font-display);
}

h1 { font-size: var(--gb-step-5); }
h2 { font-size: var(--gb-step-4); }
h3 { font-size: var(--gb-step-3); }
h4 { font-size: var(--gb-step-2); }
h5 { font-size: var(--gb-step-1); }
h6 { font-size: var(--gb-step-0); }

/*
 * Short texts break into balanced lines (owner request): «تصاميم للمنصات
 * والمطبوعات / بهوية واحدة متسقة.» instead of a long line and a stub.
 * Browsers apply balance only to short blocks (a few lines), so it suits
 * headings, leads and card texts. Long-form content keeps "pretty" (below).
 */
p {
	text-wrap: balance;
}

.gb-entry__content p {
	text-wrap: pretty;
}

/*
 * A long page of plain text (the privacy policy, before going live): its
 * section headings are signposts, not page titles — smaller than the site's
 * display headings, with air above, and the lists with room to read.
 */
.gb-entry__content h2 {
	margin-block-start: 1.6em;
	font-size: var(--gb-step-2);
	line-height: 1.3;
}

.gb-entry__content ul,
.gb-entry__content ol {
	padding-inline-start: 1.4em;
}

.gb-entry__content li + li {
	margin-block-start: 0.35em;
}

/* Stretched (kashida) titles: keep each stretched word in one piece. */
.gb-kashida {
	word-spacing: 0.05em;
}

small {
	font-size: var(--gb-step--1);
}

/*
 * A Latin product name with a superscript digit («M²», inc/text.php →
 * gb_theme_text_marks()). Kept left-to-right as one unit (never split by the
 * Arabic line), a touch bolder than the text around it, the digit raised and
 * small, in the seed's colour — a quiet mark, not a logo.
 */
.gb-latin-mark {
	display: inline-block;
	font-weight: var(--gb-weight-bold);
	unicode-bidi: isolate;
	white-space: nowrap;
}

.gb-latin-mark sup {
	position: relative;
	inset-block-start: -0.05em;
	margin-inline-start: 0.01em;
	font-size: 0.55em;
	line-height: 0;
	vertical-align: super;
	color: var(--gb-seed);
}

/* On dark scenes the seed blue is too deep to read: the light turquoise instead. */
.gb-page-hero .gb-latin-mark sup,
.gb-section--dark .gb-latin-mark sup,
.gb-work-card__visual .gb-latin-mark sup {
	color: var(--gb-primary);
}