.blog-detail-container{background:#f8f9fa;min-height:100vh;font-family:Jost,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.blog-detail-hero{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:3rem 0;position:relative;overflow:hidden}.blog-detail-hero:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="white" opacity="0.1"/><circle cx="75" cy="75" r="1" fill="white" opacity="0.1"/><circle cx="50" cy="10" r="0.5" fill="white" opacity="0.1"/><circle cx="10" cy="60" r="0.5" fill="white" opacity="0.1"/><circle cx="90" cy="40" r="0.5" fill="white" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');opacity:.3}.blog-detail-content{max-width:1200px;margin:0 auto;padding:0 1rem;position:relative;z-index:2}.blog-breadcrumb{margin-bottom:2rem}.blog-breadcrumb-list{display:flex;align-items:center;list-style:none;padding:0;margin:0;flex-wrap:wrap}.blog-breadcrumb-item{display:flex;align-items:center;font-size:.875rem}.blog-breadcrumb-item:not(:last-child):after{content:"›";margin:0 .5rem;color:#ffffffb3;font-weight:600}.blog-breadcrumb-link{color:#fffc;text-decoration:none;transition:color .3s ease}.blog-breadcrumb-link:hover{color:#fff}.blog-detail-meta{margin-bottom:2rem}.blog-detail-category{display:inline-block;background:#fff3;color:#fff;font-size:.875rem;font-weight:600;padding:.5rem 1rem;border-radius:25px;margin-bottom:1rem;text-decoration:none;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.blog-detail-category:hover{background:#ffffff4d;transform:translateY(-2px);color:#fff}.blog-detail-title{font-size:3rem;font-weight:700;line-height:1.2;margin-bottom:1.5rem;text-shadow:0 2px 4px rgba(0,0,0,.1)}.blog-detail-info{display:flex;align-items:center;gap:2rem;flex-wrap:wrap;font-size:.875rem;opacity:.9}.blog-detail-info-item{display:flex;align-items:center;gap:.5rem}.blog-detail-info-icon{width:1rem;height:1rem;opacity:.8}.blog-detail-excerpt{background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:1.5rem;margin-top:2rem;border:1px solid rgba(255,255,255,.2)}.blog-detail-excerpt-text{font-size:1.125rem;line-height:1.6;margin:0}.blog-detail-wrapper{max-width:1200px;margin:0 auto;padding:3rem 1rem}.blog-detail-grid{display:grid;grid-template-columns:2fr 1fr;gap:3rem;align-items:start}.blog-detail-main{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.blog-detail-main:hover{transform:translateY(-2px);box-shadow:0 8px 30px #0000001f}.blog-detail-featured-image{width:100%;height:400px;object-fit:cover;transition:transform .3s ease}.blog-detail-main:hover .blog-detail-featured-image{transform:scale(1.02)}.blog-detail-article{padding:2rem}.blog-detail-content-text{font-size:1.125rem;line-height:1.8;color:#2d3748}.blog-detail-content-text h1,.blog-detail-content-text h2,.blog-detail-content-text h3,.blog-detail-content-text h4,.blog-detail-content-text h5,.blog-detail-content-text h6{color:#1a202c;font-weight:600;margin-top:2rem;margin-bottom:1rem;scroll-margin-top:100px}.blog-detail-content-text h1{font-size:2rem}.blog-detail-content-text h2{font-size:1.75rem}.blog-detail-content-text h3{font-size:1.5rem}.blog-detail-content-text h4{font-size:1.25rem}.blog-detail-content-text h5{font-size:1.125rem}.blog-detail-content-text h6{font-size:1rem}.blog-detail-content-text p{margin-bottom:1.5rem}.blog-detail-content-text ul,.blog-detail-content-text ol{margin-bottom:1.5rem;padding-left:1.5rem}.blog-detail-content-text li{margin-bottom:.5rem}.blog-detail-content-text blockquote{border-left:4px solid #e91e63;padding-left:1.5rem;margin:2rem 0;font-style:italic;color:#4a5568;background:#f7fafc;padding:1.5rem;border-radius:0 8px 8px 0}.blog-detail-content-text img{max-width:100%;height:auto;border-radius:8px;margin:1.5rem 0;box-shadow:0 4px 12px #0000001a;transition:transform .3s ease}.blog-detail-content-text img:hover{transform:scale(1.02)}.blog-detail-content-text a{color:#e91e63;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s ease}.blog-detail-content-text a:hover{border-bottom-color:#e91e63}.blog-detail-tags{margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.blog-detail-tags-title{font-size:1.125rem;font-weight:600;color:#1a202c;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.blog-detail-tags-list{display:flex;flex-wrap:wrap;gap:.5rem}.blog-detail-tag{display:inline-block;background:#f7fafc;color:#4a5568;font-size:.875rem;padding:.5rem 1rem;border-radius:20px;text-decoration:none;transition:all .3s ease;border:1px solid #e2e8f0}.blog-detail-tag:hover{background:#e91e63;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #e91e634d}.blog-detail-author{margin-top:2rem;padding:1.5rem;background:#f7fafc;border-radius:12px;border:1px solid #e2e8f0}.blog-detail-author-title{font-size:1.125rem;font-weight:600;color:#1a202c;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.blog-detail-author-bio{color:#4a5568;line-height:1.6;margin:0}.blog-detail-related{margin-top:3rem;padding-top:2rem;border-top:1px solid #e2e8f0}.blog-detail-related-title{font-size:1.5rem;font-weight:700;color:#1a202c;margin-bottom:1.5rem;display:flex;align-items:center;gap:.75rem}.blog-detail-related-grid{display:grid;grid-template-columns:1fr;gap:1rem}.blog-detail-related-card{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014;transition:all .3s ease;border:1px solid #f1f3f4;text-decoration:none}.blog-detail-related-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #0000001f}.blog-detail-related-image{width:100%;height:120px;object-fit:cover;transition:transform .3s ease}.blog-detail-related-card:hover .blog-detail-related-image{transform:scale(1.05)}.blog-detail-related-content{padding:1rem}.blog-detail-related-category{display:inline-block;background:linear-gradient(135deg,#e91e63,#9c27b0);color:#fff;font-size:.75rem;font-weight:600;padding:.25rem .75rem;border-radius:15px;margin-bottom:.5rem;text-decoration:none}.blog-detail-related-title-link{font-size:.875rem;font-weight:600;color:#1a202c;text-decoration:none;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .3s ease}.blog-detail-related-title-link:hover{color:#e91e63}.blog-detail-related-meta{display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:#718096;margin-top:.75rem;padding-top:.75rem;border-top:1px solid #f1f3f4}.blog-detail-sidebar{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;overflow:hidden;position:sticky;top:2rem;transition:transform .3s ease,box-shadow .3s ease}.blog-detail-sidebar:hover{transform:translateY(-2px);box-shadow:0 8px 30px #0000001f}.blog-detail-sidebar-section{padding:1.5rem;border-bottom:1px solid #f1f3f4}.blog-detail-sidebar-section:last-child{border-bottom:none}.blog-detail-sidebar-title{font-size:1.125rem;font-weight:600;color:#1a202c;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.blog-detail-share-buttons{display:flex;gap:.75rem}.blog-detail-share-button{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1rem;border-radius:10px;text-decoration:none;font-size:.875rem;font-weight:500;transition:all .3s ease;border:none;cursor:pointer}.blog-detail-share-facebook{background:#1877f2;color:#fff}.blog-detail-share-facebook:hover{background:#166fe5;transform:translateY(-2px);box-shadow:0 4px 12px #1877f24d}.blog-detail-share-twitter{background:#1da1f2;color:#fff}.blog-detail-share-twitter:hover{background:#1a91da;transform:translateY(-2px);box-shadow:0 4px 12px #1da1f24d}.blog-detail-share-whatsapp{background:#25d366;color:#fff}.blog-detail-share-whatsapp:hover{background:#22c55e;transform:translateY(-2px);box-shadow:0 4px 12px #25d3664d}.blog-detail-toc{list-style:none;padding:0;margin:0}.blog-detail-toc-item{margin-bottom:.5rem}.blog-detail-toc-link{display:block;padding:.5rem .75rem;color:#4a5568;text-decoration:none;font-size:.875rem;border-radius:8px;transition:all .3s ease}.blog-detail-toc-link:hover{background:#f7fafc;color:#e91e63;transform:translate(4px)}.blog-detail-toc-link.active{background:linear-gradient(135deg,#e91e63,#9c27b0);color:#fff;box-shadow:0 2px 8px #e91e634d}@media (max-width: 1024px){.blog-detail-grid{grid-template-columns:1fr;gap:2rem}.blog-detail-sidebar{position:static;order:2}.blog-detail-main{order:1}}@media (max-width: 768px){.blog-detail-title{font-size:2rem}.blog-detail-info{gap:1rem;font-size:.75rem}.blog-detail-wrapper{padding:2rem 1rem}.blog-detail-article{padding:1.5rem}.blog-detail-content-text{font-size:1rem}.blog-detail-share-buttons{flex-direction:column}.blog-detail-share-button{justify-content:center}}@media (max-width: 480px){.blog-detail-title{font-size:1.75rem}.blog-detail-wrapper,.blog-detail-article{padding:1rem}.blog-detail-featured-image{height:250px}.blog-detail-info{flex-direction:column;align-items:flex-start;gap:.5rem}.blog-detail-sidebar-section{padding:1rem}}.blog-detail-loading{display:flex;justify-content:center;align-items:center;min-height:400px}.blog-detail-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #e91e63;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media print{.blog-detail-sidebar,.blog-detail-share-buttons,.blog-detail-toc{display:none}.blog-detail-grid{grid-template-columns:1fr}.blog-detail-main{box-shadow:none;border:1px solid #ddd}.blog-detail-hero{background:#fff!important;color:#000!important}.blog-detail-title{color:#000}}