/* General reset */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
      }
      
      body {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, sans-serif;
	background: linear-gradient(180deg, #f8f9fb 0%, #eef2f7 100%);
	color: #222;
	line-height: 1.6;
	padding: 2rem;
	max-width: 760px;
	margin: auto;
      }
      
      /* Header + Logo */
      header {
	text-align: center;
	margin-bottom: 3.5rem;
      }
      
      .logo {
	font-size: 3rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	background: linear-gradient(90deg, #667eea, #764ba2, #ff758c);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
	text-shadow: 0 0 20px rgba(118, 75, 162, 0.1);
      }
      
      .subtitle {
	font-size: 1rem;
	color: #555;
	margin-top: 0.5rem;
	font-style: italic;
      }
      
      /* Article styling */
      article {
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
	padding: 2rem 2.5rem;
	transition: transform 0.3s ease;
      }
      
      article:hover {
	transform: translateY(-3px);
      }
      
      article h2 {
	font-size: 1.7rem;
	color: #333;
	margin-bottom: 1.5rem;
      }
      
      article p {
	margin-bottom: 1rem;
	font-size: 1.05rem;
      }
      
      /* Footer */
      footer {
	text-align: center;
	margin-top: 3rem;
	padding-top: 1.2rem;
	border-top: 1px solid #ddd;
	color: #666;
	font-size: 0.9rem;
      }
      
      /* Accent link style for future posts */
      a {
	color: #667eea;
	text-decoration: none;
      }
      
      a:hover {
	text-decoration: underline;
      }
      
      /* Subtle fade-in animation */
      body {
	opacity: 0;
	animation: fadeIn 0.8s ease forwards;
      }
      
      @keyframes fadeIn {
	to {
	  opacity: 1;
	}
      }