/* ═══════════════════════════════════════════════════════════════════════
   Shared styling for the legal pages (privacy.html, accessibility.html)
   Same tokens and type as index.html, laid out as a plain reading page.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
  --cream:      #FFF8F0;
  --cream-2:    #FFF2E4;
  --sand:       #F5E4CC;
  --coral:      #FF5A5F;
  --coral-dk:   #E03D42;
  --coral-btn:  #CC484C;
  --coral-text: #BA4245;
  --plum:       #3D1A4A;
  --plum-dk:    #280D33;
  --mint:       #8FE8C4;
  --mint-lt:    #C5F5E2;
  --text-dark:  #1A0A24;
  --text-mid:   rgba(26,10,36,0.65);
  --white:      #FFFFFF;

  --font-display: 'Bebas Neue', Georgia, sans-serif;
  --font: 'Heebo', sans-serif;
  --wrap: min(760px, 92vw);
  --r: 20px;
  --r-sm: 12px;
  --r-pill: 100px;
  --t-f: .18s ease;
  --t-spring: .45s cubic-bezier(0.34,1.56,0.64,1);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { direction: rtl; font-size: 16px; scroll-behavior: smooth; }
body {
  font-family: var(--font);
  background: var(--cream);
  color: var(--text-dark);
  text-align: right;
  line-height: 1.75;
  overflow-x: hidden;
}
a { color: var(--coral-text); text-decoration: underline; text-underline-offset: 3px; }
a:hover { color: var(--coral-dk); }
img { display: block; max-width: 100%; }
button { cursor: pointer; border: none; background: none; font-family: var(--font); }

/* ─── Header ─────────────────────────────────────────────────────────── */
.lg-head {
  background: var(--plum);
  padding: 26px 24px;
}
.lg-head-in {
  max-width: var(--wrap); margin: 0 auto;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.lg-logo {
  font-family: var(--font-display);
  font-size: 1.5rem; letter-spacing: .06em;
  color: var(--white);
}
.lg-logo em { color: var(--coral); font-style: normal; font-family: var(--font); font-size: .8rem; font-weight: 700; letter-spacing: 0; }
.lg-back {
  color: var(--white); text-decoration: none;
  border: 1.5px solid rgba(255,255,255,.4);
  border-radius: var(--r-pill);
  padding: 9px 20px; font-size: .88rem; font-weight: 700;
  transition: background var(--t-f), border-color var(--t-f);
  white-space: nowrap;
}
.lg-back:hover { background: rgba(255,255,255,.14); border-color: var(--white); color: var(--white); }

/* ─── Body ───────────────────────────────────────────────────────────── */
.lg-main { max-width: var(--wrap); margin: 0 auto; padding: 56px 24px 80px; }

.lg-title {
  font-size: clamp(1.9rem, 4.5vw, 2.7rem);
  font-weight: 900; color: var(--plum);
  line-height: 1.15; letter-spacing: -.02em;
  margin-bottom: 12px;
}
.lg-updated {
  display: inline-block;
  font-size: .82rem; font-weight: 700; color: var(--plum);
  background: rgba(61,26,74,.08);
  border: 1px solid rgba(61,26,74,.18);
  border-radius: var(--r-pill);
  padding: 6px 16px; margin-bottom: 28px;
}
.lg-lead {
  font-size: 1.06rem; color: var(--text-mid);
  line-height: 1.8; margin-bottom: 36px;
}

.lg-main h2 {
  font-size: 1.28rem; font-weight: 800; color: var(--plum);
  margin: 40px 0 12px; line-height: 1.35;
}
.lg-main h3 {
  font-size: 1.02rem; font-weight: 700; color: var(--plum);
  margin: 24px 0 8px;
}
.lg-main p { margin-bottom: 14px; color: var(--text-dark); }
.lg-main ul, .lg-main ol { margin: 0 0 16px; padding-inline-start: 22px; }
.lg-main li { margin-bottom: 8px; }
.lg-main strong { font-weight: 700; }

.lg-card {
  background: var(--white);
  border: 1.5px solid rgba(61,26,74,.1);
  border-radius: var(--r);
  padding: 26px 28px;
  margin: 24px 0;
  box-shadow: 0 8px 32px rgba(61,26,74,.07);
}
.lg-card h2, .lg-card h3 { margin-top: 0; }
.lg-card :last-child { margin-bottom: 0; }

.lg-note {
  background: rgba(255,90,95,.07);
  border-inline-start: 3px solid var(--coral-btn);
  border-radius: var(--r-sm);
  padding: 16px 18px; margin: 20px 0;
  font-size: .94rem;
}

.lg-contact {
  background: var(--plum); color: var(--white);
  border-radius: var(--r); padding: 28px 30px; margin-top: 36px;
}
.lg-contact h2 { color: var(--white); margin-top: 0; }
.lg-contact p { color: rgba(255,255,255,.82); }
.lg-contact a { color: var(--mint); }
.lg-contact a:hover { color: var(--mint-lt); }
.lg-contact dl { margin-top: 12px; }
.lg-contact dt { font-weight: 700; color: var(--white); margin-top: 12px; font-size: .92rem; }
.lg-contact dd { color: rgba(255,255,255,.82); margin: 2px 0 0; }

/* placeholder marker — nothing goes live while these are still visible */
.todo {
  background: #FFE9A8; color: #4A3200;
  border: 1px dashed #A37A00; border-radius: 6px;
  padding: 1px 7px; font-weight: 700; font-size: .92em;
}

/* ─── Footer ─────────────────────────────────────────────────────────── */
.lg-foot {
  background: var(--plum-dk); color: rgba(255,255,255,.46);
  text-align: center; padding: 30px 24px;
  font-size: .82rem;
}
.lg-foot a { color: rgba(255,255,255,.8); }
.lg-foot a:hover { color: var(--white); }
.lg-foot nav { margin-bottom: 8px; display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 560px) {
  .lg-head-in { flex-direction: column; align-items: flex-start; }
  .lg-main { padding: 40px 20px 64px; }
  .lg-card { padding: 22px 20px; }
  .lg-contact { padding: 24px 20px; }
}