/**
 * Reset some basic elements
 */
 body, h1, h2, h3, h4, h5, h6,
 p, blockquote, pre, hr,
 dl, dd, ol, ul, figure {
   margin: 0;
   padding: 0;
 }
 
 /**
  * Basic styling
  */
 body {
   font: 400 18px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   color: #2c3e50;
   background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
   -webkit-text-size-adjust: 100%;
   -webkit-font-feature-settings: "kern" 1;
   -moz-font-feature-settings: "kern" 1;
   -o-font-feature-settings: "kern" 1;
   font-feature-settings: "kern" 1;
   font-kerning: normal;
   display: flex;
   min-height: 100vh;
   flex-direction: column;
   scroll-behavior: smooth;
 }
 
 /**
  * Set `margin-bottom` to maintain vertical rhythm
  */
 h1, h2, h3, h4, h5, h6,
 p, blockquote, pre,
 ul, ol, dl, figure,
 .highlight {
   margin-bottom: 20px;
 }
 
 /**
  * `main` element
  */
 main {
   display: block;
 }
 
 /**
  * Images
  */
 img {
   max-width: 100%;
   vertical-align: middle;
   border-radius: 8px;
   transition: transform 0.3s ease;
 }
 
 img:hover {
   transform: scale(1.02);
 }
 
 /**
  * Figures
  */
 figure > img {
   display: block;
 }
 
 figcaption {
   font-size: 15px;
   color: #64748b;
   margin-top: 8px;
   font-style: italic;
 }
 
 /**
  * Lists
  */
 ul, ol {
   margin-left: 30px;
 }
 
 li > ul,
 li > ol {
   margin-bottom: 0;
 }
 
 /**
  * Headings
  */
 h1, h2, h3, h4, h5, h6 {
   font-weight: 600;
   line-height: 1.3;
   color: #1e293b;
 }
 
 h1 { font-size: 2.5rem; }
 h2 { font-size: 2rem; }
 h3 { font-size: 1.5rem; }
 
 /**
  * Links
  */
 a {
   color: #3b82f6;
   text-decoration: none;
   transition: all 0.2s ease;
   position: relative;
 }
 
 a:visited {
   color: #6366f1;
 }
 
 a:hover {
   color: #1d4ed8;
   transform: translateY(-1px);
 }
 
 a::after {
   content: '';
   position: absolute;
   width: 0;
   height: 2px;
   bottom: -2px;
   left: 0;
   background: linear-gradient(90deg, #3b82f6, #8b5cf6);
   transition: width 0.3s ease;
 }
 
 a:hover::after {
   width: 100%;
 }
 
 .social-media-list a:hover {
   text-decoration: none;
 }
 
 .social-media-list a:hover .username {
   text-decoration: underline;
 }
 
 /**
  * Blockquotes
  */
 blockquote {
   color: #64748b;
   border-left: 4px solid #e2e8f0;
   padding: 20px;
   font-size: 18px;
   font-style: italic;
   background: rgba(255, 255, 255, 0.5);
   border-radius: 0 8px 8px 0;
   backdrop-filter: blur(10px);
   margin: 30px 0;
 }
 
 blockquote > :last-child {
   margin-bottom: 0;
 }
 
 /**
  * Code formatting
  */
 pre,
 code {
   font-family: 'SF Mono', Monaco, 'Cascadia Code', 'Roboto Mono', Consolas, 'Courier New', monospace;
   font-size: 14px;
   border: 1px solid #e2e8f0;
   border-radius: 8px;
   background: rgba(255, 255, 255, 0.8);
   backdrop-filter: blur(10px);
 }
 
 code {
   padding: 4px 8px;
   color: #e11d48;
   font-weight: 500;
 }
 
 pre {
   padding: 16px 20px;
   overflow-x: auto;
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
 }
 
 pre > code {
   border: 0;
   padding-right: 0;
   padding-left: 0;
   color: inherit;
 }
 
 /**
  * Wrapper
  */
 .wrapper {
   max-width: 900px;
   margin-right: auto;
   margin-left: auto;
   padding-right: 40px;
   padding-left: 40px;
 }
 
 @media screen and (max-width: 800px) {
   .wrapper {
     max-width: calc(100% - 30px);
     padding-right: 20px;
     padding-left: 20px;
   }
 }
 
 /**
  * Clearfix
  */
 .footer-col-wrapper:after, .wrapper:after {
   content: "";
   display: table;
   clear: both;
 }
 
 /**
  * Icons
  */
 .svg-icon {
   width: 18px;
   height: 18px;
   display: inline-block;
   fill: #64748b;
   padding-right: 6px;
   vertical-align: text-top;
   transition: fill 0.2s ease;
 }
 
 .svg-icon:hover {
   fill: #3b82f6;
 }
 
 .social-media-list li + li {
   padding-top: 8px;
 }
 
 /**
  * Tables
  */
 table {
   margin-bottom: 30px;
   width: 100%;
   text-align: left;
   color: #374151;
   border-collapse: collapse;
   border: 1px solid #e5e7eb;
   border-radius: 8px;
   overflow: hidden;
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
 }
 
 table tr:nth-child(even) {
   background-color: #f9fafb;
 }
 
 table th, table td {
   padding: 12px 16px;
 }
 
 table th {
   background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
   border: 1px solid #d1d5db;
   border-bottom-color: #9ca3af;
   font-weight: 600;
 }
 
 table td {
   border: 1px solid #e5e7eb;
 }
 
 /**
  * Site header
  */
 .site-header {
   border-top: 4px solid transparent;
   border-image: linear-gradient(90deg, #3b82f6, #8b5cf6) 1;
   background: rgba(255, 255, 255, 0.95);
   backdrop-filter: blur(20px);
   box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
   min-height: 65px;
   position: sticky;
   top: 0;
   z-index: 1000;
   transition: all 0.3s ease;
 }
 
 .site-title {
   font-size: 28px;
   font-weight: 700;
   line-height: 60px;
   letter-spacing: -0.5px;
   margin-bottom: 0;
   float: left;
   background: linear-gradient(135deg, #3b82f6, #8b5cf6);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   position: relative;
 }
 
 .site-title::after {
   display: none;
 }
 
 .site-title:hover {
   transform: none;
 }
 
 .site-title-text {
   position: relative;
 }
 
 .site-nav {
   float: right;
   line-height: 60px;
 }
 
 .site-nav .nav-trigger {
   display: none;
 }
 
 .site-nav .menu-icon {
   display: none;
 }
 
 .site-nav .page-link {
   color: #374151;
   line-height: 1.5;
   font-weight: 500;
   padding: 8px 16px;
   border-radius: 20px;
   transition: all 0.2s ease;
 }
 
 .site-nav .page-link:not(:last-child) {
   margin-right: 10px;
 }
 
 .site-nav .page-link:hover {
   background: rgba(59, 130, 246, 0.1);
   color: #3b82f6;
   transform: translateY(-1px);
 }
 
 .site-nav .page-link::after {
   display: none;
 }
 
 @media screen and (max-width: 600px) {
   .site-nav {
     position: absolute;
     top: 12px;
     right: 20px;
     background: rgba(255, 255, 255, 0.95);
     backdrop-filter: blur(20px);
     border: 1px solid #e5e7eb;
     border-radius: 12px;
     text-align: right;
     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
   }
 
   .site-nav label[for=nav-trigger] {
     display: block;
     float: right;
     width: 40px;
     height: 40px;
     z-index: 2;
     cursor: pointer;
   }
 
   .site-nav .menu-icon {
     display: block;
     float: right;
     width: 40px;
     height: 30px;
     line-height: 0;
     padding-top: 12px;
     text-align: center;
   }
 
   .site-nav .menu-icon > svg {
     fill: #374151;
   }
 
   .site-nav input ~ .trigger {
     clear: both;
     display: none;
   }
 
   .site-nav input:checked ~ .trigger {
     display: block;
     padding-bottom: 8px;
   }
 
   .site-nav .page-link {
     display: block;
     margin-left: 20px;
     padding: 8px 16px;
   }
 
   .site-nav .page-link:not(:last-child) {
     margin-right: 0;
   }
 }
 
 /**
  * Hero Section
  */
 .hero-section {
   text-align: center;
   padding: 60px 0;
   background: linear-gradient(135deg, rgba(59, 130, 246, 0.05), rgba(139, 92, 246, 0.05));
   border-radius: 20px;
   margin-bottom: 60px;
   position: relative;
   overflow: hidden;
 }
 
 .hero-section::before {
   content: '';
   position: absolute;
   top: -50%;
   left: -50%;
   width: 200%;
   height: 200%;
   background: radial-gradient(circle, rgba(59, 130, 246, 0.03) 0%, transparent 50%);
   animation: float 20s ease-in-out infinite;
 }
 
 @keyframes float {
   0%, 100% { transform: translateY(0px); }
   50% { transform: translateY(-10px); }
 }
 
 .hero-title {
   font-size: 3.5rem;
   font-weight: 800;
   background: linear-gradient(135deg, #1e293b, #3b82f6, #8b5cf6);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
   margin-bottom: 20px;
   position: relative;
   z-index: 1;
 }
 
 .hero-subtitle {
   font-size: 1.25rem;
   color: #64748b;
   margin-bottom: 0;
   position: relative;
   z-index: 1;
 }
 
 @media screen and (max-width: 768px) {
   .hero-title {
     font-size: 2.5rem;
   }
   
   .hero-subtitle {
     font-size: 1.1rem;
   }
 }
 
 /**
  * Posts Section
  */
 .posts-section {
   margin-top: 40px;
 }
 
 /**
  * Site footer
  */
 .site-footer {
   border-top: 1px solid #e5e7eb;
   padding: 50px 0 30px;
   background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
   margin-top: 60px;
 }
 
 .footer-content {
   text-align: center;
 }
 
 .footer-heading {
   font-size: 22px;
   font-weight: 600;
   margin-bottom: 12px;
   color: #1e293b;
 }
 
 .footer-description {
   color: #64748b;
   margin-bottom: 30px;
 }
 
 .contact-list,
 .social-media-list {
   list-style: none;
   margin-left: 0;
 }
 
 .footer-col-wrapper {
   font-size: 16px;
   color: #64748b;
   margin-left: -15px;
   justify-content: center;
   display: flex;
   flex-wrap: wrap;
   gap: 40px;
 }
 
 .footer-col {
   margin-bottom: 20px;
   padding-left: 15px;
 }
 
 .footer-links {
   display: flex;
   gap: 20px;
   justify-content: center;
 }
 
 .footer-links a {
   color: #64748b;
   font-weight: 500;
 }
 
 .footer-links a:hover {
   color: #3b82f6;
 }
 
 @media screen and (max-width: 800px) {
   .footer-col-wrapper {
     flex-direction: column;
     text-align: center;
     gap: 20px;
   }
 }
 
 /**
  * Page content
  */
 .page-content {
   padding: 40px 0;
   flex: 1;
 }
 
 .page-heading {
   font-size: 2.5rem;
   margin-bottom: 30px;
 }
 
 .post-list-heading {
   font-size: 2rem;
   margin-bottom: 40px;
   position: relative;
   display: inline-block;
 }
 
 .post-list-heading::after {
   content: '';
   position: absolute;
   bottom: -8px;
   left: 0;
   width: 60px;
   height: 3px;
   background: linear-gradient(90deg, #3b82f6, #8b5cf6);
   border-radius: 2px;
 }
 
 .post-list {
   margin-left: 0;
   list-style: none;
 }
 
 .post-item {
   margin-bottom: 40px;
 }
 
 .post-preview {
   background: rgba(255, 255, 255, 0.8);
   backdrop-filter: blur(20px);
   border-radius: 16px;
   padding: 30px;
   box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
   border: 1px solid rgba(255, 255, 255, 0.2);
   transition: all 0.3s ease;
   position: relative;
   overflow: hidden;
 }
 
 .post-preview:hover {
   transform: translateY(-4px);
   box-shadow: 0 10px 25px -3px rgba(0, 0, 0, 0.1);
 }
 
 .post-meta-wrapper {
   display: flex;
   align-items: center;
   gap: 15px;
   margin-bottom: 15px;
 }
 
 .post-meta {
   font-size: 14px;
   color: #64748b;
   font-weight: 500;
 }
 
 .post-category {
   font-size: 12px;
   color: #3b82f6;
   background: rgba(59, 130, 246, 0.1);
   padding: 4px 12px;
   border-radius: 12px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.5px;
 }
 
 .post-title {
   margin-bottom: 15px;
 }
 
 .post-link {
   display: block;
   font-size: 1.5rem;
   font-weight: 600;
   color: #1e293b;
   transition: all 0.2s ease;
 }
 
 .post-link::after {
   display: none;
 }
 
 .post-link:hover {
   color: #3b82f6;
   transform: none;
 }
 
 .post-excerpt {
   color: #64748b;
   line-height: 1.6;
   margin-bottom: 20px;
 }
 
 .read-more {
   color: #3b82f6;
   font-weight: 600;
   font-size: 14px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
   transition: all 0.2s ease;
 }
 
 .read-more::after {
   display: none;
 }
 
 .read-more:hover {
   color: #1d4ed8;
   transform: translateX(4px);
 }
 
 /**
  * Subscription Section
  */
 .subscription-section {
   margin-top: 60px;
   text-align: center;
 }
 
 .subscription-card {
   background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
   border-radius: 20px;
   padding: 40px;
   border: 1px solid rgba(59, 130, 246, 0.2);
   backdrop-filter: blur(20px);
 }
 
 .subscription-card h3 {
   font-size: 1.5rem;
   margin-bottom: 12px;
   color: #1e293b;
 }
 
 .subscription-card p {
   color: #64748b;
   margin-bottom: 25px;
 }
 
 .subscribe-button {
   display: inline-flex;
   align-items: center;
   gap: 8px;
   background: linear-gradient(135deg, #3b82f6, #8b5cf6);
   color: white !important;
   padding: 12px 24px;
   border-radius: 25px;
   font-weight: 600;
   text-decoration: none;
   transition: all 0.3s ease;
   box-shadow: 0 4px 15px rgba(59, 130, 246, 0.3);
 }
 
 .subscribe-button::after {
   display: none;
 }
 
 .subscribe-button:hover {
   transform: translateY(-2px);
   box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
   color: white !important;
 }
 
 .rss-icon {
   fill: currentColor;
 }
 
 .rss-subscribe {
   margin-bottom: 0;
 }
 
 /**
  * Posts
  */
 .post-header {
   margin-bottom: 40px;
   text-align: center;
   padding: 40px 0;
 }
 
 .post-title {
   font-size: 3rem;
   font-weight: 800;
   letter-spacing: -1px;
   line-height: 1.1;
   background: linear-gradient(135deg, #1e293b, #3b82f6);
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
   background-clip: text;
 }
 
 @media screen and (max-width: 800px) {
   .post-title {
     font-size: 2.5rem;
   }
 }
 
 .post-content {
   margin-bottom: 40px;
   line-height: 1.8;
 }
 
 .post-content h2 {
   font-size: 2rem;
   margin-top: 50px;
   margin-bottom: 20px;
 }
 
 @media screen and (max-width: 800px) {
   .post-content h2 {
     font-size: 1.75rem;
   }
 }
 
 .post-content h3 {
   font-size: 1.5rem;
   margin-top: 40px;
 }
 
 @media screen and (max-width: 800px) {
   .post-content h3 {
     font-size: 1.25rem;
   }
 }
 
 .post-content h4 {
   font-size: 1.25rem;
   margin-top: 30px;
 }
 
 @media screen and (max-width: 800px) {
   .post-content h4 {
     font-size: 1.1rem;
   }
 }
 
 /**
  * Syntax highlighting styles
  */
 .highlight {
   background: rgba(255, 255, 255, 0.9);
   border-radius: 8px;
   backdrop-filter: blur(10px);
 }
 
 .highlighter-rouge .highlight {
   background: rgba(238, 238, 255, 0.8);
 }
 
 .highlight .c { color: #998; font-style: italic; }
 .highlight .err { color: #a61717; background-color: #e3d2d2; }
 .highlight .k { font-weight: bold; }
 .highlight .o { font-weight: bold; }
 .highlight .cm { color: #998; font-style: italic; }
 .highlight .cp { color: #999; font-weight: bold; }
 .highlight .c1 { color: #998; font-style: italic; }
 .highlight .cs { color: #999; font-weight: bold; font-style: italic; }
 .highlight .gd { color: #000; background-color: #fdd; }
 .highlight .gd .x { color: #000; background-color: #faa; }
 .highlight .ge { font-style: italic; }
 .highlight .gr { color: #a00; }
 .highlight .gh { color: #999; }
 .highlight .gi { color: #000; background-color: #dfd; }
 .highlight .gi .x { color: #000; background-color: #afa; }
 .highlight .go { color: #888; }
 .highlight .gp { color: #555; }
 .highlight .gs { font-weight: bold; }
 .highlight .gu { color: #aaa; }
 .highlight .gt { color: #a00; }
 .highlight .kc { font-weight: bold; }
 .highlight .kd { font-weight: bold; }
 .highlight .kp { font-weight: bold; }
 .highlight .kr { font-weight: bold; }
 .highlight .kt { color: #458; font-weight: bold; }
 .highlight .m { color: #099; }
 .highlight .s { color: #d14; }
 .highlight .na { color: #008080; }
 .highlight .nb { color: #0086B3; }
 .highlight .nc { color: #458; font-weight: bold; }
 .highlight .no { color: #008080; }
 .highlight .ni { color: #800080; }
 .highlight .ne { color: #900; font-weight: bold; }
 .highlight .nf { color: #900; font-weight: bold; }
 .highlight .nn { color: #555; }
 .highlight .nt { color: #000080; }
 .highlight .nv { color: #008080; }
 .highlight .ow { font-weight: bold; }
 .highlight .w { color: #bbb; }
 .highlight .mf { color: #099; }
 .highlight .mh { color: #099; }
 .highlight .mi { color: #099; }
 .highlight .mo { color: #099; }
 .highlight .sb { color: #d14; }
 .highlight .sc { color: #d14; }
 .highlight .sd { color: #d14; }
 .highlight .s2 { color: #d14; }
 .highlight .se { color: #d14; }
 .highlight .sh { color: #d14; }
 .highlight .si { color: #d14; }
 .highlight .sx { color: #d14; }
 .highlight .sr { color: #009926; }
 .highlight .s1 { color: #d14; }
 .highlight .ss { color: #990073; }
 .highlight .bp { color: #999; }
 .highlight .vc { color: #008080; }
 .highlight .vg { color: #008080; }
 .highlight .vi { color: #008080; }
 .highlight .il { color: #099; }
 
 /**
  * Custom Animations
  */
 @keyframes fadeInUp {
   from {
     opacity: 0;
     transform: translateY(30px);
   }
   to {
     opacity: 1;
     transform: translateY(0);
   }
 }
 
 .post-preview {
   animation: fadeInUp 0.6s ease forwards;
 }
 
 .post-preview:nth-child(2) { animation-delay: 0.1s; }
 .post-preview:nth-child(3) { animation-delay: 0.2s; }
 .post-preview:nth-child(4) { animation-delay: 0.3s; }
 
 /**
  * Scroll animations
  */
 @media (prefers-reduced-motion: no-preference) {
   .hero-section {
     animation: fadeInUp 0.8s ease;
   }
   
   .posts-section {
     animation: fadeInUp 0.8s ease 0.2s both;
   }
 }
 
 /**
  * Dark mode support
  */
 @media (prefers-color-scheme: dark) {
   body {
     color: #e2e8f0;
     background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
   }
   
   .site-header {
     background: rgba(15, 23, 42, 0.95);
     border-bottom: 1px solid #334155;
   }
   
   .post-preview {
     background: rgba(30, 41, 59, 0.8);
     border: 1px solid rgba(51, 65, 85, 0.3);
   }
   
   .hero-section {
     background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
   }
   
   .site-footer {
     background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
     border-top: 1px solid #334155;
   }
 }
 
 /*# sourceMappingURL=main.css.map */

 footer {
    text-align: center;
    padding: 20px 0;
    border-top: 1px solid #eee;
    margin-top: 40px;
  }
  
  footer p {
    color: #666;
    font-size: 0.9em;
    margin: 0;
  }