*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#F3F4F6;color:#111827}
.chakra-glow{position:relative;background:radial-gradient(1200px 1200px at 10% -10%, rgba(109,40,217,.12), transparent 60%),radial-gradient(800px 800px at 110% 10%, rgba(16,185,129,.12), transparent 55%),linear-gradient(180deg,#fff,#fbfbfe);border-radius:24px;box-shadow:0 10px 30px rgba(17,24,39,.08),0 1px 0 rgba(255,255,255,.8) inset;overflow:hidden}
.card{border-radius:20px;padding:24px;background:#fff;box-shadow:0 6px 20px rgba(17,24,39,.06);transition:transform .35s ease,box-shadow .35s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 16px 40px rgba(17,24,39,.12)}
.reveal{opacity:0;transform:translateY(12px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:12px;text-decoration:none;font-weight:600;background:linear-gradient(135deg,#6D28D9,#4338CA);color:#fff;box-shadow:0 8px 24px rgba(67,56,202,.35)}
.container{max-width:1200px;margin:0 auto;padding:20px}
.grid{display:grid;grid-gap:20px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.hero{padding:80px 20px}
.hero h1,.hero h2{font-size:clamp(32px,5vw,56px);margin:0 0 12px}
.hero p{font-size:clamp(16px,2.5vw,20px);max-width:720px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:10px 12px;border-bottom:1px solid #e5e7eb;text-align:left}