:root { color-scheme: light; --background-shift: 0px; }
html.dark { color-scheme: dark; }
html { scroll-padding-top: 88px; }
body { position: relative; min-height: 100vh; isolation: isolate; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; background: transparent !important; }
body::before { content: ""; position: fixed; inset: -12vh -5vw; z-index: -2; pointer-events: none; background: url('/assets/images/og.png') center / cover no-repeat; transform: translate3d(0, var(--background-shift), 0) scale(1.08); will-change: transform; }
body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: rgba(241,245,249,.48); }
html.dark body::after { background: rgba(2,6,23,.58); }
main > section:not(.hero-shell) { margin-top: 2rem; padding: 2rem; border: 1px solid rgba(255,255,255,.42) !important; border-radius: 1.25rem; background: rgba(255,255,255,.58); box-shadow: 0 20px 55px rgba(15,23,42,.12); backdrop-filter: blur(16px) saturate(125%); -webkit-backdrop-filter: blur(16px) saturate(125%); }
html.dark main > section:not(.hero-shell) { background: rgba(15,23,42,.52); border-color: rgba(148,163,184,.28) !important; box-shadow: 0 20px 55px rgba(2,6,23,.32); }
.publication-block, .project-card, .timeline-block, .resource-card, .research-card { background: rgba(255,255,255,.56) !important; backdrop-filter: blur(14px) saturate(120%); -webkit-backdrop-filter: blur(14px) saturate(120%); }
html.dark .publication-block, html.dark .project-card, html.dark .timeline-block, html.dark .resource-card, html.dark .research-card { background: rgba(15,23,42,.54) !important; }
footer { position: relative; background: rgba(255,255,255,.42); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
html.dark footer { background: rgba(2,6,23,.42); }
a, button { outline-offset: 4px; }
a:focus-visible, button:focus-visible { outline: 3px solid #2563eb; border-radius: .35rem; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 100; padding: .75rem 1rem; background: #fff; color: #0f172a; box-shadow: 0 8px 24px rgba(15,23,42,.2); }
.skip-link:focus { top: 1rem; }
.site-header { min-height: 72px; }
.nav-link[aria-current="page"] { color: #2563eb; font-weight: 600; }
.prose-copy { max-width: 68ch; }
.section-kicker { letter-spacing: .12em; text-transform: uppercase; font-size: .75rem; font-weight: 700; color: #2563eb; }
.card-lift { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.card-lift:hover { transform: translateY(-2px); box-shadow: 0 14px 35px rgba(15,23,42,.09); }
html.dark .card-lift:hover,
html.dark .publication-block:hover,
html.dark .project-card:hover,
html.dark .timeline-block:hover,
html.dark .resource-card:hover {
  border-color: rgba(255,255,255,.42) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.1),
    0 10px 28px rgba(255,255,255,.13),
    0 0 34px rgba(125,211,252,.1) !important;
}
html.dark .nav-link:hover { color: #e0f2fe; text-shadow: 0 0 16px rgba(255,255,255,.45); }
.hero-shell { position: relative; min-height: 640px; display: grid; align-items: center; isolation: isolate; overflow: hidden; border-radius: 0 0 2.5rem 2.5rem; }
.hero-shell::before { content: ""; position: absolute; inset: 0; z-index: -3; background: linear-gradient(90deg, rgba(2,6,23,.46), rgba(2,6,23,.08)); }
.hero-shell::after { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(0deg, rgba(2,6,23,.35), transparent 48%); }
.hero-grid { position: absolute; inset: 0; z-index: -1; opacity: .12; background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px); background-size: 42px 42px; mask-image: linear-gradient(to right, black, transparent 75%); }
.hero-panel { position: relative; border: 1px solid rgba(255,255,255,.2); background: rgba(15,23,42,.42); box-shadow: 0 28px 80px rgba(2,6,23,.28); backdrop-filter: blur(14px); }
.contact-panel { background: rgba(15,23,42,.42) !important; box-shadow: 0 28px 80px rgba(2,6,23,.28) !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; }
.hero-portrait { box-shadow: 0 0 0 8px rgba(255,255,255,.1), 0 25px 60px rgba(2,6,23,.45); }
.research-card { position: relative; overflow: hidden; }
.research-card::before { content: attr(data-number); position: absolute; right: 1rem; top: -.75rem; font-size: 5rem; line-height: 1; font-weight: 800; color: rgba(37,99,235,.07); }
.accent-rule { width: 3.5rem; height: .25rem; border-radius: 99px; background: linear-gradient(90deg,#2563eb,#38bdf8); }
.feature-panel { position: relative; overflow: hidden; background: linear-gradient(135deg,rgba(15,23,42,.7) 0%,rgba(23,37,84,.62) 62%,rgba(12,74,110,.58) 100%); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.feature-panel::after { content: ""; position: absolute; width: 22rem; height: 22rem; right: -8rem; top: -10rem; border: 1px solid rgba(125,211,252,.28); border-radius: 50%; box-shadow: 0 0 0 3rem rgba(125,211,252,.04),0 0 0 6rem rgba(125,211,252,.03); }
.publication-block { position: relative; }
.publication-block::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; border-radius: 1rem 0 0 1rem; background: linear-gradient(#2563eb,#38bdf8); opacity: .7; }
.publication-abstract {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  margin-top: 0;
  transition: max-height .45s ease, opacity .25s ease, margin-top .3s ease;
}
.publication-block:hover .publication-abstract {
  max-height: 32rem;
  opacity: 1;
  margin-top: 1rem;
}
.timeline-description { max-height: none !important; opacity: 1 !important; margin-top: 1rem !important; }
@media (min-width: 1200px) { .hero-shell { margin-left: calc((100vw - 72rem) / -2); margin-right: calc((100vw - 72rem) / -2); padding-left: calc((100vw - 72rem) / 2); padding-right: calc((100vw - 72rem) / 2); } }
@media (max-width: 767px) {
  main > section:not(.hero-shell) { padding: 1.25rem; }
  .hero-shell { min-height: auto; border-radius: 0 0 1.75rem 1.75rem; }
  .hero-shell::before { background-position: 62% center; }
  .hero-shell::after { background: linear-gradient(rgba(2,6,23,.82),rgba(2,6,23,.9)); }
  #siteNav { display: none; position: absolute; top: 72px; left: 0; right: 0; padding: .75rem 1rem 1rem; background: rgba(255,255,255,.98); border-bottom: 1px solid #e2e8f0; box-shadow: 0 12px 25px rgba(15,23,42,.08); }
  html.dark #siteNav { background: rgba(15,23,42,.98); border-color: #334155; }
  #siteNav.is-open { display: flex; }
}
@media (prefers-reduced-motion: reduce) {
  body::before { transform: scale(1.08); will-change: auto; }
  html { scroll-behavior: auto !important; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}