/*
  styles.css — Sky Editorial theme
*/

/* ── Base transitions ── */
html { transition: background-color 0.4s ease, color 0.4s ease; }
body { transition: background-color 0.4s ease; }

/* ── Stagger delays ── */
.stagger-1 { animation-delay: 0.08s; }
.stagger-2 { animation-delay: 0.16s; }
.stagger-3 { animation-delay: 0.24s; }
.stagger-4 { animation-delay: 0.32s; }
.stagger-5 { animation-delay: 0.40s; }
.stagger-6 { animation-delay: 0.48s; }

/* ── Mobile menu ── */
.site-menu[aria-hidden="true"] { display: none; }

.site-menu a {
  display: block;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  border-radius: 0.5rem;
  color: #4e5d6a;
  text-decoration: none;
  transition: all 0.2s ease;
}
.site-menu a:hover {
  background: rgba(45, 125, 184, 0.06);
  color: #2d7db8;
}
.site-menu a.active,
.site-menu a[aria-current="page"] {
  color: #2d7db8;
  background: rgba(45, 125, 184, 0.08);
  font-weight: 500;
}

.dark .site-menu a { color: #b8c2cc; }
.dark .site-menu a:hover {
  background: rgba(74, 155, 212, 0.1);
  color: #7ab8ec;
}
.dark .site-menu a.active,
.dark .site-menu a[aria-current="page"] {
  color: #7ab8ec;
  background: rgba(74, 155, 212, 0.12);
}

/* ── Desktop nav active ── */
.nav a.active,
.nav a[aria-current="page"] {
  color: #2d7db8;
}
.nav a.active::after,
.nav a[aria-current="page"]::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  height: 1.5px;
  background: #2d7db8;
  border-radius: 1px;
}

.dark .nav a.active,
.dark .nav a[aria-current="page"] { color: #7ab8ec; }
.dark .nav a.active::after,
.dark .nav a[aria-current="page"]::after {
  background: #7ab8ec;
}

/* ── Prose ── */
.prose pre {
  border-radius: 0.5rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
}
.dark .prose pre {
  border-color: rgba(255, 255, 255, 0.06);
  background: #0d1117 !important;
}
.prose code:not(pre code) {
  padding: 0.15em 0.4em;
  border-radius: 0.25rem;
  font-size: 0.875em;
  background: rgba(45, 125, 184, 0.08);
  color: #1e5f8f;
}
.dark .prose code:not(pre code) {
  background: rgba(74, 155, 212, 0.12);
  color: #7ab8ec;
}

/* ── Scrollbar ── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: #cdd6de;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover { background: #b8c2cc; }
.dark ::-webkit-scrollbar-thumb { background: #2c3a47; }
.dark ::-webkit-scrollbar-thumb:hover { background: #4e5d6a; }

/* ── Selection ── */
::selection {
  background: rgba(45, 125, 184, 0.15);
  color: #1a2530;
}
.dark ::selection {
  background: rgba(74, 155, 212, 0.25);
  color: #e4e8ec;
}

/* ── Hero sky gradient ── */
.sky-gradient {
  background: linear-gradient(170deg, #dbeafe 0%, #f0f7ff 35%, #f8fafb 70%, #f8fafb 100%);
}
.dark .sky-gradient {
  background: linear-gradient(170deg, #0d1117 0%, #111d2b 40%, #0d1117 100%);
}