/* Dhikr Island — the public site.
   Navy and gold, taken from the app's own mark. */

:root {
  --paper:#FFFFFF; --surface:#F7F5F1; --ink:#17191C; --dim:#6E757E;
  --rule:#E7E2D9; --gold:#8B6925; --gold-soft:#C6A15B; --navy:#1A222D;
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,sans-serif;
  --ar:"Geeza Pro","SF Arabic","Noto Naskh Arabic",serif;
}
@media (prefers-color-scheme: dark) {
  :root { --paper:#0E1115; --surface:#161A20; --ink:#E9E7E2; --dim:#959CA5;
          --rule:#272D36; --gold:#C6A15B; --gold-soft:#E3C78D; --navy:#080B0F; }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
[dir=rtl] body, [dir=rtl] .wrap { font-family: var(--ar); }
[dir=rtl] h1, [dir=rtl] h2, [dir=rtl] h3 { letter-spacing: 0; }
a { color: var(--gold); }
img { max-width: 100%; }
[hidden] { display: none !important; }

.wrap { max-width: 64rem; margin: 0 auto; padding: 0 1.25rem; }

/* ── The bar ── */
.bar { border-bottom: 1px solid var(--rule); background: var(--paper); }
.bar .wrap { display: flex; align-items: center; gap: 1.1rem; min-height: 60px; flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: .6rem; text-decoration: none;
         color: var(--ink); font-weight: 650; margin-inline-end: auto; }
.brand img { width: 28px; height: 28px; border-radius: 8px; }
.bar nav { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.bar nav a { color: var(--dim); text-decoration: none; font-size: .93rem; }
.bar nav a:hover, .bar nav a[aria-current] { color: var(--gold); }
.langbtn {
  font: inherit; font-size: .88rem; cursor: pointer; color: var(--ink);
  background: var(--surface); border: 1px solid var(--rule);
  border-radius: 999px; padding: .3rem .8rem;
}
.langbtn:hover { border-color: var(--gold); color: var(--gold); }

/* ── Footer note ── */
.note {
  max-width: 64rem; margin: 3rem auto 0; padding: 1.4rem 1.25rem 2.5rem;
  border-top: 1px solid var(--rule); color: var(--dim); font-size: .87rem;
}
.note .copy { display: block; margin-top: .6rem; opacity: .75; }

/* ── Legal pages ── */
.legal { max-width: 42rem; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; }
.legal h1 { font-size: 1.9rem; line-height: 1.15; letter-spacing: -.02em; margin: 0 0 .4rem; }
.legal h2 { font-size: 1.12rem; margin: 2rem 0 .4rem; }
.legal p { color: var(--dim); margin: 0 0 .8rem; }
.legal .updated { font-size: .82rem; color: var(--dim); margin-bottom: 1.6rem; }