
:root{
  --teal:#00A99D; --tealdark:#008F86; --black:#0B0F12; --mint:#6EE7B7;
}
.text-mint{color:var(--mint)}
.nav-link{ @apply text-white/80 text-sm px-3 py-2 rounded-xl hover:bg-white/10 transition; }
.btn{ @apply inline-flex items-center justify-center px-4 py-2 rounded-2xl font-medium border border-white/10; }
.btn-primary{ @apply bg-[var(--teal)] text-black hover:bg-[var(--tealdark)] hover:text-white; }
.btn-secondary{ @apply bg-white/5 text-white hover:bg-white/10; }
.btn-ghost{ @apply text-white/80 hover:text-white; }
.section{ @apply py-16; }
.section.alt{ @apply bg-white/5; }
.section-head{ @apply max-w-4xl mx-auto px-4 text-center mb-10; }
.section-head h2{ @apply text-3xl md:text-4xl font-extrabold; }
.section-head .sub{ @apply text-white/70 mt-2; }
.card{ @apply bg-white/5 border border-white/10 rounded-3xl p-6; }
.card-title{ @apply text-xl font-bold mb-2; }
.list li{ @apply list-disc ml-5 text-white/80; }
.glass{ background: linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03)); border: 1px solid rgba(255,255,255,0.15); }
.stat{ @apply bg-white/5 rounded-2xl px-4 py-3 border border-white/10; }
.stat-label{ @apply text-white/60 text-xs; }
.stat-value{ @apply text-sm font-semibold; }
.link{ @apply text-white/80 hover:text-white underline-offset-4 hover:underline; }
