/*
 * Right-to-left corrections, loaded on top of theme.css (not instead of it).
 *
 * theme.css is written in logical properties — margin-inline-start,
 * inset-inline-end, text-align: start — so nearly all of the layout mirrors
 * itself with no help. This file exists only for the handful of things CSS
 * logical properties cannot express: physical transforms, an animation whose
 * direction is baked into a percentage, and a glyph that points one way.
 *
 * Keep it this small. Anything that can be fixed with a logical property in
 * theme.css belongs there instead — a rule in this file is a rule that has to
 * be kept in step with its left-to-right twin forever.
 */

/* ---------------------------------------------------------------------------
 * Arrows
 *
 * The markup uses a literal → (&rarr;), which points the wrong way when the
 * text around it runs right to left. Mirroring the glyph rather than swapping
 * it for ← keeps one string in the templates, and keeps the hover nudge below
 * consistent with whichever way it now points.
 * ------------------------------------------------------------------------ */
.arw {
	display: inline-block;
	transform: scaleX(-1);
}

/*
 * The hover nudges move the arrow "forward". Forward is -X here.
 * These override the +4px/+5px in theme.css; the scaleX(-1) above is on the
 * glyph's own rule, so it is not lost when transform is set again here.
 */
.btn:hover .arw,
.route:hover .go .arw,
.svc:hover .go .arw,
a.htl-card:hover .go .arw,
.mow-explore li a:hover .arw {
	transform: scaleX(-1) translateX(4px);
}

/* ---------------------------------------------------------------------------
 * Keyword ticker
 *
 * The track is a flex row, so under dir="rtl" it already lays out from the
 * right. The animation still slides it by a fixed -50%, which now moves it
 * away from the reader instead of towards them, and the loop point never
 * meets. Reversing the sign restores the seam.
 * ------------------------------------------------------------------------ */
@media (prefers-reduced-motion: no-preference) {
	@keyframes ut-slide {
		to { transform: translateX(50%); }
	}
}

/* ---------------------------------------------------------------------------
 * Model dial
 *
 * The SVG is a symmetric triangle and must NOT be mirrored — flipping it
 * would reverse the reading order of the three vertex labels inside it, which
 * are real words, not decoration. Stated explicitly so a later "mirror
 * everything" pass does not sweep it up.
 * ------------------------------------------------------------------------ */
.dial svg {
	transform: none;
}

/* ---------------------------------------------------------------------------
 * Persian typography
 *
 * Vazirmatn's glyphs sit taller in the em box than Poppins' do, and Persian
 * words carry no ascender/descender rhythm to break up a line, so the same
 * line-height that reads comfortably in English reads cramped here. The
 * letterforms also stop tracking from helping — it only pushes joined letters
 * apart — so it is reset on the elements that set it for Latin display type.
 * ------------------------------------------------------------------------ */
:root:lang(fa) {
	line-height: 1.85;
}

:lang(fa) h1,
:lang(fa) h2,
:lang(fa) h3,
:lang(fa) h4,
:lang(fa) .eyebrow,
:lang(fa) .is-eyebrow,
:lang(fa) .site-footer-heading {
	letter-spacing: normal;
	line-height: 1.5;
}

/*
 * The dial's encircling "DOING" label is letter-spaced in the SVG itself
 * (letter-spacing="3"), which would pull a joined Persian word apart.
 */
:lang(fa) .dial .node-cap {
	letter-spacing: normal;
}


/* ---------------------------------------------------------------------------
 * The MOW figure is deliberately NOT mirrored
 *
 * .mow-node and the .mow-chips overlay position their labels with physical
 * `left`/`top` rather than logical inset properties, and there is no rule
 * here to flip them. That is the intended behaviour, not an oversight.
 *
 * The labels are placed on the same 760x720 coordinate grid the SVG draws in.
 * Logical properties would mirror the labels while leaving the SVG geometry
 * where it is, putting Being's name on Becoming's corner. Mirroring both
 * would be worse still: the model's vertices are a published figure, and a
 * reader following the book alongside the site would find its corners swapped.
 *
 * The text inside each label still runs right to left, which is the part that
 * should change.
 * ------------------------------------------------------------------------ */
