/* Lernova – modernes, sternenbasiertes Design für Zensical */
:root > * {
  --md-primary-fg-color: #111827;
  --md-accent-fg-color: #7c3aed;
  --nova-ink: #0f172a;
  --nova-muted: #64748b;
  --nova-blue: #2563eb;
  --nova-cyan: #06b6d4;
  --nova-violet: #7c3aed;
  --nova-pink: #ec4899;
  --nova-amber: #f59e0b;
  --nova-card: rgba(255,255,255,.82);
  --nova-border: rgba(15,23,42,.10);
  --nova-shadow: 0 24px 70px rgba(15,23,42,.12);
  --nova-radius: 28px;
}

[data-md-color-scheme="slate"] {
  --nova-ink: #f8fafc;
  --nova-muted: #cbd5e1;
  --nova-card: rgba(15,23,42,.72);
  --nova-border: rgba(255,255,255,.12);
  --nova-shadow: 0 24px 70px rgba(0,0,0,.35);
}

.md-main__inner { margin-top: 0; }
.md-content__inner { padding-top: 1.2rem; }
.md-typeset h1, .md-typeset h2, .md-typeset h3 { letter-spacing: -0.035em; }
.md-typeset h1 { font-weight: 900; }
.md-typeset h2 { font-weight: 850; }
.md-typeset a { font-weight: 720; }

/* Hero */
.nova-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr);
  gap: clamp(1.5rem, 5vw, 4rem);
  align-items: center;
  overflow: hidden;
  min-height: 520px;
  margin: 0 0 3rem;
  padding: clamp(2rem, 6vw, 5rem);
  border-radius: 42px;
  color: #fff;
  background:
    radial-gradient(circle at 12% 18%, rgba(6,182,212,.85), transparent 28%),
    radial-gradient(circle at 88% 20%, rgba(236,72,153,.72), transparent 24%),
    radial-gradient(circle at 75% 88%, rgba(124,58,237,.88), transparent 30%),
    linear-gradient(135deg, #020617 0%, #172554 55%, #111827 100%);
  box-shadow: var(--nova-shadow);
}

.nova-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.9) 0 1px, transparent 1.5px),
    radial-gradient(circle, rgba(255,255,255,.45) 0 1px, transparent 1.5px);
  background-size: 110px 110px, 170px 170px;
  background-position: 20px 30px, 80px 110px;
  opacity: .55;
  pointer-events: none;
}

.nova-hero__content { position: relative; z-index: 2; }
.nova-pill {
  display: inline-flex;
  align-items: center;
  padding: .42rem .78rem;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  backdrop-filter: blur(14px);
  font-size: .74rem;
  font-weight: 850;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.nova-hero h1 {
  margin: 1rem 0 .7rem;
  color: white;
  font-size: clamp(3rem, 9vw, 7rem);
  line-height: .88;
  font-weight: 950;
}

.nova-lead {
  max-width: 52rem;
  margin: 0;
  color: rgba(255,255,255,.88);
  font-size: clamp(1.1rem, 2vw, 1.45rem);
  line-height: 1.58;
}

.nova-actions { display: flex; gap: .85rem; flex-wrap: wrap; margin-top: 2rem; }
.nova-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 46px;
  padding: .78rem 1.1rem;
  border-radius: 999px;
  text-decoration: none !important;
  font-weight: 850;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.nova-button:hover { transform: translateY(-2px); }
.nova-button--primary { background: white; color: #111827 !important; box-shadow: 0 14px 34px rgba(0,0,0,.22); }
.nova-button--ghost { color: white !important; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.25); }
.nova-button--dark { color: white !important; background: #111827; }

.nova-orbit {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  height: 330px;
}
.nova-orbit::before,
.nova-orbit::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.25);
}
.nova-orbit::before { width: 280px; height: 280px; transform: rotate(-18deg) scaleX(1.18); }
.nova-orbit::after { width: 210px; height: 210px; transform: rotate(31deg) scaleX(1.32); }
.nova-planet {
  position: relative;
  display: grid;
  place-items: center;
  width: 130px;
  height: 130px;
  border-radius: 38px;
  background: linear-gradient(135deg, #06b6d4, #7c3aed 65%, #ec4899);
  box-shadow: 0 30px 80px rgba(124,58,237,.55);
  color: white;
  font-size: 2rem;
  font-weight: 950;
  letter-spacing: -.06em;
}
.nova-star { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: white; box-shadow: 0 0 22px white; }
.nova-star.s1 { top: 35px; right: 58px; }
.nova-star.s2 { bottom: 52px; left: 50px; width: 9px; height: 9px; }
.nova-star.s3 { top: 105px; left: 25px; width: 7px; height: 7px; }

/* Section titles */
.nova-section-title { margin: 2.5rem 0 1rem; }
.nova-section-title span {
  display: inline-block;
  margin-bottom: .35rem;
  color: var(--nova-violet);
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.nova-section-title h2 { margin: 0; font-size: clamp(1.8rem, 4vw, 3rem); }

/* Cards */
.nova-feature-grid,
.nova-realm-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1rem;
  margin: 1.2rem 0 2.4rem;
}

.nova-feature-card,
.nova-realm-card {
  position: relative;
  overflow: hidden;
  display: block;
  padding: 1.35rem;
  min-height: 170px;
  border: 1px solid var(--nova-border);
  border-radius: var(--nova-radius);
  background: var(--nova-card);
  color: var(--nova-ink) !important;
  text-decoration: none !important;
  box-shadow: 0 14px 40px rgba(15,23,42,.07);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.nova-feature-card:hover,
.nova-realm-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--nova-shadow);
  border-color: rgba(124,58,237,.28);
}

