/**
 * Legal / policy page typography.
 *
 * Loaded only on pages in the `footer_legal` menu (see inc/legal-pages.php), so nothing here can
 * reach blog posts — which share Astra's `.entry-content` and must keep their existing type scale.
 *
 * What it fixes, all measured on this build before writing a rule:
 *   - `<h2>` rendered at 56px against a 26px `<h1>` — the section headings were larger than the page
 *     title. A policy needs the opposite: a clear title and quiet, scannable section headings.
 *   - headings had `margin-top: 0`, so sections ran into the paragraph above them.
 *   - prose ran to ~123 characters per line; comfortable reading is 50–80.
 *   - list items had no vertical rhythm, which matters here because the substance of a privacy
 *     policy is mostly lists.
 *
 * Specificity: `.saiftec-legal .entry-content h2` is 0,2,1 — enough to beat Astra's
 * `.entry-content h2` (0,1,1) without !important. Astra sets heading sizes via CSS custom
 * properties on some builds, so sizes are stated as concrete values, not var() overrides.
 */

.saiftec-legal .entry-content {
	--legal-measure: 68ch;
	--legal-rule: #e4e7f2;
	--legal-ink: #2c3145;
	--legal-head: #101436;
	--legal-accent: var(--mm-accent, #0aa3d6);
	max-width: var(--legal-measure);
	color: var(--legal-ink);
	font-size: 1.0625rem;
	line-height: 1.7;
}

/* ---- the navy title band ----
 * Rendered by inc/legal-pages.php on `astra_content_before`, i.e. outside the boxed container, so it
 * is full-bleed. It replaces Astra's `header.entry-header > h1.entry-title`, whose rules used to live
 * here — deleted with the markup rather than left behind, because a dead rule at equal specificity is
 * exactly what silently broke `.svc1-process` and the `.ind-cta` band elsewhere in this project.
 *
 * Values are matched to the /contact/ hero (Elementor container `be6fc6b`), measured rather than
 * guessed: navy #170D3D, overlay attachment #1959 bottom-right at 50% width and 0.15 opacity,
 * inner max-width min(100%, 1200px), H1 Heebo 68px/1.2 weight 500, sub-headline 20px weight 600.
 *
 * The generous top padding is not decoration: the site header is `position:absolute` and ~152px tall
 * on desktop, so the title has to start below it.
 */
.saiftec-legal .lg-hero {
	position: relative;
	overflow: hidden;
	background: #170D3D;
	/* 260/40/40 and the two breakpoints below are the /contact/ hero container's own padding values,
	   copied rather than eyeballed, so the two bands are the same height to the pixel. */
	padding: 260px 40px 40px;
}
/* Own `::before` freely here — this is theme markup, not an Elementor `.e-con`.
   `--lg-overlay` is emitted by inc/legal-pages.php from attachment #1959, rather than written here as
   a relative `../../../uploads/2026/02/…` path that would break the day the file is re-uploaded. No
   custom property means no overlay, which is a clean degradation. */
.saiftec-legal .lg-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: var(--lg-overlay, none);
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: 50%;
	opacity: .15;
	pointer-events: none;
}
.saiftec-legal .lg-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 1200px;
	margin: 0 auto;
}
.saiftec-legal .lg-hero__title {
	margin: 0 0 12px;
	color: #fff;
	font-family: "Heebo", sans-serif;
	font-weight: 500;
	font-size: 68px;
	line-height: 1.2;
}
.saiftec-legal .lg-hero__subtitle {
	margin: 0;
	max-width: 62ch;
	color: #fff;
	font-family: "Heebo", sans-serif;
	font-weight: 600;
	font-size: 20px;
	line-height: 1.32;
}
/* Astra's H1 sizes come from custom properties on some builds, hence concrete values and the
   breakpoints below rather than a clamp() that would fight them. */
