/* Non-critical Discover styles loaded after first paint */

/* Page header layout tweaks */
.page-header { position: relative; top: auto; z-index: auto; backdrop-filter: none; -webkit-backdrop-filter: none; }

/* Make only the Topics/Top row sticky (mobile and desktop) */
.topics-sticky { position: sticky; z-index: 9; backdrop-filter: none; -webkit-backdrop-filter: none; }
@media (max-width: 767px){ .topics-sticky { top: 60px; background: rgba(255,255,255,0.98); color: #000; } }
@media (min-width: 768px){ .topics-sticky { top: 90px; background: rgba(255,255,255,0.95); color: #000; } }
.dark .topics-sticky { background: rgba(0,0,0,0.85); color: #fff; }

/* Ensure H1 remains black in light mode */
@media (max-width: 767px){ html:not(.dark) .discover-brand { color: #000 !important; } }
html:not(.dark) .discover-brand { color: #000 !important; }

/* Cards grid */
.stories-grid { display: grid; grid-template-columns: repeat(1,minmax(0,1fr)); gap: 1rem; }
@media (min-width: 768px){ .stories-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.25rem; } }

/* Featured area */
.featured-articles { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px){ .featured-articles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; } }

/* Discover page fine styles */
.discover-page { scroll-margin-top: 80px; }
.discover-content .js-card { will-change: transform; transition: transform .2s ease, box-shadow .2s ease; }
.discover-content .js-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(2, 6, 23, .08); }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce){
  .discover-content .js-card, .discover-content .js-card:hover { transition: none; transform: none; box-shadow: none; }
}