:root{
  --primary:#D97791; --primary-500:#F472B6; --primary-700:#8E3C55;
  --accent:#F9A8D4; --accent-2:#FBCFE8;

  --bg:#FFF1F3; --bg-soft:#FFEFF2;
  --paper:#FCE7F3; --paper-2:#FAD1E0;

  --text:#2B2B2B; --muted:#595959; --line:#F9DCE2;
  --radius:16px; --shadow:0 10px 30px rgba(0,0,0,.08);
  --container:960px; --header-h:64px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;text-size-adjust:100%}
body{
  margin:0;
  background:
    radial-gradient(1100px 520px at 85% -15%, rgba(249,168,212,.14), transparent 60%),
    linear-gradient(150deg,#FFF1F3 0%, #FFEFF2 42%, #FCE7F3 100%);
  color:var(--text);
  font-family:'Tajawal',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  line-height:1.8;
}

a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
.sr-only{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);border:0;
}

.container{max-width:var(--container);margin-inline:auto;padding:16px 20px}

/* Header */
header{
  position:sticky;top:0;z-index:10;
  height:var(--header-h);
  background:linear-gradient(180deg,var(--paper),var(--bg-soft));
  border-bottom:1px solid var(--line);
  backdrop-filter:saturate(120%) blur(6px);
}
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--header-h);
}
.brand{display:flex;align-items:center;gap:10px;font-weight:800}
.logo{
  display:inline-grid;place-items:center;
  width:36px;height:36px;border-radius:12px;
  background:linear-gradient(135deg,var(--primary),var(--primary-500));
  color:#000;box-shadow:var(--shadow);
}
nav{display:flex;flex-wrap:wrap;gap:8px}
nav a{
  font-size:14px;font-weight:800;
  padding:8px 12px;border-radius:999px;
  border:1px solid transparent;
  background:transparent;
  text-decoration:none;
}
nav a.is-active{
  border-color:var(--line);
  background:linear-gradient(180deg,var(--paper),var(--bg-soft));
}
nav a:hover{background:rgba(248,220,226,.7)}

/* Main legal wrapper */
main{padding-block:18px 24px}
.page-head{
  margin-bottom:16px;
  padding:16px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:linear-gradient(135deg,var(--paper),var(--bg-soft));
  box-shadow:var(--shadow);
}
.page-kicker{font-weight:800;color:var(--primary-700);margin-bottom:4px}
.page-title{margin:0;font-weight:900;font-size:clamp(20px,3vw,26px)}
.page-meta{margin-top:4px;font-size:13px;color:var(--muted)}

.legal-card{
  margin-top:14px;
  padding:16px 18px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:linear-gradient(180deg,var(--paper),var(--bg-soft));
}
.legal-card + .legal-card{margin-top:10px}

.legal-card h2{
  margin:0 0 8px;
  font-size:18px;
  font-weight:800;
}
.legal-card h3{
  margin:12px 0 6px;
  font-size:15px;
  font-weight:800;
}
.legal-card p{margin:0 0 8px}
.legal-card ul{
  margin:0 0 8px;
  padding-inline-start:20px;
}
.legal-card li{margin:4px 0}

/* Highlight boxes */
.notice{
  border-radius:12px;
  padding:10px 12px;
  font-size:13px;
  margin-top:8px;
}
.notice-info{
  background:color-mix(in oklab,var(--accent) 18%,var(--bg-soft));
  border:1px solid var(--line);
  color:var(--text);
}
.notice-warn{
  background:rgba(245,158,11,.08);
  border:1px solid rgba(245,158,11,.4);
  color:#854d0e;
}

/* Footer */
footer{
  border-top:1px solid var(--line);
  background:linear-gradient(180deg,var(--paper),var(--bg));
  margin-top:20px;
}
.foot{
  max-width:var(--container);
  margin:auto;
  padding:14px 20px;
  text-align:center;
  font-size:13px;
  color:var(--muted);
}
.foot b{color:var(--text)}