/* =========================================
   📰 التنسيقات المستقلة لبلوك الأخبار والمدونة
   ========================================= */

.premium-blog-section { padding: 80px 0; background-color: #f8fbfa; position: relative; direction: rtl; overflow: hidden; }
.premium-blog-section::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: radial-gradient(var(--blog-primary) 1.5px, transparent 1.5px); background-size: 35px 35px; opacity: 0.04; z-index: 0; }
.blog-bg-elements { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.floating-quote { position: absolute; top: 5%; right: 3%; font-size: 250px; color: rgba(var(--blog-primary-rgb), 0.04); font-family: serif; line-height: 1; animation: floatQuote 8s ease-in-out infinite; }
.floating-news { position: absolute; bottom: 5%; left: 3%; font-size: 180px; color: rgba(var(--blog-primary-rgb), 0.03); animation: floatNews 10s ease-in-out infinite alternate; }
.pen-writing-container { position: absolute; top: 40%; right: -10%; width: 120%; height: 2px; transform: rotate(-3deg); opacity: 0.5; }
.drawn-line { position: absolute; top: 0; right: 0; height: 100%; background: linear-gradient(-90deg, transparent, var(--blog-primary)); width: 0; animation: drawLineRTL 12s ease-out infinite; }
.writing-pen-icon { position: absolute; top: -24px; right: 0; font-size: 24px; color: var(--blog-primary); transform: rotate(-135deg); animation: movePenRTL 12s ease-out infinite; }

@keyframes floatQuote { 0%, 100% { transform: translateY(0) rotate(10deg); } 50% { transform: translateY(-20px) rotate(15deg); } } 
@keyframes floatNews { 0%, 100% { transform: translateY(0) rotate(-10deg); } 50% { transform: translateY(20px) rotate(-5deg); } }
@keyframes drawLineRTL { 0% { width: 0; opacity: 0; } 10% { opacity: 0.3; } 80% { width: 100%; opacity: 0.3; } 100% { width: 100%; opacity: 0; } }
@keyframes movePenRTL { 0% { right: 0; opacity: 0; margin-top: 0; } 10% { opacity: 1; } 20% { margin-top: -5px; } 30% { margin-top: 5px; } 40% { margin-top: -3px; } 50% { margin-top: 4px; } 60% { margin-top: -2px; } 80% { right: 100%; opacity: 1; margin-top: 0; } 100% { right: 100%; opacity: 0; } }

.blog-top-bar { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; margin-bottom: 50px; position: relative; z-index: 2; }
.blog-badge { display: inline-flex; align-items: center; background: rgba(var(--blog-primary-rgb), 0.1); color: var(--blog-primary); padding: 8px 25px; border-radius: 30px; font-weight: 800; font-size: 14px; margin-bottom: 15px; border: 1px solid rgba(var(--blog-primary-rgb), 0.2); }
.blog-titles h2 { color: #1a1a1a; font-size: 40px; font-weight: 900; margin: 0; font-family: 'Tajawal', sans-serif; }

.premium-blog-card { background: #ffffff; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04); transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); position: relative; z-index: 2; margin: 15px 0; }
.premium-blog-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(var(--blog-primary-rgb), 0.12); }
.premium-blog-img { position: relative; overflow: hidden; height: 240px; }
.premium-blog-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.premium-blog-card:hover .premium-blog-img img { transform: scale(1.1); }
.premium-blog-date { position: absolute; top: 20px; right: 20px; background: var(--blog-primary); color: #ffffff; padding: 8px 20px; border-radius: 30px; font-weight: 700; font-size: 13px; box-shadow: 0 5px 15px rgba(var(--blog-primary-rgb), 0.4); z-index: 2; font-family: 'Tajawal', sans-serif; }
.premium-blog-content { padding: 30px; text-align: right; }
.premium-blog-meta { list-style: none; padding: 0; margin: 0 0 15px 0; display: flex; gap: 20px; font-size: 13px; color: #888; font-weight: 600; }
.premium-blog-meta li { display: flex; align-items: center; gap: 8px; } 
.premium-blog-meta i { color: var(--blog-primary); }
.premium-blog-title { font-size: 20px; font-weight: 800; margin-bottom: 15px; line-height: 1.5; font-family: 'Tajawal', sans-serif; }
.premium-blog-title a { color: #1a1a1a; text-decoration: none; transition: color 0.3s ease; }
.premium-blog-card:hover .premium-blog-title a { color: var(--blog-primary); }
.premium-blog-text { color: #666; font-size: 15px; line-height: 1.7; margin-bottom: 25px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.premium-blog-btn { display: inline-flex; align-items: center; color: #1a1a1a; font-weight: 800; font-size: 15px; text-decoration: none !important; transition: all 0.3s ease; }
.premium-blog-btn i { width: 35px; height: 35px; background: rgba(var(--blog-primary-rgb), 0.1); color: var(--blog-primary); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-right: 12px; transition: all 0.3s ease; }
.premium-blog-card:hover .premium-blog-btn { color: var(--blog-primary); }
.premium-blog-card:hover .premium-blog-btn i { background: var(--blog-primary); color: #ffffff; transform: translateX(-5px); }

.premium-blog-carousel .owl-dots { text-align: center; margin-top: 40px !important; display: block !important; }
.premium-blog-carousel .owl-dots .owl-dot span { width: 14px !important; height: 14px !important; margin: 5px 8px !important; background: rgba(var(--blog-primary-rgb), 0.2) !important; transition: all 0.3s ease !important; border-radius: 50% !important; display: block !important; border: 2px solid transparent !important; }
.premium-blog-carousel .owl-dots .owl-dot.active span, .premium-blog-carousel .owl-dots .owl-dot:hover span { background: transparent !important; border-color: var(--blog-primary) !important; transform: scale(1.3); position: relative; }
.premium-blog-carousel .owl-dots .owl-dot.active span::after { content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 6px; height: 6px; background: var(--blog-primary) !important; border-radius: 50%; }

@media (max-width: 768px) { .floating-quote, .floating-news { opacity: 0.02; } .pen-writing-container { top: 20%; } }