/* ==========================================================================
   Love Fine Art, Inc.  Arabic edition overlay (I18N-2)
   Loads AFTER site.css and motion.css on ar/ pages only. Equal specificity
   therefore wins on source order; where a page-local block in the <style>
   head could outrank a bare class, the rule is scoped under [dir="rtl"] so
   it carries the extra attribute weight and wins regardless of order.

   Sections:
     0. Faces (Amiri, IBM Plex Sans Arabic), Arabic + Latin subsets, local.
     1. Token stacks.
     2. Tracked-label resets (no tracking, no uppercase in Arabic script).
     3. Italic neutralisation (Arabic has no italic; block synthetic slant).
     4. Line-heights (Arabic needs more leading; ascenders and dots clip).
     5. RTL physical-property mirroring, under [dir="rtl"].
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Faces. Downloaded locally to assets/fonts/, same pattern as Libre
   Franklin; no external requests at runtime. Arabic and Latin subsets carry
   their own unicode-range so Latin fragments (address, legal name, the EN
   AR FR codes) resolve to the Latin subset and everything else falls back
   to Helvetica Neue by stack. Amiri: serif roles. IBM Plex Sans Arabic:
   sans roles, weights 300 and 500 matching the site's body and label weights.
   -------------------------------------------------------------------------- */