.nova-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  border-radius: 17px;
  color: white;
  background: linear-gradient(135deg, var(--nova-blue), var(--nova-violet));
  font-weight: 950;
}
.nova-feature-card h3,
.nova-realm-card h3 { margin: 0 0 .45rem; font-size: 1.25rem; }
.nova-feature-card p,
.nova-realm-card p { margin: 0; color: var(--nova-muted); }

.nova-realm-card { min-height: 210px; color: white !important; }
.nova-realm-card p { color: rgba(255,255,255,.86); }
.nova-realm-card h3 { color: white; font-size: 1.55rem; }
.realm-kicker { font-size: .78rem; text-transform: uppercase; letter-spacing: .16em; font-weight: 950; color: rgba(255,255,255,.72); }
.realm-econ { background: linear-gradient(135deg, #0f766e, #2563eb); }
.realm-law { background: linear-gradient(135deg, #312e81, #7c3aed); }
.realm-money { background: linear-gradient(135deg, #92400e, #f59e0b); }
.realm-life { background: linear-gradient(135deg, #be185d, #7c3aed); }
.nova-realm-card::after {
  content: "";
  position: absolute;
  right: -60px;
  bottom: -70px;
  width: 170px;
  height: 170px;
  border-radius: 50%;
  background: rgba(255,255,255,.16);
}

/* Callout */
.nova-callout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 2.5rem 0;
  padding: 1.4rem;
  border-radius: var(--nova-radius);
  background: linear-gradient(135deg, rgba(6,182,212,.16), rgba(124,58,237,.13));
  border: 1px solid var(--nova-border);
}
.nova-callout p { margin: .25rem 0 0; color: var(--nova-muted); }

/* Timeline */
.nova-timeline { margin: 1.5rem 0 2.2rem; }
.nova-timeline-item {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 1rem;
  align-items: start;
  padding: 1rem 0;
  border-bottom: 1px solid var(--nova-border);
}
.nova-timeline-dot {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 18px;
  color: white;
  background: linear-gradient(135deg, var(--nova-cyan), var(--nova-violet));
  font-weight: 950;
  box-shadow: 0 10px 30px rgba(124,58,237,.22);
}
.nova-timeline h3 { margin: 0 .0 .25rem; }
.nova-timeline p { margin: 0; color: var(--nova-muted); }

/* Existing older classes compatibility */
.lernova-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 1rem; }
.lernova-card { padding: 1.25rem; border: 1px solid var(--nova-border); border-radius: var(--nova-radius); background: var(--nova-card); box-shadow: 0 14px 40px rgba(15,23,42,.07); }
.lernova-badge { display:inline-flex; padding:.25rem .65rem; border-radius:999px; background:rgba(124,58,237,.12); color:var(--nova-violet); font-size:.72rem; font-weight:850; }
.lernova-highlight { padding:1.25rem; border-radius:var(--nova-radius); background:rgba(6,182,212,.12); border-left:5px solid var(--nova-cyan); }

@media (max-width: 760px) {
  .nova-hero { grid-template-columns: 1fr; min-height: auto; border-radius: 30px; }
  .nova-orbit { height: 220px; }
  .nova-orbit::before { width: 210px; height: 210px; }
  .nova-orbit::after { width: 160px; height: 160px; }
  .nova-planet { width: 105px; height: 105px; border-radius: 30px; }
  .nova-callout { flex-direction: column; align-items: flex-start; }
}