@import url('https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400&family=Noto+Sans+Arabic:wght@300;400;500;700&family=Cormorant+Garamond:ital,wght@0,400;0,600;1,400&display=swap');

/* ═══════════ Design tokens — لوحة فان جوخ + ورق الكرّاس ═══════════ */
:root{
  /* عائلة الليل والأزرق */
  --night:#0a1533;         /* سماء الليل العميقة */
  --night-2:#102349;
  --cobalt:#1b4b8f;
  --cobalt-lt:#3d7ec4;
  --turq:#4fa3b8;
  /* عائلة الشمس */
  --star:#f4c95d;
  --star-lt:#ffe08a;
  --sunflower:#e2a323;
  --terracotta:#c06a41;
  /* عائلة الحقول */
  --cypress:#23503a;
  --olive:#7d8f4b;
  /* الورق والحبر */
  --paper:#f8f1e3;
  --paper-2:#f1e7d3;
  --paper-3:#e8dbc2;
  --ink:#1d1712;
  --muted:#6f6153;
  /* من نظام التصميم */
  --primary:#92400e;
  --secondary:#a16207;
  --accent:#4b57c9;
  --border:#e1d4bd;
  --shadow:0 6px 28px rgba(29,23,18,.10);
  --shadow-lg:0 18px 60px rgba(29,23,18,.20);
  --radius:18px; --radius-sm:10px; --radius-lg:28px;
  --maxw:1140px;
  /* نسج الكانفاس */
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3'/><feColorMatrix type='saturate' values='0'/></filter><rect width='160' height='160' filter='url(%23n)' opacity='0.32'/></svg>");
  --stroke:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='12'><path d='M0 6 Q30 0 60 6 T120 6' fill='none' stroke='%231b4b8f' stroke-width='3' stroke-linecap='round' opacity='0.5'/></svg>");
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  direction:rtl; text-align:right; min-height:100dvh;
  font-family:'Noto Sans Arabic',system-ui,sans-serif; font-weight:400;
  color:var(--ink); line-height:1.85; font-size:1.02rem;
  background-color:var(--paper);
  background-image:var(--grain);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:'Amiri',Georgia,serif;font-weight:700;line-height:1.3;letter-spacing:0}
h1{font-size:clamp(1.9rem,5vw,3.1rem)}
h2{font-size:clamp(1.5rem,3.4vw,2.2rem)}
h3{font-size:clamp(1.15rem,2.4vw,1.5rem)}
a{color:var(--cobalt);text-decoration:none}
a:hover{color:var(--primary)}
img,svg{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer}
::selection{background:var(--star);color:var(--ink)}

.ltr,.lat{direction:ltr;text-align:left;font-family:'Cormorant Garamond',Georgia,serif;font-size:1.12em}
.container{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 1.25rem}
.section{padding:3.5rem 0}
.section--tight{padding:2rem 0}
.canvas-dots{background-image:var(--grain)}
.center{text-align:center}
.hidden{display:none !important}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* عناوين الأقسام */
.eyebrow{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--primary);margin-bottom:.7rem
}
.eyebrow::before,.eyebrow::after{content:"";width:26px;height:2px;background:linear-gradient(90deg,transparent,var(--sunflower))}
.eyebrow::before{background:linear-gradient(90deg,var(--sunflower),transparent)}
.section-title{text-align:center;margin:0 auto 1rem;max-width:46ch}
.section-sub{text-align:center;color:var(--muted);max-width:60ch;margin:0 auto 2.5rem;font-size:.98rem}

/* فاصل فرشاة */
.brush-hr{
  height:14px;margin:2.5rem auto;max-width:320px;border:none;opacity:.75;
  background:var(--stroke) repeat-x center/120px 12px;
}
.grid{display:grid;gap:1.4rem}
.grid-2{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}
.grid-3{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
@media(max-width:640px){.grid-2,.grid-3{grid-template-columns:1fr}}