/* =========================================================================
   Alrasly — Legal pages (/privacy, /terms). Navy hero band over a light,
   readable prose body (~70ch measure). Same offwhite + faint-grid surface as the
   other sub-pages. Brand law (CLAUDE.md): palette only via tokens, radius 0,
   squares only, AAA.
   ========================================================================= */

.lg{ position:relative; background:var(--offwhite); color:var(--ink); }
.lg::before{
	content:""; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5;
	background-image:
		linear-gradient(rgba(41,37,97,.04) 1px,transparent 1px),
		linear-gradient(90deg,rgba(41,37,97,.04) 1px,transparent 1px);
	background-size:72px 72px;
}
.lg-hero,.lg-main{ position:relative; z-index:1; }

/* ---------- kicker ---------- */
.lg-kick{ display:flex; align-items:center; gap:var(--space-3); margin:0 0 var(--space-4); }
.lg-tick4{ display:grid; grid-template-columns:9px 9px; grid-template-rows:9px 9px; gap:2px; flex:0 0 auto; }
.lg-tick4 i{ width:9px; height:9px; display:block; }
.lg-kick__t{ font-size:var(--fs-caption); font-weight:var(--fw-bold); letter-spacing:.22em; text-transform:uppercase; color:var(--sky); }
[dir="rtl"] .lg-kick__t{ letter-spacing:normal; text-transform:none; }

/* ---------- HERO (navy band, same treatment as the other sub-pages) ---------- */
.lg-hero{
	color:var(--white); overflow:hidden;
	background-image:
		radial-gradient(120% 90% at 82% 18%,rgba(9,91,244,.5),transparent 55%),
		radial-gradient(110% 90% at 95% 95%,rgba(85,70,250,.45),transparent 50%),
		linear-gradient(135deg,#211d4e,#292561 50%,#191636);
	padding-block:clamp(72px,10vw,116px) var(--space-8);
}
.lg-hero__title{ font-size:var(--fs-display); line-height:var(--lh-display); font-weight:var(--fw-bold); letter-spacing:-1px; color:var(--white); margin:0; }
.lg-hero__meta{ font-size:var(--fs-small); color:rgba(255,255,255,.8); margin:var(--space-4) 0 0; }

/* ---------- PROSE BODY (~70ch measure) ---------- */
.lg-prose{ max-width:72ch; padding-block:var(--space-8); }
.lg-sec{ margin-bottom:var(--space-7); }
.lg-sec:last-child{ margin-bottom:0; }
.lg-h2{ font-size:var(--fs-h3); line-height:var(--lh-h3); font-weight:var(--fw-bold); color:var(--navy); margin:0 0 var(--space-4); letter-spacing:-.3px; }
.lg-p{ font-size:var(--fs-body); line-height:var(--lh-body); color:var(--ink); margin:0 0 var(--space-4); }
.lg-p:last-child{ margin-bottom:0; }
.lg-p a{ color:var(--blue); font-weight:var(--fw-semibold); }
.lg-p a:hover{ color:var(--blue-hover); text-decoration:underline; }

/* ---------- Motion — sitewide reveal (gated behind .js; no-JS shows everything) ---------- */
.js .lg [data-reveal]{ opacity:0; transform:translateY(12px); transition:opacity .25s ease, transform .25s ease; }
.js .lg [data-reveal].is-visible{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
	.js .lg [data-reveal]{ opacity:1 !important; transform:none !important; transition:none !important; }
}