/* Amiri 400 — Arabic */
@font-face {
  font-family: "Amiri";
  src: url("fonts/amiri-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

/* Amiri 400 — Latin (address, email, Latin legal name) */
@font-face {
  font-family: "Amiri";
  src: url("fonts/amiri-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Amiri 700 — Arabic */
@font-face {
  font-family: "Amiri";
  src: url("fonts/amiri-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

/* Amiri 700 — Latin */
@font-face {
  font-family: "Amiri";
  src: url("fonts/amiri-700-latin.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* IBM Plex Sans Arabic 300 — Arabic */
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/plex-arabic-300.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

/* IBM Plex Sans Arabic 300 — Latin */
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/plex-arabic-300-latin.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* IBM Plex Sans Arabic 500 — Arabic */
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/plex-arabic-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC4, U+10EFC-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}

/* IBM Plex Sans Arabic 500 — Latin */
@font-face {
  font-family: "IBM Plex Sans Arabic";
  src: url("fonts/plex-arabic-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --------------------------------------------------------------------------
   1. Token stacks. Amiri for the serif roles, IBM Plex Sans Arabic for the
   sans roles; Helvetica Neue kept in the sans stack for the Latin runs.
   -------------------------------------------------------------------------- */

:root {
  --serif: "Amiri", serif;
  --sans: "IBM Plex Sans Arabic", "Helvetica Neue", sans-serif;
}

/* --------------------------------------------------------------------------
   2. Tracked-label resets. Arabic script never letter-spaces (tracking
   breaks the joins) and has no uppercase. Scoped under [dir="rtl"] so the
   page-local tracked labels (.hero-est, .footer-credit-line,
   .svc-points-label, .collection-links a, .svc-num) are outranked as well
   as the site.css ones. EXCEPTION: the .lang-switch codes are Latin
   wayfinding and keep their tracking, so the nav reset excludes them.
   -------------------------------------------------------------------------- */

[dir="rtl"] .eyebrow,
[dir="rtl"] .marker,
[dir="rtl"] .fact-label,
[dir="rtl"] .site-nav li:not(.lang-switch) a,
[dir="rtl"] .footer-fine,
[dir="rtl"] .hero-est,
[dir="rtl"] .footer-credit-line,
[dir="rtl"] .svc-points-label,
[dir="rtl"] .collection-links a,
[dir="rtl"] .svc-num {
  letter-spacing: 0;
  text-transform: none;
}

/* --------------------------------------------------------------------------
   3. Italic neutralisation. Arabic has no italic; a slanted request forces
   an ugly synthetic oblique. Container classes are named so the reset
   outranks the page-local and site.css figcaption rules (two-class weight).
   -------------------------------------------------------------------------- */

[dir="rtl"] .subtitle,
[dir="rtl"] .caption,
[dir="rtl"] .fact-note,
[dir="rtl"] .hero-deck,
[dir="rtl"] figure figcaption,
[dir="rtl"] .work figcaption,
[dir="rtl"] .work-sm figcaption,
[dir="rtl"] .roll figcaption,
[dir="rtl"] .index-strip figcaption {
  font-style: normal;
}

/* --------------------------------------------------------------------------
   4. Line-heights. Arabic needs more air; the hero drops its sub-1 leading
   so ascenders and dots clear.
   -------------------------------------------------------------------------- */

[dir="rtl"] body {
  line-height: 1.9;
}

[dir="rtl"] .hero-title {
  line-height: 1.15;
}

[dir="rtl"] .display {
  line-height: 1.2;
}

[dir="rtl"] .numeral {
  line-height: 1;
}

[dir="rtl"] .ledger-body {
  line-height: 1.9;
}

[dir="rtl"] .prose .lede {
  line-height: 1.8;
}

[dir="rtl"] .hero-deck {
  line-height: 1.65;
}

/* --------------------------------------------------------------------------
   5. RTL mirroring. The grid/flex layout mirrors automatically under
   dir="rtl"; only the physical properties in site.css need flipping. The
   monogram SVG, the TEC stag and every artwork are NEVER transform-mirrored;
   only positions and border sides move. The homepage h4-slide translateX
   sign is mirrored by a page-local override in ar/index.html, not here.
   -------------------------------------------------------------------------- */

/* Ledger item: padding and the L marker move to the right, the bracket
   flips so it still opens toward the text. */
[dir="rtl"] .ledger > li {
  padding-left: 0;
  padding-right: 2.75rem;
}

[dir="rtl"] .ledger > li::before {
  left: auto;
  right: 0;
  border-left: 0;
  border-right: var(--bracket-stroke) solid var(--navy);
}

[dir="rtl"] .navy-band .ledger > li::before {
  border-right-color: var(--on-navy);
}

/* Marker bracket: border-left becomes border-right (currentColor carries
   navy and on-navy both). */
[dir="rtl"] .marker::before {
  border-left: 0;
  border-right: var(--bracket-stroke) solid currentColor;
}

/* Bracket frame: corners mirror. Top-left opening down-right becomes
   top-right opening down-left; bottom-right becomes bottom-left. */
[dir="rtl"] .bracket-frame::before {
  left: auto;
  right: 0;
  border-left: 0;
  border-right: var(--bracket-stroke) solid var(--navy);
}

[dir="rtl"] .bracket-frame::after {
  right: auto;
  left: 0;
  border-right: 0;
  border-left: var(--bracket-stroke) solid var(--navy);
}

/* Bracket corner: the single L moves to the top-right. */
[dir="rtl"] .bracket-corner {
  padding: var(--bracket-arm-lg) var(--bracket-arm-lg) 0 0;
}

[dir="rtl"] .bracket-corner::before {
  left: auto;
  right: 0;
  border-left: 0;
  border-right: var(--bracket-stroke) solid var(--navy);
}

/* Bracket devices on the navy band keep their light stroke after the flip. */
[dir="rtl"] .navy-band .bracket-frame::before,
[dir="rtl"] .navy-band .bracket-corner::before {
  border-right-color: var(--on-navy);
}

[dir="rtl"] .navy-band .bracket-frame::after {
  border-left-color: var(--on-navy);
}

/* Off-axis blocks: the auto margin swaps side. */
[dir="rtl"] .offset-right {
  margin-left: 0;
  margin-right: auto;
}

[dir="rtl"] .pull-left {
  margin-left: 0;
  margin-right: clamp(-7rem, -9vw, -2rem);
}

/* Footer address alignment mirrors. */
[dir="rtl"] .site-footer address {
  text-align: left;
}

/* Ghost monogram anchors to the opposite edge (repositioned, not flipped). */
[dir="rtl"] .hero-mark {
  right: auto;
  left: -6vw;
}

[dir="rtl"] .hero-mark--inset {
  right: auto;
  left: clamp(1.5rem, 6vw, 5rem);
}

/* Underline draw grows from the trailing edge. */
[dir="rtl"] .site-nav a::after,
[dir="rtl"] .collection-head a::after {
  transform-origin: right center;
}

/* The est. prefix inside the numeral sits before the digits in reading
   order; its gap moves to the inline-end (left in RTL). */
[dir="rtl"] .numeral .numeral-est {
  margin-right: 0;
  margin-left: 0.2em;
}

/* The roll mask and the roll-drift loop are direction-neutral and stay as
   authored; a wrap seam, if one appears in the render pass, is fixed on the
   page, not here. */

/* --------------------------------------------------------------------------
   Bidi isolation for Latin runs in the shared chrome. Without isolation the
   RTL paragraph context reorders leading digits and trailing punctuation
   ("18 East ..." renders with the 18 flung to the far end; the legal name's
   period jumps to the front). The runs are Latin by rule (address, legal
   name, email), so they render as LTR islands.
   -------------------------------------------------------------------------- */
[dir="rtl"] .site-footer address,
[dir="rtl"] .footer-name {
  direction: ltr;
  unicode-bidi: isolate;
}

/* --------------------------------------------------------------------------
   Arabic display headroom inside the masked line reveals. The clip box
   carries 0.14em below for Didot descenders and nothing above; Amiri's
   ascenders and the madda ride far past the Latin cap height, so tops
   shear off. The padding extends the clip window upward; the negative
   margin holds the composed position.
   -------------------------------------------------------------------------- */
[dir="rtl"] .m-lines .m-line-box {
  padding-top: 0.32em;
  margin-top: -0.32em;
}

/* Letter-spacing is structural damage to joined Arabic script: the
   entrance tracking ease would unjoin words mid-animation. The track
   animation rests at zero on RTL pages. */
html.m-js[dir="rtl"] .m-track[data-m-ls],
html.m-js[dir="rtl"] .m-track[data-m-ls].m-in,
html.m-js.m-hero-go[dir="rtl"] .m-hero .m-track[data-m-ls] {
  letter-spacing: 0;
  transition: none;
}

/* Dual naming (I18N-5): the Latin artist name rides beneath the Arabic
   form in captions and index lists so recognition is never in question.
   Latin runs render as LTR islands inside the RTL text. */
[dir="rtl"] .name-latin {
  text-align: right;
  display: block;
  font-family: var(--sans);
  font-size: 0.85em;
  font-style: normal;
  letter-spacing: 0.02em;
  color: var(--ink-soft);
  direction: ltr;
  unicode-bidi: isolate;
  margin-top: 0.2em;
}

[dir="rtl"] .navy-band .name-latin {
  color: var(--on-navy-soft);
}

/* No-JS fallback for RTL rolls: the shared keyframe travels negative-X,
   which empties the viewport when the track extends leftward. Positive
   travel wraps just as seamlessly over the duplicated half. */
@keyframes roll-drift-rtl {
  from { transform: translateX(0); }
  to { transform: translateX(50%); }
}

[dir="rtl"] .roll-track {
  animation-name: roll-drift-rtl;
}