/* Bencefalo v90 — course identities + focused scroll stack */

/* Course visual identities: preserve content, give each programme a distinct aura. */
.course-card.course-lab{
  --course-accent:#4de3d1;
  --course-accent-soft:rgba(77,227,209,.18);
  --course-accent-2:#29b981;
  border-color:rgba(77,227,209,.26)!important;
  background:
    radial-gradient(34rem 25rem at 0% 0%,rgba(31,202,190,.18),transparent 68%),
    radial-gradient(28rem 22rem at 100% 100%,rgba(31,156,91,.10),transparent 72%),
    linear-gradient(145deg,rgba(8,27,31,.98),rgba(5,12,18,.99))!important;
}
.course-card.course-divination{
  --course-accent:#ff9a62;
  --course-accent-soft:rgba(255,119,119,.17);
  --course-accent-2:#ff5f9e;
  border-color:rgba(255,131,108,.28)!important;
  background:
    radial-gradient(34rem 25rem at 0% 0%,rgba(255,133,73,.17),transparent 68%),
    radial-gradient(28rem 22rem at 100% 100%,rgba(255,76,146,.11),transparent 72%),
    linear-gradient(145deg,rgba(30,17,22,.98),rgba(12,8,17,.99))!important;
}
.course-card.course-tarot{
  --course-accent:#9c72ff;
  --course-accent-soft:rgba(112,90,255,.18);
  --course-accent-2:#3b82ff;
  border-color:rgba(112,108,255,.30)!important;
  background:
    radial-gradient(34rem 25rem at 0% 0%,rgba(137,76,255,.19),transparent 68%),
    radial-gradient(30rem 22rem at 100% 100%,rgba(50,102,255,.12),transparent 72%),
    linear-gradient(145deg,rgba(18,14,37,.98),rgba(6,9,22,.99))!important;
}

.course-card.course-lab::before,
.course-card.course-divination::before,
.course-card.course-tarot::before{
  width:3px!important;
  opacity:.82!important;
  background:linear-gradient(180deg,transparent,var(--course-accent) 34%,var(--course-accent-2) 72%,transparent)!important;
}
.course-card.course-lab .course-pill,
.course-card.course-lab .course-fact b,
.course-card.course-lab .course-topic-title,
.course-card.course-divination .course-pill,
.course-card.course-divination .course-fact b,
.course-card.course-divination .course-topic-title,
.course-card.course-tarot .course-pill,
.course-card.course-tarot .course-fact b,
.course-card.course-tarot .course-topic-title{
  color:var(--course-accent)!important;
}
.course-card.course-lab .course-pill,
.course-card.course-lab .course-fact,
.course-card.course-lab .course-topic-box,
.course-card.course-lab .course-topic,
.course-card.course-divination .course-pill,
.course-card.course-divination .course-fact,
.course-card.course-divination .course-topic-box,
.course-card.course-divination .course-topic,
.course-card.course-tarot .course-pill,
.course-card.course-tarot .course-fact,
.course-card.course-tarot .course-topic-box,
.course-card.course-tarot .course-topic{
  border-color:color-mix(in srgb,var(--course-accent) 23%,transparent)!important;
}
.course-card.course-lab .course-pill,
.course-card.course-lab .course-topic,
.course-card.course-divination .course-pill,
.course-card.course-divination .course-topic,
.course-card.course-tarot .course-pill,
.course-card.course-tarot .course-topic{
  background:color-mix(in srgb,var(--course-accent) 5%,transparent)!important;
}

/* Focused course browsing:
   only the course nearest the viewport center stays fully present. */
.course-focus .course-card{
  will-change:opacity,transform,filter;
  transition:
    opacity .46s ease,
    transform .52s cubic-bezier(.22,.72,.25,1),
    filter .46s ease,
    box-shadow .46s ease!important;
}
.course-focus .course-card.is-active{
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
  filter:none!important;
  pointer-events:auto;
}
.course-focus .course-card.is-past{
  opacity:.035!important;
  transform:translateY(-22px) scale(.975)!important;
  filter:blur(1.4px) saturate(.55)!important;
  pointer-events:none;
}
.course-focus .course-card.is-future{
  opacity:.20!important;
  transform:translateY(14px) scale(.985)!important;
  filter:saturate(.68)!important;
  pointer-events:auto;
}

/* Desktop becomes a true stacking sequence instead of a visible list. */
@media(min-width:821px) and (min-height:700px){
  .course-list{gap:30px!important}
  .course-list .course-card{
    position:sticky!important;
    top:94px!important;
  }
  .course-list .course-card:nth-child(1){z-index:11}
  .course-list .course-card:nth-child(2){z-index:12}
  .course-list .course-card:nth-child(3){z-index:13}
  .course-list .course-card:nth-child(4){z-index:14}
}

/* Mobile keeps every card fully readable while retaining the focus transition. */
@media(max-width:820px){
  .course-focus .course-card.is-past{
    opacity:.10!important;
    transform:translateY(-10px) scale(.985)!important;
    filter:saturate(.60)!important;
  }
  .course-focus .course-card.is-future{
    opacity:.26!important;
    transform:translateY(8px) scale(.992)!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .course-focus .course-card,
  .course-focus .course-card.is-active,
  .course-focus .course-card.is-past,
  .course-focus .course-card.is-future{
    position:relative!important;
    top:auto!important;
    opacity:1!important;
    transform:none!important;
    filter:none!important;
    transition:none!important;
    pointer-events:auto!important;
  }
}