@media (max-width: 921px) {
	.saiftec-legal .lg-hero { padding: 160px 32px 32px; }
	.saiftec-legal .lg-hero__title { font-size: 48px; }
	.saiftec-legal .lg-hero__subtitle { font-size: 18px; }
}
@media (max-width: 767px) {
	.saiftec-legal .lg-hero { padding: 120px 24px 24px; }
	.saiftec-legal .lg-hero__title { font-size: 34px; }
	.saiftec-legal .lg-hero__subtitle { font-size: 16px; }
	.saiftec-legal .lg-hero::before { background-size: 80%; }
}

/* Astra's boxed article carries 85px of top padding, which on top of the 64px above the card left
   149px of white between the hero and the first line — it read as a mistake rather than as breathing
   room. Trimmed on these pages only; the side and bottom padding keep the boxed-card look.
   Astra's own selector is `.ast-separate-container .ast-article-single` (0,2,0), so the body-class
   scope here is enough without !important. */
.saiftec-legal .ast-article-single {
	padding-top: 40px;
}
@media (max-width: 767px) {
	.saiftec-legal .ast-article-single { padding-top: 28px; }
}

/* ---- section headings: quiet, scannable, and clearly below the h1 ---- */
.saiftec-legal .entry-content h2 {
	margin: 2.4em 0 .6em;
	padding-top: 1.4em;
	border-top: 1px solid var(--legal-rule);
	color: var(--legal-head);
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1.3;
}

/* The first heading needs no rule — the title band already separates it. */
.saiftec-legal .entry-content > h2:first-of-type {
	margin-top: 1.6em;
	padding-top: 0;
	border-top: 0;
}

.saiftec-legal .entry-content h3 {
	margin: 1.8em 0 .45em;
	color: var(--legal-head);
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
}

/* ---- prose rhythm ---- */
.saiftec-legal .entry-content p {
	margin: 0 0 1.15em;
}

.saiftec-legal .entry-content ul,
.saiftec-legal .entry-content ol {
	margin: 0 0 1.3em;
	padding-left: 1.35em;
}

.saiftec-legal .entry-content li {
	margin-bottom: .5em;
	padding-left: .2em;
}

.saiftec-legal .entry-content li:last-child {
	margin-bottom: 0;
}

.saiftec-legal .entry-content li > ul,
.saiftec-legal .entry-content li > ol {
	margin-top: .5em;
}

/* The "Last updated" line, which is the first paragraph on every policy. */
.saiftec-legal .entry-content > p:first-child {
	display: inline-block;
	margin-bottom: 1.9em;
	padding: .45em .85em;
	border-radius: 4px;
	background-color: #f3f5fb;
	color: #4a5069;
	font-size: .9375rem;
}

.saiftec-legal .entry-content > p:first-child strong {
	font-weight: 600;
}

/* ---- links: underlined in body copy, because a policy is read not skimmed ---- */
.saiftec-legal .entry-content a {
	color: var(--legal-accent);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}

.saiftec-legal .entry-content a:hover,
.saiftec-legal .entry-content a:focus-visible {
	color: var(--legal-head);
}

/* ---- the cookie-policy comparison table ---- */
.saiftec-legal .entry-content table {
	width: 100%;
	margin: 0 0 1.6em;
	border-collapse: collapse;
	font-size: 1rem;
}

.saiftec-legal .entry-content :is(th, td) {
	padding: .7em .9em;
	border: 1px solid var(--legal-rule);
	text-align: left;
	vertical-align: top;
}

.saiftec-legal .entry-content th {
	background-color: #f7f8fc;
	color: var(--legal-head);
	font-weight: 600;
}

/* Narrow screens: a 2-column table is fine, but let it scroll rather than squeeze. */
@media (max-width: 600px) {
	.saiftec-legal .entry-content {
		font-size: 1rem;
	}

	.saiftec-legal .entry-content h2 {
		margin-top: 2em;
		font-size: 1.3125rem;
	}

	.saiftec-legal .entry-content table {
		display: block;
		overflow-x: auto;
	}
}