/* NepalKatha — custom CSS (Tailwind handles most styling) */

/* Smooth scrolling */
html { scroll-behavior: smooth; }

/* Nepali / Devanagari font stacks */
body { font-family: 'Mukta', 'Hind', system-ui, sans-serif; }
.font-display { font-family: 'Yatra One', serif; }

/* Line clamp utilities */
.line-clamp-1 { display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* Article prose */
.prose p { margin-bottom: 1.2em; line-height: 1.9; }
.prose h2 { font-size: 1.4rem; font-weight: 700; margin: 2rem 0 0.75rem; }
.prose h3 { font-size: 1.2rem; font-weight: 700; margin: 1.6rem 0 0.5rem; }
.prose blockquote { border-left: 4px solid #c0392b; padding-left: 1.2rem; color: #555; font-style: italic; margin: 1.5rem 0; }
.prose img { border-radius: .75rem; max-width: 100%; height: auto; margin: 1rem 0; }
.prose a { color: #c0392b; text-decoration: underline; }
.dark .prose p, .dark .prose li { color: #d1d5db; }
.dark .prose h2, .dark .prose h3 { color: #f9fafb; }
.dark .prose blockquote { color: #9ca3af; }

/* Skeleton loading */
.skeleton { background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  background-size: 200% 100%; animation: skeleton 1.4s infinite; border-radius: .5rem; }
.dark .skeleton { background: linear-gradient(90deg, #374151 25%, #4b5563 50%, #374151 75%); background-size: 200% 100%; }
@keyframes skeleton { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }

/* Progress bar */
#readProgress { position: fixed; top: 0; left: 0; height: 3px; background: #c0392b; z-index: 9999; width: 0; transition: width .1s; }

/* AdSense label */
.ad-label { text-align: center; font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; color: #9ca3af; margin-bottom: 2px; }

/* Sidebar sticky */
@media (min-width: 1024px) { .sidebar-sticky { position: sticky; top: 5rem; } }

/* Card hover */
.post-card { transition: transform .2s, box-shadow .2s; }
.post-card:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0,0,0,.08); }
.dark .post-card:hover { box-shadow: 0 8px 25px rgba(0,0,0,.35); }

/* Focus visible */
*:focus-visible { outline: 2px solid #c0392b; outline-offset: 2px; }