* { margin:0; padding:0; box-sizing:border-box; }

    html, body {
      height: 100%;
      display: flex;
      flex-direction: column;
    }

    body {
      font-family:'Inter', -apple-system,BlinkMacSystemFont,'Segoe UI','Roboto',sans-serif;
      background: linear-gradient(135deg, #111111 0%, #000000 100%);
      color:#fff; 
      overflow-x:hidden;
      background-attachment: fixed; /* سحب ثابتة */
    }

    main {
      flex: 1;
    }

    html { scroll-behavior:smooth; }
    ::-webkit-scrollbar{ width:8px; }
    ::-webkit-scrollbar-track{ background:#111111; }
    ::-webkit-scrollbar-thumb{ background:#666666; border-radius:4px; }
    ::-webkit-scrollbar-thumb:hover{ background:#999999; }

   

    .btn-primary{
      background:#ffffff; 
      color:#000000;
      border:none; 
      border-radius:.5rem; 
      padding:.6rem 1.2rem; 
      font-weight:600;
      transition:.25s;
    }
    .btn-primary:hover{ background:#cccccc; transform:translateY(-1px); }

    .btn-outline-light{ border:2px solid #fff; color:#fff; border-radius:.6rem; }
    .btn-outline-light:hover{ background:#fff; color:#000000; }

    .section{ padding:5rem 0; }
    .section-title{ font-size:3rem; font-weight:700; text-align:center; margin-bottom:.75rem; }
    .section-subtitle{ font-size:1.05rem; color:#d1d5db; text-align:center; margin-bottom:2rem; }
    .text-primary{ color:#ffffff!important; }
    a {
      color: #d1d5db;
    }
    .glass-card{
      background:rgba(20,20,20,.6); 
      backdrop-filter:blur(12px);
      border:1px solid rgba(255,255,255,.2); 
      border-radius:1rem; 
      padding:1.5rem;
      transition:.4s; 
      height:100%;
    }
    .glass-card:hover{ 
      border-color:rgba(255,255,255,.4); 
      transform:translateY(-4px); 
      box-shadow:0 18px 36px rgba(255,255,255,.12); 
    }

    @keyframes fadeInUp{ from{opacity:0; transform:translateY(30px);} to{opacity:1; transform:translateY(0);} }
    .animate-on-scroll{ opacity:0; transform:translateY(30px); transition:.8s; }
    .animate-on-scroll.animated{ opacity:1; transform:translateY(0); }

    .blog-intro{ max-width:900px; margin:0 auto 1.25rem; color:#e5e7eb; }
    .reels-cta{ text-align:center; margin-bottom:2.5rem; }
    .reels-cta .btn{ display:inline-flex; align-items:center; gap:.55rem; font-weight:700; }
    .post-card .post-meta{ color:#9ca3af; font-size:.9rem; }
    .post-card .post-title{ font-size:1.25rem; font-weight:800; margin:.25rem 0 .35rem; }
    .post-card .post-title a{ color:#fff; text-decoration:none; }
    .post-card .post-title a:hover{ color:#cccccc; }
    .post-card .post-excerpt{ color:#d1d5db; }
    .badge-tag{ 
      background:rgba(255,255,255,.18); 
      color:#dddddd; 
      border:1px solid rgba(255,255,255,.35); 
      border-radius:999px; 
      padding:.18rem .6rem; 
      font-size:.75rem; 
    }
    .post-thumb{ width:100%; height:180px; object-fit:cover; border-radius:.75rem; }
    @media (max-width:768px){ .section-title{ font-size:2.2rem; } }