/* ============================================================
   Aqaris · Arabic product page (Figma "Aqaris ar version",
   frames 70:12185 / 70:12479 / 70:12742)
   Loaded only by ar/product.html, after home-ar.css and
   product.css. body is "home home-ar product": home-ar.css
   already mirrors the shared header, buttons, CTA and footer;
   these rules mirror the pd-* parts and set the Cairo sizes.
   ============================================================ */

/* ---------- Hero ---------- */
.home-ar .pd-hero h1 { font-size: 68px; line-height: 1.3; }

.home-ar .pd-play { right: auto; left: 32px; }
.home-ar .pd-video-caption { left: auto; right: 28px; }

/* ---------- Module explorer ---------- */
.home-ar .pd-head h2 { font-size: 46px; line-height: 1.32; }

.home-ar .pd-tab-label { padding-left: 0; padding-right: 16px; }
.home-ar .pd-tab { text-align: right; }
/* Figma: the active item keeps a 3px bar on its leading (right) edge only. */
.home-ar .pd-tab.is-active { border: 0; border-right: 3px solid var(--hp-indigo); }

/* ============================================================
   Small desktop (1025–1240)
   ============================================================ */
@media (max-width: 1240px) {
  .home-ar .pd-hero h1 { font-size: clamp(56px, 5.2vw, 68px); }
}

/* ============================================================
   Tablet (≤ 1024) — 768 frame
   ============================================================ */
@media (max-width: 1024px) {
  .home-ar .pd-hero h1 { font-size: 52px; line-height: 1.3; }
  .home-ar .pd-head h2 { font-size: 38px; }

  .home-ar .pd-play { left: 21px; }
  .home-ar .pd-video-caption { right: 21px; }

  /* Pills again: full outline instead of the sidebar bar */
  .home-ar .pd-tab.is-active { border: 1px solid var(--hp-indigo); }
}

/* ============================================================
   Mobile (≤ 640) — 390 frame
   ============================================================ */
@media (max-width: 640px) {
  .home-ar .pd-hero h1 { font-size: 36px; line-height: 1.3; }
  .home-ar .pd-head h2 { font-size: 30px; }

  .home-ar .pd-play { left: 10px; }
}