:root{--primary:#2D5240;--primary-light:#3A6B54;--primary-dark:#1F3A2D;--accent:#C8A97E;--accent-hover:#B8956A;--bg:#F7F9F5;--bg-alt:#E8F5EE;--text:#1A2E24;--text-light:#4A6B5A;--text-faint:#8BA69A;--border:#D4E3D9;--white:#FFFFFF;--highlight:#C8A97E;--highlight-green:#A8E6CF;--shadow:0 4px 24px rgba(45,82,64,0.08);--radius:16px;--radius-sm:10px;--transition:0.3s ease;--font-primary:'Tajawal',sans-serif}*,::after,::before{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background:var(--bg);color:var(--text);line-height:1.8;overflow-x:hidden}a{text-decoration:none;color:inherit}img{max-width:100%;height:auto;display:block}.container{max-width:1200px;margin:0 auto;padding:0 20px;width:100%}.header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);transition:var(--transition)}.header-inner{display:flex;align-items:center;justify-content:space-between;height:72px;gap:20px}.logo img{height:60px;width:auto;display:block}.nav-list{display:flex;list-style:none;gap:8px}.nav-link{padding:8px 18px;border-radius:var(--radius-sm);font-weight:500;font-size:.95rem;color:var(--text);transition:var(--transition)}.nav-link.active,.nav-link:hover{background:var(--bg-alt);color:var(--primary)}.nav-cta{background:var(--primary);color:var(--white);padding:10px 24px;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;transition:var(--transition)}.nav-cta:hover{background:var(--primary-light);transform:translateY(-1px)}.menu-toggle{display:none;flex-direction:column;gap:5px;background:0 0;border:none;cursor:pointer;padding:8px}.menu-toggle span{width:26px;height:2.5px;background:var(--text);border-radius:2px;transition:var(--transition)}.blog-post-page{padding-top:110px;padding-bottom:60px}.breadcrumb{padding:16px 0;font-size:.9rem;color:var(--text-faint)}.breadcrumb a{color:var(--primary);font-weight:500}.breadcrumb span{margin:0 8px}.post-header{margin-bottom:32px}.post-category{display:inline-block;background:rgba(200,169,126,.15);color:var(--accent);padding:6px 20px;border-radius:20px;font-weight:600;font-size:.85rem;margin-bottom:16px}.post-title{font-size:2rem;font-weight:800;color:var(--text);line-height:1.3;margin-bottom:12px}.post-subtitle{font-size:1.1rem;color:var(--text-light);margin-bottom:8px}.post-meta{display:flex;gap:20px;font-size:.9rem;color:var(--text-faint)}.post-author{font-weight:600;color:var(--primary)}.post-layout{display:grid;grid-template-columns:1fr 320px;gap:40px;align-items:start}.post-main{min-width:0}.post-content{background:var(--white);border-radius:var(--radius);padding:40px;box-shadow:var(--shadow)}.post-content h2{font-size:1.5rem;font-weight:700;color:var(--primary-dark);margin:36px 0 16px;padding-bottom:10px;border-bottom:2px solid var(--bg-alt)}.post-content h3{font-size:1.2rem;font-weight:600;color:var(--primary);margin:24px 0 12px}.post-content p{font-size:1rem;line-height:1.9;color:var(--text);margin-bottom:16px}.post-content ol,.post-content ul{padding-right:24px;margin-bottom:16px}.post-content li{font-size:1rem;line-height:1.9;margin-bottom:6px}.post-content ul li::marker{color:var(--accent)}.post-content a{color:var(--primary);font-weight:600;border-bottom:1px solid var(--border);transition:var(--transition)}.post-content a:hover{color:var(--accent);border-color:var(--accent)}.post-content img{border-radius:var(--radius);margin:24px 0;width:100%;height:auto}.post-questions{background:var(--bg-alt);padding:24px 32px;border-radius:var(--radius);list-style:none;margin:16px 0}.post-questions li{font-weight:500;color:var(--primary)}.post-questions li::before{content:"❓";margin-left:8px}.post-toc{background:var(--bg-alt);padding:24px 32px;border-radius:var(--radius);margin:24px 0}.post-toc h3{font-size:1.1rem;font-weight:700;color:var(--primary-dark);margin-bottom:12px}.post-toc ul{list-style:none;padding:0}.post-toc li{margin-bottom:6px}.post-toc a{color:var(--primary);font-weight:500;border:none}.post-toc a::before{content:"•";margin-left:8px;color:var(--accent)}.post-cta{background:var(--bg-alt);padding:32px;border-radius:var(--radius);margin:32px 0;text-align:center}.post-cta p{font-size:1.05rem;color:var(--text);margin-bottom:20px}.btn{display:inline-block;padding:14px 36px;background:var(--primary);color:var(--white);border-radius:var(--radius-sm);font-weight:700;font-size:1rem;transition:var(--transition);border:none;cursor:pointer;text-align:center}.btn:hover{background:var(--primary-light);transform:translateY(-2px)}.post-share{display:flex;align-items:center;gap:12px;margin-top:32px;padding-top:24px;border-top:1px solid var(--border)}.post-share span{font-weight:600;color:var(--text-light)}.post-share a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--bg-alt);color:var(--primary);transition:var(--transition)}.post-share a:hover{background:var(--primary);color:var(--white)}.post-courses-widget{margin-top:40px;padding-top:36px;border-top:2px solid var(--bg-alt)}.post-courses-widget h2{font-size:1.4rem;font-weight:700;color:var(--primary-dark);margin-bottom:4px}.post-courses-widget>p{color:var(--text-light);font-size:.95rem;margin-bottom:24px}.post-courses-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.post-course-card{display:block;background:#fff;border-radius:var(--radius);overflow:hidden;text-decoration:none;border:1px solid var(--border);transition:all .3s ease}.post-course-card:hover{box-shadow:0 4px 16px rgba(45,82,64,.1)}.post-course-card .course-image{aspect-ratio:16/10;overflow:hidden;position:relative}.post-course-card .course-image img{width:100%;height:100%;object-fit:cover;display:block}.post-course-info{padding:16px}.post-course-info h3,.post-course-info h4{font-size:.95rem;font-weight:700;color:var(--text);margin-bottom:8px;line-height:1.4}.post-course-info span,.course-price{display:inline-block;font-size:.85rem;color:var(--accent);font-weight:700;border-bottom:2px solid var(--accent);padding-bottom:2px}.sidebar-widget{background:var(--white);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);margin-bottom:24px}.sidebar-author{text-align:center}.sidebar-author-img img{width:100px;height:100px;border-radius:50%;object-fit:cover;margin:0 auto 12px}.sidebar-author h4{font-size:1.1rem;font-weight:700;color:var(--text)}.sidebar-author p{font-size:.9rem;color:var(--text-light);margin-top:8px}.toc-list{list-style:none;padding:0}.toc-list li{margin-bottom:8px}.toc-list a{font-size:.9rem;color:var(--primary);font-weight:500;border:none;display:block;padding:4px 0}.toc-list a::before{content:"▸";margin-left:6px;color:var(--accent)}.toc-list .toc-h3{padding-right:20px;font-size:.85rem;color:var(--text-light)}.sidebar-latest ul{list-style:none;padding:0}.sidebar-latest li{margin-bottom:16px}.sidebar-latest a{display:flex;gap:12px;align-items:center}.latest-img img{width:80px;height:80px;border-radius:var(--radius-sm);object-fit:cover}.sidebar-latest h4{font-size:.9rem;font-weight:600;color:var(--text);transition:var(--transition)}.sidebar-latest a:hover h4{color:var(--primary)}.sidebar-cta{text-align:center;background:linear-gradient(135deg,var(--primary),var(--primary-dark))}.sidebar-cta h3{color:var(--white);font-size:1.1rem;margin-bottom:8px}.sidebar-cta p{color:rgba(255,255,255,.85);font-size:.9rem;margin-bottom:20px}.sidebar-cta .btn{background:var(--accent);color:var(--text)}.sidebar-cta .btn:hover{background:var(--accent-hover)}.footer{background:var(--primary-dark);color:var(--white);padding:60px 0 30px;margin-top:0}.footer-top{display:grid;grid-template-columns:2fr 3fr;gap:40px;margin-bottom:40px}.footer-brand p{color:rgba(255,255,255,.7);font-size:.9rem;line-height:1.7}.footer-links-new{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.footer-col-new h4{font-size:.95rem;font-weight:700;margin-bottom:16px;color:var(--accent)}.footer-col-new ul{list-style:none;padding:0}.footer-col-new li{margin-bottom:10px}.footer-col-new a{color:rgba(255,255,255,.7);font-size:.85rem;transition:var(--transition)}.footer-col-new a:hover{color:var(--white);padding-right:4px}.footer-bottom-new{display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid rgba(255,255,255,.1)}.footer-bottom-new p{color:rgba(255,255,255,.5);font-size:.85rem}.footer-social{display:flex;gap:12px}.footer-social a{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.1);color:var(--white);transition:var(--transition)}.footer-social a:hover{background:var(--accent);color:var(--text)}@media(max-width:1024px){.post-layout{grid-template-columns:1fr}.sidebar{display:none}}@media(max-width:768px){.nav-list{display:none}.header-inner .nav-cta{display:none}.menu-toggle{display:flex}.nav.open .nav-list{display:flex;flex-direction:column;position:absolute;top:72px;left:0;right:0;background:var(--white);padding:20px;border-bottom:1px solid var(--border);box-shadow:var(--shadow)}.post-title{font-size:1.5rem}.post-content{padding:20px}.footer-top{grid-template-columns:1fr}.footer-links-new{grid-template-columns:repeat(2,1fr)}.post-courses-grid{grid-template-columns:1fr}}
/* ===== shared additions (design-system consistent) ===== */
.post-content .table-scroll{overflow-x:auto;margin:24px 0;-webkit-overflow-scrolling:touch}
.post-content .table-scroll .post-table{margin:0}
.post-table{width:100%;border-collapse:collapse;font-size:.95rem;border-radius:var(--radius-sm);overflow:hidden}
.post-table th{background:var(--primary);color:var(--white);padding:12px 16px;text-align:right;font-weight:600}
.post-table td{padding:12px 16px;border-bottom:1px solid var(--border);background:var(--white);vertical-align:top}
.post-table tr:last-child td{border-bottom:none}
.post-table tr:hover td{background:var(--bg-alt)}
.post-content blockquote{background:var(--bg-alt);border-right:4px solid var(--accent);padding:20px 24px;margin:24px 0;border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-style:italic;color:var(--text-light);font-size:.98rem}
.post-content h2[id],.post-content h3[id]{scroll-margin-top:100px}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
@media(max-width:768px){.post-table th,.post-table td{padding:10px 12px;font-size:.9rem}}