/* [legal-2026-07-25b] Ringo3D — shared styling for about / terms / privacy.
   Direction-agnostic: uses logical properties so the same sheet serves
   both the RTL languages (he, ar) and the LTR ones. */
:root{
  --ink:#1c1a17; --paper:#fdfcf9; --deep:#0b2545; --line:#d8d2c6; --accent:#8a6d2f;
}
*{box-sizing:border-box;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:Arial,Helvetica,sans-serif; font-size:18px; line-height:1.75;
}
header{background:var(--deep); color:#fff; padding:28px 20px 30px;}
.wrap{max-width:820px; margin:0 auto; padding:0 20px;}
header .wrap{padding:0 20px;}
h1{margin:0 0 6px; font-size:30px;}
header .brand{margin:0; color:#cdd8e8; font-size:16px;}
main{padding:26px 0 56px;}
/* Section headings carry their own hierarchy through colour, size and the
   34px of space above them — a rule underneath added stripes down a long
   legal document without adding information. */
h2{
  font-size:21px; color:var(--deep); margin:34px 0 10px;
}
/* [legal-2026-07-25i] The .num rule that used to sit here is gone with the
   element it styled. Forcing the section number into an LTR island is exactly
   what reversed "1." into ".1" next to Hebrew; the number is now plain text
   and the bidi algorithm orders it correctly on its own. */
p{margin:12px 0;}
ul{padding-inline-start:22px; margin:10px 0;}
li{margin:6px 0;}
a{color:var(--deep); text-decoration:underline;}
a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid #1d6fb8; outline-offset:2px;}

.lead{font-size:20px;}
.motto{
  border-inline-start:3px solid var(--accent); background:#fffdf6;
  padding:12px 18px; margin:22px 0; font-size:19px;
}
.card{
  background:#fff; border:1px solid var(--line); border-radius:10px;
  padding:18px 22px; margin:14px 0;
}
.notice{
  background:#fff6d8; border:1px solid var(--accent); border-radius:6px;
  padding:10px 16px; margin:0 0 6px; font-size:15.5px; line-height:1.6;
}

/* language picker, sits in the dark header */
.langbar{display:flex; align-items:center; gap:10px; margin-top:16px; flex-wrap:wrap;}
.langbar label{color:#cdd8e8; font-size:15px;}
.langbar select{
  font-family:inherit; font-size:15px; padding:6px 10px; border-radius:6px;
  border:1px solid rgba(255,255,255,.35); background:#123058; color:#fff;
}

/* [read-gate-2026-07-25a] the end-of-document marker. Reaching it is what
   unlocks the consent box on the registration form. */
.readmark{
  margin:34px 0 0; padding:14px 18px; border-radius:8px; font-size:15.5px;
  border:1px dashed var(--line); color:#6b675f; background:#fbf9f4; text-align:center;
}
.readmark.done{
  border:1px solid #4a7a4a; border-style:solid; color:#2f5d2f; background:#f1f8f1;
}
/* [read-gate-2026-07-25c] once the document has been read, the marker carries
   the way back to the form the reader came from */
.readback{
  display:block; margin:12px auto 0; font-family:inherit; font-size:16px;
  padding:10px 26px; border-radius:8px; cursor:pointer;
  border:1px solid #2f5d2f; background:#2f5d2f; color:#fff;
}
.readback:hover{background:#24491f;}

footer{border-top:1px solid var(--line); padding:18px 20px; font-size:15px; color:#6b675f;}
.docnav{margin:0 0 8px;}
.docnav a{margin-inline-end:16px; display:inline-block;}

@media (max-width:560px){
  body{font-size:17px;}
  h1{font-size:25px;}
  h2{font-size:19px;}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important; transition:none !important;}
}
