/* Novel Research Foundation — lightweight “ultra-modern” skin (no build step) */

:root{
  --bg0:#070a12;
  --bg1:#0b1220;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --stroke: rgba(255,255,255,.12);
  --muted: rgba(255,255,255,.70);
  --muted2: rgba(255,255,255,.55);
  --shadow: 0 20px 55px rgba(0,0,0,.45);
  --glow: 0 0 60px rgba(56,189,248,.22);

  /* Accent (changes with theme switcher) */
  --a0:#38bdf8; /* sky-400 */
  --a1:#6366f1; /* indigo-500 */
  --a2:#22c55e; /* green-500 */
}

html { scroll-behavior: smooth; }
body{
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(56,189,248,.18), transparent 55%),
    radial-gradient(900px 500px at 95% 10%, rgba(99,102,241,.18), transparent 55%),
    radial-gradient(700px 420px at 45% 105%, rgba(34,197,94,.12), transparent 60%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
  color: white;
}

/* Dark / Light mode (we keep it “dark-first” but support light) */
body.light{
  --bg0:#f7f9ff;
  --bg1:#eef2ff;
  --card: rgba(15,23,42,.06);
  --card2: rgba(15,23,42,.08);
  --stroke: rgba(2,6,23,.12);
  --muted: rgba(2,6,23,.78);
  --muted2: rgba(2,6,23,.60);
  --shadow: 0 20px 55px rgba(2,6,23,.12);
  color: #0b1220;
  background:
    radial-gradient(1200px 600px at 10% -10%, rgba(56,189,248,.24), transparent 55%),
    radial-gradient(900px 500px at 95% 10%, rgba(99,102,241,.18), transparent 55%),
    radial-gradient(700px 420px at 45% 105%, rgba(34,197,94,.16), transparent 60%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
}

.glass{
  background: var(--card);
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
  backdrop-filter: blur(14px);
}
.glass-strong{
  background: var(--card2);
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
}

.text-muted{ color: var(--muted); }
.text-muted2{ color: var(--muted2); }

/* Glow gradient line */
.hr-glow{
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(56,189,248,.75), rgba(99,102,241,.75), rgba(34,197,94,.55), transparent);
  opacity:.75;
}

/* Animated “aurora” blob */
.aurora{
  position:absolute;
  inset:-40%;
  pointer-events:none;
  filter: blur(40px);
  opacity:.45;
  background:
    radial-gradient(circle at 30% 30%, rgba(56,189,248,.55), transparent 45%),
    radial-gradient(circle at 70% 40%, rgba(99,102,241,.50), transparent 50%),
    radial-gradient(circle at 55% 75%, rgba(34,197,94,.35), transparent 55%);
  animation: floaty 14s ease-in-out infinite alternate;
}
@keyframes floaty{
  0%   { transform: translate3d(-2%, -2%, 0) scale(1.0) rotate(-3deg); }
  100% { transform: translate3d(2%, 2%, 0) scale(1.06) rotate(3deg); }
}

/* Reveal animation */
.reveal{
  opacity:0;
  transform: translateY(14px);
  transition: opacity .8s ease, transform .8s ease;
}
.reveal.in{
  opacity:1;
  transform: translateY(0);
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.78rem 1.05rem;
  border-radius: 9999px;
  border: 1px solid var(--stroke);
  background: rgba(255,255,255,.06);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}
.btn:hover{ transform: translateY(-1px); background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.18); }
.btn-primary{
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(135deg, rgba(56,189,248,.95), rgba(99,102,241,.90), rgba(34,197,94,.70));
  color: #07101f;
  font-weight: 700;
}
body.light .btn-primary{ color: #07101f; }

/* Sticky nav blur */
.nav-blur{
  background: rgba(7,10,18,.55);
  border-bottom: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
}
body.light .nav-blur{
  background: rgba(247,249,255,.70);
  border-bottom: 1px solid rgba(2,6,23,.10);
}

/* Ensure anchored sections don’t hide under nav */
.section{ scroll-margin-top: 84px; }

/* Small decorative tag */
.pill{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.35rem .7rem;
  border-radius: 9999px;
  border:1px solid var(--stroke);
  background: rgba(255,255,255,.05);
}

/* Card hover */
.hover-lift{
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.hover-lift:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
}

/* Footer */
.footer-link{ opacity:.85; }
.footer-link:hover{ opacity:1; text-decoration: underline; }

/* Fancy outline for images */
.frame{
  border-radius: 20px;
  overflow:hidden;
  border: 1px solid var(--stroke);
  box-shadow: var(--shadow);
}

/* Tiny “status” banners */
.notice{
  border-left: 3px solid rgba(56,189,248,.9);
  background: rgba(56,189,248,.08);
  border: 1px solid rgba(56,189,248,.16);
}
body.light .notice{
  background: rgba(56,189,248,.10);
}

/* Accessibility */
:focus-visible{ outline: 2px solid rgba(56,189,248,.85); outline-offset: 3px; }


/* Nav links (works for dark + light) */
.navlink{ color: var(--muted); opacity:.88; transition: opacity .15s ease; }
.navlink:hover{ opacity:1; text-decoration: underline; }
