/* =====================================================================
   English (LTR) page only. Loaded AFTER style.css by en.html.
   style.css itself is not modified: it uses logical properties, so most
   of the layout mirrors automatically. Only physical-direction details
   (animation origins, arrows, mask directions) are corrected here.
   ===================================================================== */

/* progress bar + loader line grow from the left */
.progress i,
.loader-line i { transform-origin: left; }

/* teaching rows: hover sweep from the left, arrow points right */
.rows li::before {
  transform-origin: left;
  background: linear-gradient(90deg, rgba(111, 155, 255, .13), transparent);
}
.row-arrow { transform: translateX(-10px); }
.rows li:hover .row-arrow { transform: none; }

/* ↗ arrow nudges toward its own direction (up and to the right) */
.social a:hover i { transform: translate(3px, -3px); }

/* hero banner (if used): fade toward the right instead of the left */
.hero-banner img {
  -webkit-mask-image: linear-gradient(to right, #000 8%, transparent 95%), linear-gradient(to bottom, #000 40%, transparent 98%);
  mask-image: linear-gradient(to right, #000 8%, transparent 95%), linear-gradient(to bottom, #000 40%, transparent 98%);
}

/* Latin typography: Persian needs generous line-height and zero tracking;
   English reads better tighter */
body { line-height: 1.75; }
.display, h2 { letter-spacing: -.015em; line-height: 1.12; }
h2 { max-width: 20ch; line-height: 1.2; }
.mind-title { max-width: none; }
.prose, .sub, .lede { line-height: 1.8; }
.lede { max-width: 34ch; }
nav#nav a { font-size: .86rem; }
.card h3, .tcard h3 { line-height: 1.35; }

/* English hero title: smaller so "Dr. Mohamad / Kiani Abri" sits on two lines */
.display { font-size: clamp(2.4rem, 7.2vw, 5.8rem); }
.contact .display { max-width: none; }