/* Legal pages — the accessibility statement and the privacy policy. * * These pages are long-form documents rather than marketing sections, so they get a * reading measure instead of the site's full-width grid, and the ornament is left out: * no orbs, no tilt, no shimmer. What they inherit from style.css is the palette, the two * type families, the header and the footer. * * Each page carries all three languages in the markup and shows one. The blocks declare * their own lang and dir, so Hebrew reads right to left without the shared header and * footer having to flip with it. */ /* --- which language is on screen ------------------------------------------------- */ .legal-doc { display: none; } html[lang="en"] .legal-doc[lang="en"], html[lang="he"] .legal-doc[lang="he"], html[lang="el"] .legal-doc[lang="el"] { display: block; } /* Before script.js runs, is whatever the pre-paint snippet set — and if it * could not run at all, it stays "en" and the English text shows. That is the fallback, * not a failure state. */ /* --- the page ---------------------------------------------------------------------- */ .legal-main { /* The navbar is fixed, so the first line has to clear it. */ padding: 160px 0 100px; background: var(--bg-body); } .legal-container { max-width: 820px; } .legal-doc { color: var(--text-main); font-family: var(--font-body); font-size: 1.05rem; line-height: 1.75; } /* --- headings ---------------------------------------------------------------------- */ .legal-doc h1 { font-family: var(--font-heading); font-size: clamp(2rem, 5vw, 2.9rem); line-height: 1.2; font-weight: 700; color: var(--primary-color); margin: 0 0 18px; } .legal-doc h2 { font-family: var(--font-heading); font-size: clamp(1.25rem, 3vw, 1.55rem); line-height: 1.35; font-weight: 700; color: var(--text-main); /* Generous space above, tight below: a heading belongs to the text under it. */ margin: 56px 0 14px; padding-top: 22px; border-top: 1px solid rgba(0, 43, 100, 0.12); } body.dark-mode .legal-doc h2 { border-top-color: rgba(0, 200, 255, 0.14); } /* --- the three paragraphs above the first section ---------------------------------- */ .legal-org { font-size: 1.15rem; color: var(--text-muted); margin: 0 0 6px; } .legal-meta { font-size: 0.95rem; color: var(--text-muted); margin: 0 0 32px; } .legal-lead { font-size: 1.1rem; line-height: 1.7; background: var(--bg-glass); border: 1px solid var(--card-border); border-inline-start: 4px solid var(--primary-color); border-radius: 14px; padding: 22px 26px; margin: 0 0 40px; } /* --- body text --------------------------------------------------------------------- */ .legal-doc p { margin: 0 0 18px; } .legal-doc ul { margin: 0 0 20px; padding-inline-start: 26px; } .legal-doc li { margin-bottom: 12px; } .legal-doc li::marker { color: var(--primary-color); } .legal-doc strong { font-weight: 700; color: var(--text-main); } .legal-doc code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.9em; /* Keys and addresses are Latin even inside a Hebrew sentence, and a bidi run has to be * isolated or the surrounding punctuation lands on the wrong side. */ unicode-bidi: isolate; direction: ltr; background: rgba(0, 43, 100, 0.07); border-radius: 5px; padding: 1px 6px; } body.dark-mode .legal-doc code { background: rgba(0, 200, 255, 0.1); } /* --- the localStorage table -------------------------------------------------------- */ .legal-table-scroll { /* A table that outgrows the column scrolls inside its own box; the page never does. */ overflow-x: auto; margin: 0 0 24px; border: 1px solid var(--card-border); border-radius: 14px; background: var(--bg-glass); } .legal-doc table { width: 100%; border-collapse: collapse; font-size: 0.98rem; } .legal-doc th, .legal-doc td { padding: 12px 16px; text-align: start; vertical-align: top; border-bottom: 1px solid rgba(0, 43, 100, 0.09); } body.dark-mode .legal-doc th, body.dark-mode .legal-doc td { border-bottom-color: rgba(0, 200, 255, 0.12); } .legal-doc thead th { font-family: var(--font-heading); font-weight: 700; color: var(--primary-color); white-space: nowrap; } .legal-doc tbody tr:last-child th, .legal-doc tbody tr:last-child td { border-bottom: none; } .legal-doc tbody th { font-weight: 400; } /* --- right to left ----------------------------------------------------------------- */ /* Almost everything above is already direction-agnostic: padding-inline-start, * border-inline-start and text-align: start flip on their own. What is left is the one * place a physical value was unavoidable. */ .legal-doc[dir="rtl"] { /* Hebrew has no italics and no small caps; the weight does the work instead. */ font-size: 1.1rem; } .legal-doc[dir="rtl"] code { /* An LTR key inside an RTL line needs breathing room on both sides, or it collides * with the Hebrew word next to it. */ margin: 0 2px; } /* --- narrow screens ---------------------------------------------------------------- */ @media (max-width: 768px) { .legal-main { padding: 120px 0 70px; } .legal-doc { font-size: 1rem; } .legal-doc h2 { margin-top: 42px; } .legal-lead { padding: 18px 20px; } .legal-doc th, .legal-doc td { padding: 10px 12px; } } /* --- print ------------------------------------------------------------------------- */ /* A statement of accessibility is a document people file, print and attach to a form. */ @media print { .navbar, .site-footer, .skip-link, #preloader, #opennagish-widget { display: none !important; } .legal-main { padding: 0; } .legal-doc h2 { break-after: avoid; } .legal-doc li, .legal-doc tr { break-inside: avoid; } }