/* ========================================================================
   Ərəb dili üçün RTL qatı.

   Yalnız dir="rtl" olanda qüvvəyə minir, digər dillərə heç bir təsiri yoxdur.
   Flex və grid istiqaməti brauzerin özü çevirir; burada yalnız AÇIQ şəkildə
   sol/sağ yazılmış qaydalar güzgülənir — onları brauzer çevirmir.
   ======================================================================== */

@font-face{
  font-family:'Cairo';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(/assets/cairo.ttf) format('truetype-variations');
}

[dir="rtl"]{
  --font:'Cairo','Manrope',Arial,sans-serif;
  font-family:var(--font);
}
[dir="rtl"] body,
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] p,
[dir="rtl"] a,[dir="rtl"] button,[dir="rtl"] summary,[dir="rtl"] li,[dir="rtl"] th,[dir="rtl"] td{
  font-family:'Cairo','Manrope',Arial,sans-serif;
}

/* Ərəb hərfləri sıx letter-spacing ilə qırılır — açırıq. */
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,
[dir="rtl"] .hero h1,[dir="rtl"] .hero.hero-v3 h1,
[dir="rtl"] .price b,[dir="rtl"] .final-cta h2,[dir="rtl"] .label-copy h2{
  letter-spacing:normal;
}
[dir="rtl"] .eyebrow,[dir="rtl"] .hero-v3-free,[dir="rtl"] .announcement-badge,
[dir="rtl"] .plan-ribbon,[dir="rtl"] .release-badge{ letter-spacing:.4px }

/* ---- ümumi mətn hizalanması ---- */
[dir="rtl"] .hero-description,[dir="rtl"] .section-intro,[dir="rtl"] .benefit p,
[dir="rtl"] .step p,[dir="rtl"] .plan-description,[dir="rtl"] .faq-item p,
[dir="rtl"] .pricing-after>p,[dir="rtl"] .footer-top>div>p{ text-align:right }
[dir="rtl"] tbody th{ text-align:right }

/* ---- naviqasiya və zolaqlar ---- */
[dir="rtl"] .skip{ left:auto; right:20px }
[dir="rtl"] .language-menu{ right:auto; left:0 }
[dir="rtl"] .announcement-cta{ margin-left:0; margin-right:auto }
[dir="rtl"] .announcement-badge{ padding:5px 9px 5px 11px }
[dir="rtl"] .status-dot{ margin-right:0; margin-left:8px }

/* ---- HERO ---- */
[dir="rtl"] .hero-art{ padding-left:0; padding-right:15px }
[dir="rtl"] .hero-sticker{ right:auto; left:-22px; transform:rotate(-13deg) }
[dir="rtl"] .hero-sticker span{ transform:rotate(13deg) }
[dir="rtl"] .floating-release{ left:auto; right:-24px; transform:rotate(4deg) }
[dir="rtl"] .mini-cover>span{ right:auto; left:3px }
[dir="rtl"] .equalizer{ margin-left:0; margin-right:14px }
[dir="rtl"] .portrait figcaption>span:last-child{ margin-left:0; margin-right:auto }
[dir="rtl"] .underlined:after{ left:-7px; right:-4px; transform:rotate(2deg) }

[dir="rtl"] .hero-v3-portrait{ transform:rotate(4deg); margin:0 2% 0 0 }
[dir="rtl"] .hero-v3-record{ right:auto; left:-49px; transform:rotate(-16deg) }
[dir="rtl"] .hero-v3-art:hover .hero-v3-record{ transform:rotate(-32deg) }
[dir="rtl"] .hero-v3-side{ right:auto; left:0 }
[dir="rtl"] .hero-v3-label{ left:auto; right:3% }
[dir="rtl"] .hero-v3-free{ padding:9px 13px 9px 16px }

/* ---- panel önizləməsi ---- */
[dir="rtl"] .dashboard{ transform:rotate(2deg) }
[dir="rtl"] .dashboard-side{ border-right:0; border-left:1px solid #363b30 }
[dir="rtl"] .dash-corner{ right:auto; left:-20px; transform:rotate(12deg) }
[dir="rtl"] .artist-demo-row small{ margin-left:0; margin-right:auto }
[dir="rtl"] .cover-gece:before{ left:auto; right:23% }
[dir="rtl"] .cover-ses:before{ left:auto; right:-20%; transform:rotate(42deg) }
[dir="rtl"] .cover-axin:before{ transform:rotate(-35deg) }

/* ---- tariflər və leybl bloku ---- */
[dir="rtl"] .plan-ribbon{ left:50%; transform:translateX(-50%) }
[dir="rtl"] .permission-dot{ right:auto; left:9px }
[dir="rtl"] .big-asterisk{ right:auto; left:-12px; transform:rotate(12deg) }
[dir="rtl"] .label-root{ transform:rotate(3deg) }
[dir="rtl"] .card-0{ transform:rotate(5deg) }
[dir="rtl"] .card-2{ transform:rotate(-5deg) }
[dir="rtl"] .connector:before{ left:auto; right:-105px }

/* ---- siyahılar, cədvəl, altlıq ---- */
[dir="rtl"] .check-list li,[dir="rtl"] .plan li{ flex-direction:row-reverse; justify-content:flex-end }
[dir="rtl"] .bul::before{ left:auto; right:-5mm }
[dir="rtl"] .toast{ left:50%; transform:translateX(-50%) }
[dir="rtl"] .consent-card{ right:auto; left:24px }
[dir="rtl"] .cta-orbit>span{ transform:rotate(-10deg) }

/* ---- lent animasiyası tərsinə ---- */
[dir="rtl"] .marquee-track,[dir="rtl"] .creative-tape>div{ animation-direction:reverse }