/* base.css — متغيرات، إعادة ضبط، طباعة أساسية */
:root {
  --bg: #0b1411;
  --bg-2: #0f1c17;
  --panel: #122620;
  --panel-2: #16302a;
  --border: #1f4338;
  --emerald: #10b981;
  --emerald-2: #34d399;
  --emerald-deep: #059669;
  --text: #e6f2ee;
  --text-soft: #a9c4bb;
  --text-dim: #6f8c83;
  --gold: #d8b25c;
  --danger: #ef4444;
  --radius: 16px;
  --radius-sm: 10px;
  --shadow: 0 18px 48px rgba(0,0,0,.45);
  --shadow-sm: 0 6px 18px rgba(0,0,0,.30);
  --maxw: 1280px;
  --sidebar-w: 280px;
  --t: .28s cubic-bezier(.4,0,.2,1);
  --font: "Cairo", system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

* { margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.75;
  font-size: 16px;
  font-weight: 400;
  direction: rtl;
  text-align: right;
  overflow-x: hidden;
  background-image:
    radial-gradient(1100px 600px at 90% -10%, rgba(16,185,129,.10), transparent 60%),
    radial-gradient(900px 500px at 0% 110%, rgba(16,185,129,.07), transparent 55%);
  background-attachment: fixed;
}

h1, h2, h3, h4, h5 {
  font-weight: 800;
  line-height: 1.3;
  color: #fff;
  letter-spacing: -.01em;
}

h1 { font-size: clamp(1.9rem, 4.5vw, 3.2rem); }
h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); }
h3 { font-size: clamp(1.2rem, 2.2vw, 1.5rem); }
h4 { font-size: 1.1rem; }

p { color: var(--text-soft); }

a {
  color: var(--emerald-2);
  text-decoration: none;
  transition: color var(--t);
}
a:hover { color: var(--emerald); }

img { max-width: 100%; display: block; }

ul, ol { list-style: none; }

strong { color: var(--text); font-weight: 700; }

::selection { background: var(--emerald); color: #04110c; }

:focus-visible {
  outline: 2px solid var(--emerald-2);
  outline-offset: 3px;
  border-radius: 4px;
}

.container {
  width: 100%;
  max-width: var(--maxw);
  margin-inline: auto;
  padding-inline: clamp(16px, 3vw, 34px);
}

.muted { color: var(--text-dim); }
.accent { color: var(--emerald-2); }
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* شريط تمرير */
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--bg-2); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: var(--emerald-deep); }