/* ==========================================================================
   RTL-specific geometry overrides.
   Text alignment, spacing and flow already mirror automatically via
   logical properties (margin-inline-*, inset-inline-*, text-align:start
   etc.) used throughout base/layout/components. This file only handles
   things logical properties can't reach: diagonal clip-paths, gradient
   angles, and directional (arrow/chevron) iconography.
   ========================================================================== */

[dir="rtl"] .hero__diag{
  background:
    radial-gradient(42% 58% at 20% 32%, rgba(180,42,42,.62) 0%, transparent 68%),
    radial-gradient(34% 46% at 6% 4%, rgba(203,169,119,.30) 0%, transparent 72%),
    radial-gradient(52% 62% at 96% 102%, rgba(122,31,31,.58) 0%, transparent 66%),
    radial-gradient(26% 34% at 74% 88%, rgba(90,86,84,.4) 0%, transparent 70%),
    linear-gradient(180deg, #1a1714 0%, #201c19 50%, #161310 100%);
}
[dir="rtl"] .hero__diag::before{
  background:radial-gradient(40% 55% at 18% 30%, rgba(203,169,119,.20) 0%, transparent 70%);
}
[dir="rtl"] .hero__diag::after{
  background:
    linear-gradient(238deg, transparent 60%, rgba(203,169,119,.14) 63.5%, transparent 67%),
    radial-gradient(120% 120% at 50% 45%, transparent 55%, rgba(0,0,0,.4) 100%);
}
[dir="rtl"] .page-header::before{
  clip-path:polygon(0 0,100% 0,100% 100%,0 82%);
  background:
    radial-gradient(55% 130% at 10% 0%, rgba(180,42,42,.55) 0%, transparent 65%),
    radial-gradient(40% 100% at 0% 10%, rgba(203,169,119,.22) 0%, transparent 68%),
    radial-gradient(45% 90% at 94% 100%, rgba(122,31,31,.4) 0%, transparent 65%),
    linear-gradient(180deg, #1a1714 0%, #201c19 55%, #161310 100%);
}
[dir="rtl"] .page-header::after{
  clip-path:polygon(0 0,100% 0,100% 100%,0 82%);
  background:
    linear-gradient(240deg, transparent 58%, rgba(203,169,119,.22) 62%, transparent 67%),
    radial-gradient(120% 120% at 50% 40%, transparent 55%, rgba(0,0,0,.32) 100%);
}
[dir="rtl"] .diagonal-cta::before{
  clip-path:polygon(12% 0,100% 0,100% 100%,0 100%);
  background:
    radial-gradient(50% 140% at 92% 100%, rgba(180,42,42,.5) 0%, transparent 62%),
    radial-gradient(35% 90% at 70% 0%, rgba(203,169,119,.2) 0%, transparent 65%),
    linear-gradient(180deg, #1a1714 0%, #201c19 55%, #161310 100%);
}

/* Directional (arrow / chevron) icons flip so they still point toward
   "forward" in reading order */
[dir="rtl"] .cat-card__link svg,
[dir="rtl"] .breadcrumbs svg,
[dir="rtl"] .btn svg.arrow,
[dir="rtl"] .accordion__trigger svg.chevron-side,
[dir="rtl"] .to-top svg{
  transform:scaleX(-1);
}
[dir="rtl"] .cat-card:hover .cat-card__link svg{ transform:scaleX(-1) translateX(4px); }

/* Cable-current divider path direction (see main.js) reads the opposite
   way in RTL so the "flow" still moves start\u2192end */
[dir="rtl"] .cable-divider .current-path{ animation-direction:reverse; }