
/* ──────────────────────── mobile responsive ──────────────────────── */
@media (max-width: 768px) {

  /* Container padding */
  .container { padding: 0 20px !important; }

  /* Header — stack logo and hide nav */
  .gh-head-desktop { display: none; }

  /* Home page grid → single column */
  .home-grid {
    display: block !important;
  }
  .home-sidebar {
    position: static !important;
    margin-bottom: 32px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--rule);
  }

  /* Feature image → hide on mobile for cleaner cards */
  .post-thumb { display: none !important; }

  /* Article titles → smaller on mobile */
  .post-title-lg {
    font-size: 22px !important;
    line-height: 1.25 !important;
  }

  /* Page H1 → smaller */
  .page-h1 {
    font-size: 28px !important;
    line-height: 1.2 !important;
  }

  /* Reading grid → single column */
  .reading-row {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }

  /* About timeline → single column */
  .timeline-row {
    grid-template-columns: 1fr !important;
    gap: 2px !important;
  }

  /* Subscribe row */
  .subscribe-row {
    flex-direction: column !important;
  }
  .subscribe-row input { width: 100% !important; }

  /* Source cards on mobile */
  .source-card-header {
    flex-wrap: wrap;
    gap: 8px;
  }
}

@media (max-width: 480px) {
  .container { padding: 0 16px !important; }
  .post-title-lg { font-size: 20px !important; }
}

/* ──────────── shimmer animation ──────────── */
@keyframes shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
