/* Manara Studio — the privacy page (/privacy/, /id/kebijakan-privasi/, /ar/privacy/)
   A quiet reading page, not a chapter: one cream ground, one column, the
   homepage's type, the header pills, and the coastline standing still above
   the footer (the 404's skyline, in the flow). Everything else — tokens,
   .chrome, .brand, .tag, .headline, .foot — comes from styles.css.
   Built by tools/build-privacy-page.py. */

.page-doc{background:var(--cream);}

.doc{
  --bg:var(--cream);--fg:var(--ink);--soft:var(--soft-on-cream);--accent:var(--forest);--focus:var(--ink);
  background:var(--cream);color:var(--ink);
  padding:calc(var(--header-h) + clamp(2.5rem,7vh,4.5rem)) var(--gutter) clamp(2.5rem,7vh,4rem);
}
.doc__inner{max-width:46rem;}

/* ─── type ─────────────────────────────────────────────────────────────── */
.doc .headline{max-width:none;margin-block-end:1.5rem;font-size:clamp(2.2rem,5.6vw,4rem);text-wrap:balance;}
.doc__inner > .headline + p{font-size:clamp(1.1rem,1.5vw,1.3rem);line-height:1.55;color:var(--soft);}
.doc h2{
  margin:clamp(2.4rem,6vh,3.2rem) 0 .9rem;padding-block-start:1.4rem;
  border-block-start:2px solid var(--ink);
  font:600 clamp(1.35rem,2.2vw,1.8rem)/1.15 var(--font-display);letter-spacing:-.02em;text-wrap:balance;
  scroll-margin-top:calc(var(--header-h) + 1.25rem);
}
.doc p,.doc li{font-size:clamp(1.02rem,1.2vw,1.12rem);line-height:1.65;}
.doc p{margin:0 0 1.1rem;}
.doc ul{margin:0 0 1.1rem;padding:0;list-style:none;}
.doc li{position:relative;margin-block-end:.7rem;padding-inline-start:1.7rem;}
.doc li::before{
  content:"";position:absolute;inset-inline-start:.15rem;top:.62em;
  width:.62rem;height:.62rem;border-radius:50%;background:var(--marigold);border:1.5px solid var(--ink);
}
.doc a{
  color:var(--ink);font-weight:600;
  text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.18em;text-decoration-color:var(--marigold);
}
.doc a:hover{text-decoration-thickness:3px;}
/* the address, assembled by privacy.js; always left-to-right, even in Arabic */
.doc__mail{direction:ltr;unicode-bidi:isolate;}

[lang="ar"] .doc h2{font-family:var(--font-ar-display);font-weight:700;letter-spacing:0;line-height:1.4;}
[lang="ar"] .doc .headline{margin-block-end:1.25rem;}

/* ─── the language links (buttons on the homepage, links here) ─────────── */
.langs a{
  padding:.5rem .8rem;border-radius:var(--pill);
  color:var(--ink);text-decoration:none;font:600 .74rem/1 var(--font-mono);letter-spacing:.12em;
  transition:background .2s,color .2s;
}
.langs a:hover{background:rgba(22,24,26,.09);}
.langs a[aria-current="page"]{background:var(--ink);color:var(--cream);}
@media (max-width:47.99rem){.langs a{padding:.45rem .62rem;}}
@media (max-width:22.49rem){.langs a{padding-inline:.5rem;}}

/* ─── the coastline: domes and towers in forest, one a lit lighthouse ──── */
.doc__coast{
  --coast:clamp(5.5rem,15vh,8.5rem);
  position:relative;height:var(--coast);overflow:hidden;background:var(--cream);pointer-events:none;
}
.doc__coast span{
  position:absolute;bottom:0;background:var(--forest);
  border-radius:50% 50% 0 0 / var(--r) var(--r) 0 0;
}
.doc__coast .tower::before{
  content:"";position:absolute;left:50%;top:18%;translate:-50% 0;width:46%;aspect-ratio:1;border-radius:50%;
  background:var(--marigold);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--marigold) 30%,transparent),0 0 24px 8px color-mix(in srgb,var(--marigold) 45%,transparent);
  animation:lamp-breathe 3.4s ease-in-out infinite alternate;
}
.doc__coast .tower::after{content:"";position:absolute;left:50%;bottom:100%;translate:-50% 0;width:3px;height:14px;border-radius:2px;background:var(--forest);}
@media (prefers-reduced-motion:reduce){.doc__coast .tower::before{animation:none;}}

/* no dock on this page, so the footer needs no room for one */
.page-doc .foot{padding-block-end:1.5rem;}