:root{--primary-blue: #2c5282;--primary-blue-dark: #1a365d;--primary-blue-light: #4299e1;--secondary-color: #4a5568;--text-color: #1a202c;--text-light: #718096;--bg-color: #f7fafc;--bg-white: #ffffff;--border-color: #e2e8f0;--code-bg: #f7fafc;--accent-orange: #dd6b20;--accent-green: #38a169;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1)}*{box-sizing:border-box}.blog-post-page-container{background:linear-gradient(180deg,var(--bg-color) 0%,var(--bg-white) 100%);min-height:100vh;position:relative;overflow:hidden}.bg-decoration{position:absolute;top:0;left:0;right:0;height:600px;overflow:hidden;pointer-events:none;z-index:1}.circle{position:absolute;border-radius:50%;opacity:.05;animation:float 20s infinite ease-in-out}.circle-1{width:300px;height:300px;background:var(--primary-blue);top:-100px;right:-50px;animation-delay:0s}.circle-2{width:200px;height:200px;background:var(--accent-orange);top:200px;left:-100px;animation-delay:5s}.circle-3{width:150px;height:150px;background:var(--accent-green);top:400px;right:20%;animation-delay:10s}@keyframes float{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-30px) scale(1.1)}66%{transform:translate(-20px,20px) scale(.9)}}.post-hero{background:linear-gradient(135deg,var(--primary-blue-dark) 0%,var(--primary-blue) 50%,var(--primary-blue-light) 100%);color:#fff;padding:8rem 2rem 12rem;text-align:center;position:relative;z-index:10}.hero-overlay{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:.4}.hero-content{max-width:900px;margin:0 auto;position:relative;z-index:2}.category-badge{display:inline-flex;align-items:center;gap:.5rem;background:#fff3;backdrop-filter:blur(10px);padding:.5rem 1.25rem;border-radius:50px;font-size:.875rem;font-weight:600;letter-spacing:.05em;margin-bottom:2rem;border:1px solid rgba(255,255,255,.3);animation:fadeInDown .6s ease-out}.badge-icon{width:16px;height:16px}.post-title{font-size:clamp(2rem,5vw,3.5rem);line-height:1.15;font-weight:800;margin:1rem 0 2rem;animation:fadeInUp .8s ease-out .2s both;text-shadow:0 2px 10px rgba(0,0,0,.1)}.post-meta{display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap;margin-top:2.5rem;animation:fadeIn 1s ease-out .4s both}.author-info{display:flex;align-items:center;gap:1rem}.author-avatar-wrapper{position:relative}.author-avatar{width:56px;height:56px;border-radius:50%;border:3px solid white;box-shadow:0 4px 12px #00000026;position:relative;z-index:2}.avatar-ring{position:absolute;inset:-3px;border-radius:50%;border:2px solid rgba(255,255,255,.5);animation:pulse 2s infinite}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.1);opacity:.7}}.author-details{text-align:left}.author-name{font-size:1.125rem;font-weight:700;margin:0;line-height:1.3}.author-role{font-size:.875rem;opacity:.9;margin:.25rem 0 0}.meta-divider{width:1px;height:40px;background:#ffffff4d}.post-date{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:500}.date-icon{width:20px;height:20px}.wave-divider{position:absolute;bottom:-1px;left:0;width:100%;overflow:hidden;line-height:0}.wave-divider svg{position:relative;display:block;width:calc(100% + 1.3px);height:80px}.wave-divider path{fill:var(--bg-white)}.content-wrapper{max-width:1400px;margin:-10rem auto 0;padding:0 2rem 4rem;display:grid;grid-template-columns:1fr 300px;gap:3rem;position:relative;z-index:20}.post-body-container{background:var(--bg-white);border-radius:16px;box-shadow:var(--shadow-xl),0 0 0 1px #0000000d;padding:3rem;position:relative}.reading-progress{position:sticky;top:0;left:0;right:0;height:4px;background:var(--border-color);border-radius:2px;overflow:hidden;margin:-3rem -3rem 3rem;z-index:100}.progress-bar{height:100%;background:linear-gradient(90deg,var(--primary-blue) 0%,var(--primary-blue-light) 100%);width:0%;transition:width .1s ease-out;border-radius:2px}.featured-image-container{margin:0 0 3rem;position:relative;border-radius:12px;overflow:hidden}.image-wrapper{position:relative;aspect-ratio:16/9;overflow:hidden}.featured-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform .3s ease}.featured-image-container:hover .featured-image{transform:scale(1.05)}.image-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.4) 100%);pointer-events:none}.prose{max-width:100%;color:var(--text-color);font-size:1.125rem;line-height:1.8}.prose>*{margin:0;padding:0}.prose p{margin-top:1.5em;margin-bottom:1.5em;color:var(--text-color)}.prose p:first-child{margin-top:0;font-size:1.25rem;line-height:1.7;color:var(--secondary-color)}.prose h1,.prose h2,.prose h3,.prose h4{color:var(--text-color);font-weight:700;line-height:1.3;margin-top:2.5em;margin-bottom:1em;scroll-margin-top:5rem}.prose h1:first-child,.prose h2:first-child,.prose h3:first-child{margin-top:0}.prose h1{font-size:2.25em;position:relative;padding-bottom:.5em}.prose h1:after{content:"";position:absolute;bottom:0;left:0;width:60px;height:4px;background:linear-gradient(90deg,var(--primary-blue) 0%,var(--primary-blue-light) 100%);border-radius:2px}.prose h2{font-size:1.875em;color:var(--primary-blue-dark)}.prose h3{font-size:1.5em}.prose h4{font-size:1.25em}.prose ul,.prose ol{margin-top:1.5em;margin-bottom:1.5em;padding-left:1.75em}.prose ul{list-style-type:none}.prose ul li{position:relative;padding-left:.5em}.prose ul li:before{content:"";position:absolute;left:-1.5em;top:.6em;width:6px;height:6px;background:var(--primary-blue);border-radius:50%}.prose ol{list-style-type:none;counter-reset:item}.prose ol li{position:relative;padding-left:.5em;counter-increment:item}.prose ol li:before{content:counter(item);position:absolute;left:-1.75em;top:0;width:1.5em;height:1.5em;background:var(--primary-blue);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75em;font-weight:700}.prose li{margin-top:.75em;margin-bottom:.75em;line-height:1.75}.prose strong{font-weight:700;color:var(--text-color)}.prose a{color:var(--primary-blue);text-decoration:none;font-weight:600;position:relative;transition:color .2s ease}.prose a:after{content:"";position:absolute;bottom:-2px;left:0;width:100%;height:2px;background:var(--primary-blue-light);transform:scaleX(0);transform-origin:right;transition:transform .3s ease}.prose a:hover{color:var(--primary-blue-dark)}.prose a:hover:after{transform:scaleX(1);transform-origin:left}.prose code{background:linear-gradient(135deg,#ffe4e6,#fecaca);color:#c53030;padding:.2em .5em;border-radius:4px;font-size:.875em;font-family:Courier New,Courier,monospace;font-weight:600;border:1px solid #fca5a5}.prose pre{background:linear-gradient(135deg,#1e293b,#0f172a);border:1px solid #334155;border-radius:12px;overflow-x:auto;margin:2em 0;padding:1.5em;line-height:1.6;box-shadow:var(--shadow-lg)}.prose pre code{background:transparent;color:#e2e8f0;padding:0;font-weight:400;border:none}.prose blockquote{border-left:4px solid var(--accent-orange);padding:1.5em 2em;margin:2em 0;font-style:italic;background:linear-gradient(135deg,#fff8f5,#fffaf7);border-radius:8px;position:relative;box-shadow:var(--shadow-sm)}.prose blockquote:before{content:'"';position:absolute;top:-10px;left:20px;font-size:4rem;color:var(--accent-orange);opacity:.2;font-family:Georgia,serif;line-height:1}.prose blockquote p{margin:.5em 0;color:var(--secondary-color)}.prose blockquote p:first-child{margin-top:0;font-size:inherit}.prose blockquote p:last-child{margin-bottom:0}.prose table{width:100%;border-collapse:separate;border-spacing:0;margin:2.5em 0;font-size:.9375rem;box-shadow:var(--shadow-md);border-radius:12px;overflow:hidden;border:1px solid var(--border-color)}.prose thead{background:linear-gradient(135deg,var(--primary-blue-dark) 0%,var(--primary-blue) 100%);color:#fff}.prose th{padding:1rem 1.25rem;text-align:left;font-weight:600;border:none;text-transform:uppercase;font-size:.875rem;letter-spacing:.05em}.prose td{padding:1rem 1.25rem;border-bottom:1px solid var(--border-color);border-right:1px solid var(--border-color)}.prose td:last-child{border-right:none}.prose tbody tr{background:#fff;transition:background-color .2s ease}.prose tbody tr:nth-child(2n){background-color:var(--bg-color)}.prose tbody tr:hover{background-color:#edf2f7}.prose tbody tr:last-child td{border-bottom:none}.prose hr{border:none;height:3px;background:linear-gradient(90deg,transparent 0%,var(--border-color) 20%,var(--border-color) 80%,transparent 100%);margin:3em 0;position:relative}.prose hr:after{content:"❖";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;padding:0 1rem;color:var(--border-color);font-size:1.25rem}.prose img{max-width:100%;height:auto;border-radius:12px;margin:2em 0;box-shadow:var(--shadow-md)}.prose figure{margin:2.5em 0}.prose figcaption{margin-top:1em;font-size:.875em;text-align:center;color:var(--text-light);font-style:italic}.share-section{margin-top:4rem;padding-top:3rem;border-top:2px solid var(--border-color);text-align:center}.share-title{font-size:1.25rem;font-weight:700;color:var(--text-color);margin-bottom:1.5rem}.share-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}.share-btn{width:50px;height:50px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;box-shadow:var(--shadow-sm)}.share-btn svg{width:20px;height:20px}.share-btn.twitter{background:#1da1f2;color:#fff}.share-btn.twitter:hover{background:#0c85d0;transform:translateY(-3px);box-shadow:var(--shadow-lg)}.share-btn.facebook{background:#4267b2;color:#fff}.share-btn.facebook:hover{background:#365899;transform:translateY(-3px);box-shadow:var(--shadow-lg)}.share-btn.linkedin{background:#0077b5;color:#fff}.share-btn.linkedin:hover{background:#005e93;transform:translateY(-3px);box-shadow:var(--shadow-lg)}.share-btn.copy{background:var(--border-color);color:var(--text-color)}.share-btn.copy:hover{background:var(--text-color);color:#fff;transform:translateY(-3px);box-shadow:var(--shadow-lg)}.sidebar{display:flex;flex-direction:column;gap:2rem}.sidebar-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:var(--shadow-md);border:1px solid var(--border-color);position:sticky;top:2rem}.sidebar-title{font-size:1.25rem;font-weight:700;color:var(--text-color);margin-bottom:1rem}.sidebar-text{color:var(--secondary-color);line-height:1.6;margin:0}.cta-card{background:linear-gradient(135deg,var(--primary-blue) 0%,var(--primary-blue-light) 100%);color:#fff;text-align:center;border:none}.cta-icon{width:60px;height:60px;margin:0 auto 1.5rem;background:#fff3;border-radius:50%;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(10px)}.cta-icon svg{width:32px;height:32px}.cta-title{font-size:1.5rem;font-weight:700;margin-bottom:.75rem;color:#fff}.cta-text{color:#ffffffe6;margin-bottom:1.5rem}.cta-button{display:inline-block;background:#fff;color:var(--primary-blue);padding:.75rem 2rem;border-radius:50px;font-weight:600;text-decoration:none;transition:all .3s ease;box-shadow:var(--shadow-md)}.cta-button:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:1024px){.content-wrapper{grid-template-columns:1fr}.sidebar{order:-1}.sidebar-card{position:static}}@media(max-width:768px){.post-hero{padding:5rem 1.5rem 10rem}.content-wrapper{margin-top:-8rem;padding:0 1rem 2rem}.post-body-container{padding:2rem 1.5rem;border-radius:12px}.reading-progress{margin:-2rem -1.5rem 2rem}.prose{font-size:1rem}.prose h1{font-size:1.875em}.prose h2{font-size:1.5em}.prose h3{font-size:1.25em}.prose h4{font-size:1.125em}.prose table{font-size:.875rem;display:block;overflow-x:auto}.prose th,.prose td{padding:.75rem}.post-meta{flex-direction:column;gap:1rem}.meta-divider{display:none}.share-buttons{gap:.75rem}.share-btn{width:45px;height:45px}.circle-1,.circle-2,.circle-3{display:none}}@media(max-width:480px){.post-hero{padding:4rem 1rem 8rem}.post-title{font-size:clamp(1.75rem,8vw,2.5rem)}.category-badge{font-size:.75rem;padding:.4rem 1rem}.author-avatar{width:48px;height:48px}.sidebar{gap:1.5rem}.sidebar-card{padding:1.5rem}}@media print{.post-hero{clip-path:none;padding:3rem 1rem}.wave-divider,.bg-decoration,.reading-progress,.share-section,.sidebar,.cta-card{display:none}.content-wrapper{grid-template-columns:1fr;margin-top:0}.post-body-container{box-shadow:none}}
