/*
	RTL exceptions only. Layout itself already uses logical properties (margin-inline,
	padding-inline, flexbox/grid) in style.css and flips automatically with dir="rtl".
	This file is for the genuine non-automatic cases: decorative gradients keyed to a
	physical direction, and the Arabic type stack.
*/

.star-divider::before { background: linear-gradient(90deg, transparent, var(--color-gold)); }
.star-divider::after { background: linear-gradient(90deg, var(--color-gold), transparent); }

/* Mirror the hero's trailing-half wedge wash (physical gradient angle). */
.hero {
	background:
		linear-gradient(245deg, transparent 45%, rgba(74, 55, 40, 0.35) 70%, rgba(var(--color-gold-rgb), 0.07) 100%),
		var(--color-ink);
}
/* Mirror the decorative floating circles to the trailing side. */
.hero::before { right: auto; left: -100px; }
.hero::after { left: auto; right: 10%; }

/* The photo hero overrides the wedge wash above with its own scrim; that
   scrim's heavy side has to follow the text, so flip its physical angle. */
:root { --hero-scrim-angle: 270deg; }
.hero-media { background: var(--color-ink); }

.whatsapp-btn svg, .btn svg { transform: scaleX(-1); }
/* .whatsapp-float is deliberately NOT mirrored here — see the comment in style.css */

html[lang^="ar"] .accent-gold { font-style: normal; }

body { font-family: var(--font-body-ar); }
h1, h2, h3, h4, .site-logo-text { font-family: var(--font-heading-ar); }

/* Arabic serif needs a touch more line room than Cormorant's tight 1.08 */
.hero h1 { line-height: 1.25; letter-spacing: 0; }