/* EpicCBT custom styles */

/* Prevent dark-mode flash on load */
html.dark { background:#0a0f0d; }

/* Staggered hero reveal */
@keyframes rise { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
.rise { animation: rise .7s cubic-bezier(.2,.7,.2,1) both; }
.rise-1 { animation-delay:.05s; } .rise-2 { animation-delay:.15s; }
.rise-3 { animation-delay:.25s; } .rise-4 { animation-delay:.35s; }

/* Lesson note rich content */
.prose-note h1,.prose-note h2,.prose-note h3 { font-family:'Fraunces',serif; font-weight:600; margin:1.1em 0 .5em; }
.prose-note h3 { font-size:1.25rem; }
.prose-note p { margin:.7em 0; line-height:1.7; }
.prose-note ul,.prose-note ol { margin:.7em 0; padding-left:1.4em; list-style:disc; }
.prose-note ol { list-style:decimal; }
.prose-note img { max-width:100%; border-radius:.75rem; margin:1em 0; }
.prose-note code { background:rgba(47,158,99,.12); padding:.1em .4em; border-radius:.3em; font-size:.9em; }

/* Subtle grain texture on hero */
.grain::before{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Quiz option states */
.qopt { transition: all .15s ease; }
.qopt:hover { border-color:#2f9e63; }
.qopt.selected { border-color:#2f9e63; background:rgba(47,158,99,.08); }

/* Smooth scrollbar for note reader */
.note-scroll::-webkit-scrollbar{ width:8px; }
.note-scroll::-webkit-scrollbar-thumb{ background:#86c9a3; border-radius:8px; }