/* ===== NOOR DESIGN SYSTEM ===== */
/* Minimal shared library — page-specific styles stay inline */

/* ── Google Fonts ── */
@import url('fonts.css');

/* ── CSS Variables ── */
:root {
  --bg-deep:     #030712;
  --glass-bg:    rgba(255,255,255,0.04);
  --glass-heavy: rgba(255,255,255,0.08);
  --glass-border:rgba(255,255,255,0.08);
  --accent:      #10B981;
  --gold:        #F59E0B;
  --text:        #F9FAFB;
  --muted:       rgba(249,250,251,0.5);
  --radius:      16px;

  /* ── Compatibility aliases (for inline JS styles) ── */
  --text-primary: var(--text);
  --text-secondary: var(--muted);
  --text-dim:      rgba(249,250,251,0.4);
  --text-muted:    var(--muted);
  --text-elfenbein: var(--text);
  --bg-surface:    var(--glass-bg);
  --bg-darker:     #030712;
  --rule:          var(--glass-border);
  --rule-subtle:   var(--glass-border);
  --rule-strong:   rgba(255,255,255,0.12);
  --radius-sm:     8px;
  --radius-lg:     20px;
  --font-ui:       'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-serif:    'Syne', sans-serif;
  --font-arabic:   'Scheherazade New', serif;
  --gold-soft:     rgba(245,158,11,0.12);
  --gold-medium:   rgba(245,158,11,0.2);
  --gold-hover:    #D97706;
  --shadow-elevated: 0 8px 32px rgba(0,0,0,0.6);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

body {
  background: var(--bg-deep);
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 400;
  line-height: 1.6;
  min-height: 100vh;
  overflow-x: hidden;
}

a { color: inherit; text-decoration: none; }

/* ===== AURORA BLOBS ===== */
.blob {
  position: fixed;
  border-radius: 50%;
  filter: blur(120px);
  pointer-events: none;
  z-index: 0;
  animation: drift var(--duration) ease-in-out infinite alternate;
}
.blob-1 { width:600px;height:600px;background:rgba(5,150,105,0.4);top:-100px;left:-100px;--duration:18s; }
.blob-2 { width:500px;height:500px;background:rgba(180,120,20,0.3);top:30%;right:-80px;--duration:24s;animation-delay:-8s; }
.blob-3 { width:450px;height:450px;background:rgba(15,70,140,0.25);bottom:-100px;left:40%;--duration:20s;animation-delay:-14s; }

@keyframes drift {
  0%   { transform: translate(0,0) scale(1); }
  50%  { transform: translate(40px,30px) scale(1.05); }
  100% { transform: translate(-20px,50px) scale(0.97); }
}
@media (prefers-reduced-motion: reduce) { .blob, .fade-in { animation: none !important; transition: none !important; } }

/* ===== GLASS ===== */
.glass {
  background: var(--glass-bg);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid var(--glass-border);
  border-radius: var(--radius);
}

/* ===== CONTAINER ===== */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
  position: relative;
  z-index: 1;
}

/* ===== SECTION ===== */
.section { padding: 4rem 0; }
.section-title {
  font-family: 'Syne', sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  margin-bottom: 2rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.section-title::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, var(--glass-border), transparent);
}

/* ===== NAV ===== */
nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(3,7,18,0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--glass-border);
}
nav .container { display:flex;align-items:center;justify-content:space-between;height:64px; }

.nav-logo { display:flex;align-items:center;gap:0.5rem; }
.nav-logo .arabic { font-family:'Scheherazade New',serif;font-weight:700;font-size:1.5rem;color:var(--accent);line-height:1; }
.nav-logo .title  { font-family:'Syne',sans-serif;font-weight:600;color:var(--text);font-size:1.05rem; }

.nav-links { display:flex;align-items:center;gap:2rem;list-style:none; }
.nav-links a { color:var(--muted);font-size:0.875rem;font-weight:500;transition:color 0.2s; }
.nav-links a:hover { color:var(--text); }
.nav-links .nav-giris {
  border: 1px solid var(--accent);
  color: var(--accent) !important;
  padding: 6px 16px;
  border-radius: 50px;
  transition: background 0.2s, color 0.2s !important;
}
.nav-links .nav-giris:hover { background: var(--accent); color: #fff !important; }

.mobile-toggle { display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px; }
.mobile-toggle span { display:block;width:24px;height:2px;background:var(--text);border-radius:2px;transition:0.3s; }

/* ===== FADE-IN ===== */
.fade-in { opacity:0;transform:translateY(20px);transition:opacity 0.6s ease,transform 0.6s ease; }
.fade-in.visible { opacity:1;transform:none; }

/* ===== SHIMMER ===== */
.shimmer {
  background:linear-gradient(90deg,var(--glass-bg) 25%,var(--glass-heavy) 50%,var(--glass-bg) 75%);
  background-size:200% 100%;
  animation:shimmer 1.5s infinite;
  border-radius:6px;
  display:inline-block;
}
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ===== EMPTY STATE ===== */
.empty-state { grid-column:1/-1;text-align:center;padding:3rem; }
.empty-state p { color:var(--muted);font-size:0.9rem; }

/* ===== FOOTER ===== */
footer { background:rgba(3,7,18,0.8);border-top:1px solid var(--glass-border);padding:2rem 0;margin-top:2rem; }
footer .container { display:flex;align-items:center;justify-content:space-between; }
.footer-logo { display:flex;align-items:center;gap:0.5rem; }
.footer-logo .arabic { font-family:'Scheherazade New',serif;font-weight:700;font-size:1.2rem;color:var(--accent); }
.footer-center { font-size:0.8rem;color:var(--muted);text-align:center; }
.footer-links { display:flex;gap:1.5rem; }
.footer-links a { font-size:0.8rem;color:var(--muted);transition:color 0.2s; }
.footer-links a:hover { color:var(--text); }

/* ===== RESPONSIVE ===== */
@media (max-width:768px) {
  .mobile-toggle { display:flex; }
  .nav-links { display:none; }
  .nav-links.open {
    display:flex;flex-direction:column;
    position:absolute;top:64px;left:0;right:0;
    background:rgba(3,7,18,0.95);backdrop-filter:blur(20px);
    padding:1.5rem 2rem;gap:1.25rem;border-bottom:1px solid var(--glass-border);
  }
  footer .container { flex-direction:column;gap:1rem;text-align:center; }
}
