/* =========================================================
   Arabic edition: typography and right-to-left mirroring.
   Display: Alexandria. Text: IBM Plex Sans Arabic. Accent: Aref Ruqaa.
   ========================================================= */
:root {
  --sans: "IBM Plex Sans Arabic", "Plus Jakarta Sans", system-ui, sans-serif;
  --display: "Alexandria", "IBM Plex Sans Arabic", sans-serif;
  --serif: "Aref Ruqaa", "Alexandria", serif;
}

body { font-family: var(--sans); line-height: 1.85; }

/* Arabic letters join, so tracking must stay at zero; the Latin wordmark keeps its own. */
body *:not(.logo):not(.footer-word):not([lang="en"]) { letter-spacing: 0 !important; }
.logo, .footer-word, [lang="en"] { font-family: "Plus Jakarta Sans", system-ui, sans-serif; }

h1, h2, h3, .hero-title, .stats dt, .rv-score, .buy-price strong, .price, .post h3,
.drawer-head h2, .step-num, .bar-title, .opt-size strong, .end-h {
  font-family: var(--display);
}
h1, h2, h3 { line-height: 1.3; }
.article-head h1, .journal-head h1, .buy h1, .post-large h3 { line-height: 1.35; }
.journal-head h1 em { display: inline-block; margin-top: .1em; }
.section-head h2, .story-text h2, .cta h2, .journal-bar .bar-title { font-weight: 700; line-height: 1.35; }

/* Calligraphic accent in place of the English italic serif */
em, .section-head h2 em, .story-text h2 em, .cta h2 em, .journal-head h1 em, .bar-title em, .post-cta h3 em {
  font-family: var(--serif); font-style: normal; font-weight: 700; font-size: 1.08em;
}
.buy-note, .purity-badge strong, .story-quote blockquote { font-family: var(--serif); font-style: normal; font-weight: 400; }
.buy-note { font-size: 26px; line-height: 1.5; }
.story-quote blockquote { font-size: 24px; line-height: 1.6; }

/* Longer quotes read better in the display sans than in calligraphy */
.review-body blockquote, .article-lede, .prose blockquote p { font-family: var(--display); font-weight: 400; line-height: 1.7; }
.review-body blockquote { font-size: clamp(22px, 2.2vw, 28px); }
.article-lede { font-size: clamp(19px, 2vw, 23px); }
.prose blockquote p { font-size: clamp(22px, 2.4vw, 28px); font-weight: 500; }

/* ---------- Hero ---------- */
.hero::before { inset: -140px auto auto 0; }
.hero-title { line-height: 1.15; }
.hero-title .line-1 { font-size: clamp(54px, 7vw, 96px); line-height: 1.2; font-weight: 800; }
.hero-title .line-2 { padding-left: 0; padding-right: .5em; font-size: clamp(48px, 6.4vw, 88px); line-height: 1.35; font-weight: 800; -webkit-text-stroke-width: 1.4px; }
.hero-title .line-2::after { padding-right: inherit; padding-left: 0; }
.hero-lede { font-size: 18px; line-height: 1.9; }
.proof-faces img + img { margin-left: 0; margin-right: -12px; }
.hero-comb { right: auto; left: -6%; }
.feature-card { left: auto; right: -48px; }
.feature-go svg { transform: scaleX(-1); }
.bee-hero { left: auto; right: 4%; transform: scaleX(-1); }

/* ---------- Nav, cart badge ---------- */
.nav { padding: 8px 24px 8px 8px; }
.cart-count { right: auto; left: 0; }

/* ---------- Sections ---------- */
.trust-list li + li { border-left: 0; border-right: 1px solid var(--line); }
.stats > div:nth-child(odd) { border-right: 0; border-left: 1.5px dashed var(--line-strong); }
.star { margin-left: 0; margin-right: 6px; }
.purity-badge { left: auto; right: 24px; }
.tag, .gallery-main .tag { left: auto; right: 14px; }
.gallery-main .tag { right: 20px; }
.story-quote { right: auto; left: -40px; }
.story-text h2 { text-align: right; }
.steps li:not(:last-child)::before { left: auto; right: 25px; }
.bee-trail { right: auto; transition: left .8s var(--ease), right .8s var(--ease); }
.bee-footer { right: auto; left: 36px; transform: rotate(6deg); }
.cta::before { background: linear-gradient(270deg, rgba(42, 33, 3, .88) 0%, rgba(42, 33, 3, .6) 45%, rgba(42, 33, 3, 0) 78%); }
.review-nav svg, .gallery-nav svg { transform: scaleX(-1); }
.footer-word { direction: ltr; }

/* ---------- Shop, drawer, product page ---------- */
.drawer { right: auto; left: 0; transform: translateX(-100%); box-shadow: 30px 0 80px -30px rgba(42, 33, 3, .5); }
.drawer.open { transform: none; }
.drawer-head { padding: 20px 28px 16px 20px; }
.crumbs li + li::before { margin-right: 0; margin-left: 8px; }
.gallery-nav { right: auto; left: 20px; }
.specs dd { text-align: left; }
.rv-bars li span:last-child { text-align: left; }
.price, .opt-price, .line-end strong, .buy-price strong, #pdp-unit, #drawer-subtotal { unicode-bidi: isolate; }

/* ---------- Journal ---------- */
.post-cta::before { right: auto; left: -40px; }
.post h3 a { background-position: 100% 100%; }
.read-progress div { transform-origin: right; }
.toc ol { border-left: 0; border-right: 1.5px solid var(--line); }
.toc a { padding: 7px 16px 7px 0; margin-left: 0; margin-right: -1.5px; border-left: 0; border-right: 1.5px solid transparent; }
.prose { font-size: 19px; line-height: 2; }
.prose > p:first-child::first-letter { float: none; font-family: inherit; font-size: inherit; line-height: inherit; margin: 0; color: inherit; }
.prose ul { padding-right: 0; }
.prose li { padding-left: 0; padding-right: 30px; }
.prose li::before { left: auto; right: 4px; top: .8em; }
.prose blockquote { padding: 8px 28px 8px 0; border-left: 0; border-right: 3px solid var(--amber); }
.prose h2 { line-height: 1.4; }

/* ---------- Responsive mirrors ---------- */
@media (max-width: 1100px) {
  .trust-list li:nth-child(3) { border-right: 0; }
}
@media (max-width: 1000px) {
  .feature-card { right: 0; left: auto; }
  .story-quote { left: -16px; right: auto; }
}
@media (max-width: 820px) {
  .nav { padding: 8px 20px 8px 8px; }
  .lang-switch { height: 38px; padding: 0 12px; font-size: 13px; }
}
@media (max-width: 560px) {
  .hero-title .line-1 { font-size: 15vw; }
  .hero-title .line-2 { font-size: 13vw; padding-right: 0; -webkit-text-stroke-width: 1.1px; }
  .feature-card { left: 8px; right: 8px; }
  .hero-comb { left: -2%; right: auto; }
  .trust-list li { border-right: 0 !important; }
  .story-quote { left: auto; right: auto; }
  .drawer-head { padding: 20px 20px 16px 20px; }
  .prose { font-size: 18px; }
}