/* NAVO v7, the English page: what the RTL design needs to read left to right.
   Loaded after styles.css, on /en only. styles.css already uses logical properties for almost
   everything (padding-inline, inset-inline-start, border-start-end-radius, text-align: start),
   so the grid, the hero, the folder tabs, the cards, the footer and the floating bubble mirror by themselves.
   What is left is drawing and motion that were made for right to left. */

/* ---------- how it works: nothing to flip ----------
   main.js builds the line from where the numbers sit and reads the page's direction, so in English it starts on the left by itself. */

/* ---------- why NAVO: the table ----------
   Sara comes in from the side of the text and sits beside you. Mirror the drawing (no text in this SVG;
   the two labels are HTML around it), and her offset-path mirrors with it. */
.table-art svg { transform: scaleX(-1); }

/* the list: ticks on the left, lines running to the right. The tick marks themselves turn back,
   so a check still reads as a check */
.ticks { transform: scaleX(-1); }
.ticks .tk { transform-box: fill-box; transform-origin: center; transform: scaleX(-1); }

/* ---------- quotes: the papers tilt the other way, as in a mirror ---------- */
.note--1 { transform: rotate(1.6deg); }
.note--2 { transform: rotate(-.9deg); }
.note--3 { transform: rotate(.8deg); }  /* .note:hover in styles.css is more specific, so it still straightens them */

/* ---------- motion that has a side ----------
   Same names as in styles.css: this file comes later, so these win, on this page only. */
/* the hero photo opens from the edge next to the text */
@keyframes unveil { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0 0 0 0); } }
/* the objects of "how it works" enter from the reading side */
@keyframes in-drop { 0% { opacity: 0; transform: translateY(-70px) rotate(9deg); } 55% { opacity: 1; transform: translateY(8px) rotate(-2deg); } 78% { transform: translateY(-4px) rotate(1deg); } 100% { transform: none; } }
@keyframes in-slide { 0% { opacity: 0; transform: translateX(-90px) rotate(-8deg); } 100% { opacity: 1; transform: none; } }
@keyframes nudge { 0%, 92%, 100% { rotate: 0deg; } 94% { rotate: 12deg; } 96% { rotate: -10deg; } 98% { rotate: 6deg; } }

/* ---------- English type ----------
   The Hebrew headline sits at line-height .98; Latin has descenders (g, p, y) that need a little more room */
.hero__title { line-height: 1.02; }

/* the English headline is longer than the Hebrew one: a size where each line of Sara's two sentences stays on one line */
html[lang="en"] .hero__title { font-size: clamp(2.25rem, 1rem + 3.4vw, 4rem); }

/* the "go" arrow points forward, which is right in English */
.sheet__more::after { content: "\00a0\2192"; content: "\00a0\2192" / ""; }