/* Vintage Newspaper Style */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital@0;1&family=Libre+Baskerville:wght@400;700&display=swap');

* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: 'Libre Baskerville','Noto Serif Malayalam',serif;
  background:#f5f1e8;
  color:#222;
  line-height:1.6;
  padding:20px;
}
h1,h2,h3 { font-family:'EB Garamond',serif; color:#111; }
a { color:#111; text-decoration:none; }

/* Masthead with optional hero bg */
.masthead {
  position:relative;
  border-bottom:2px solid #222;
  margin-bottom:20px;
  padding:40px 10px 14px;
  background-size:cover;
  background-position:center;
}
.masthead::after {
  content:"";
  position:absolute; inset:0;
  background:rgba(245,241,232,0.85);
  pointer-events:none;
}
.masthead h1,
.masthead .tagline { position:relative; z-index:1; }
.masthead h1 { font-size:3rem; letter-spacing:1px; }
.tagline { font-style:italic; opacity:0.7; }

/* Nav */
.navigation { margin:20px 0; }
.navigation a { margin-right:15px; font-weight:bold; }

/* Sections */
.section { margin:30px auto; max-width:900px; }
.section h2 {
  font-size:2rem;
  border-bottom:1px dashed #666;
  padding-bottom:5px;
  margin-bottom:15px;
}

/* Timeline */
#timeline-container { display:flex; flex-direction:column; }
.timeline-event {
  margin-bottom:15px;
  padding:10px 12px;
  border-left:3px solid #111;
  background:#fff;
  opacity:0; transform:translateX(-50px);
  box-shadow:0 1px 4px rgba(0,0,0,0.05);
}
.timeline-img {
  margin-top:10px; width:100%; max-height:320px; object-fit:cover;
  border:1px solid #ccc; box-shadow:2px 2px 5px rgba(0,0,0,0.08);
}

/* Gallery */
.gallery {
  display:grid; gap:15px;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.gallery-card { background:#fff; border:1px solid #ddd; padding:10px; }
.gallery-card img { width:100%; height:auto; }
.gallery-card .cap { font-size:0.9rem; color:#444; margin-top:6px; font-style:italic; }

/* Articles */
.articles-section { column-count:2; column-gap:40px; }
.article-card {
  break-inside:avoid-column;
  background:#fff; padding:15px; margin-bottom:20px; border:1px solid #ddd;
  box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
.article-card img { width:100%; height:auto; border:1px solid #ddd; margin-top:8px; }
.article-card h3 { margin-bottom:5px; }
.article-card p { margin-bottom:10px; }

/* Forms */
.vintage-form {
  background:#fff; padding:20px; border:1px solid #ccc; margin-bottom:30px;
  box-shadow:0 1px 6px rgba(0,0,0,0.05);
}
.vintage-form input, .vintage-form textarea, .vintage-form button {
  width:100%; margin-bottom:10px; padding:10px; font-family:inherit; border:1px solid #ccc; border-radius:4px;
}
.vintage-form textarea { min-height:140px; }
.vintage-form button { background:#111; color:#fff; border:none; cursor:pointer; }
.vintage-form button:hover { background:#333; }

/* Footer */
.footer { margin-top:40px; padding-top:10px; border-top:2px solid #222; text-align:center; }

/* Animation hook */
.timeline-event.visible { opacity:1; transform:translateX(0); transition:0.6s ease-out; }

/* Responsive */
@media (max-width:700px){
  .articles-section { column-count:1; }
  .masthead h1 { font-size:2rem; }
}

/* Article grid (archive) */
.articles-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  gap:22px;
}
.article-tile {
  background:#fff; border:1px solid #ddd; box-shadow:0 2px 8px rgba(0,0,0,0.08);
}
.tile-link { display:block; color:inherit; }
.tile-image img { width:100%; height:180px; object-fit:cover; display:block; border-bottom:1px solid #ddd; }
.tile-body { padding:12px 14px; }
.tile-title { margin-bottom:4px; }
.tile-meta { font-size:0.9rem; color:#666; margin-bottom:8px; }
.tile-excerpt { color:#333; }

/* Single post */
.post-cover { width:100%; max-height:420px; object-fit:cover; border:1px solid #ddd; margin-bottom:16px; }
.post-content p { margin-bottom:14px; font-size:1.05rem; }

/* Reserve tile image space to avoid reflow */
.tile-image { background:#eee; }
.tile-image img { aspect-ratio: 16/9; width:100%; height:auto; display:block; }