/* r7c-en (11-08): /en = the Hebrew page, mirrored for LTR. Loaded by en.html only; every rule is scoped to html[lang=en]. */

/* text that v8.css aligns physically right */
html[lang=en] .hero-copy,html[lang=en] .consent,html[lang=en] .learning-overlay{text-align:left}
html[lang=en] .watch-link:after,html[lang=en] .video-external:after,html[lang=en] .learning-replay:after{transform-origin:left}

/* hero composition: laptop on the left, phone on the right (mirror of / ) */
html[lang=en] .live-board{left:0;right:auto}
html[lang=en] .iphone{left:auto;right:0;direction:ltr}
html[lang=en] .legend .who i{margin-left:0;margin-right:4px}
html[lang=en] .r4 .legend .who b{margin-left:0;margin-right:4px}
@media(max-width:699px){
 html[lang=en] .live-board{left:0;right:auto}
 html[lang=en] .hero .r5 .board-display>.board-image{object-position:top left}
 html[lang=en] .iphone{left:auto;right:0}
 html[lang=en] .scene .legend{left:0;right:147px}
}
@media(max-width:360px){html[lang=en] .scene .legend{left:0;right:135px}}

/* WhatsApp bubbles: incoming on the left with the tail top-left, outgoing on the right */
html[lang=en] .message small{direction:ltr}
html[lang=en] .incoming{border-top-right-radius:8px;border-top-left-radius:0}
html[lang=en] .incoming + .incoming{border-top-left-radius:8px}
html[lang=en] .outgoing{border-top-left-radius:8px;border-top-right-radius:0}
html[lang=en] .outgoing + .outgoing{border-top-right-radius:8px}
html[lang=en] .incoming:not(.incoming + .incoming)::before{right:auto;left:-7px;clip-path:polygon(0 0,100% 0,100% 100%)}
html[lang=en] .outgoing:not(.outgoing + .outgoing)::before{left:auto;right:-7px;clip-path:polygon(0 0,100% 0,0 100%)}
html[lang=en] .chat-header .back{transform:rotate(180deg)}
html[lang=en] .chat-tile blockquote{border-right:0;border-left:3px solid #008069}

/* logo rail: the track moves right-to-left in LTR */
html[lang=en] .rail-track{animation-name:rail-ltr}
@keyframes rail-ltr{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* FAQ answers start under the question text (v8.css pads the right side for RTL) */
html[lang=en] .answer{padding:0 12px 24px 40px}
@media(max-width:699px){html[lang=en] .answer{padding:0 0 22px 31px}}

/* the English first line ("The system works for you,") is wider than the Hebrew one; keep it clear of the scene at 1080-1366 */
@media(min-width:1080px){html[lang=en] .hero h1{font-size:min(45px,calc(3.6vw - 4px))}}
