/* Static CSS for pricing page — replaces Tailwind CDN runtime */

/* Reset */
*, *::before, *::after { box-sizing: border-box; }

/* Base */
body { font-family: 'Inter', -apple-system, sans-serif; }

/* Layout */
.min-h-screen { min-height: 100vh; }
.max-w-6xl { max-width: 72rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-2xl { max-width: 42rem; }
.mx-auto { margin-left: auto; margin-right: auto; }

/* Padding */
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-5 { padding-left: 1.25rem; padding-right: 1.25rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-2 { padding-left: 0.5rem; padding-right: 0.5rem; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-4  { padding-top: 1rem; padding-bottom: 1rem; }
.py-3  { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-2  { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-1  { padding-top: 0.25rem; padding-bottom: 0.25rem; }
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.p-8   { padding: 2rem; }
.p-6   { padding: 1.5rem; }
.p-1   { padding: 0.25rem; }

/* Margin */
.mb-12 { margin-bottom: 3rem; }
.mb-8  { margin-bottom: 2rem; }
.mb-6  { margin-bottom: 1.5rem; }
.mb-4  { margin-bottom: 1rem; }
.mb-2  { margin-bottom: 0.5rem; }
.mt-16 { margin-top: 4rem; }
.mt-12 { margin-top: 3rem; }
.mt-8  { margin-top: 2rem; }
.mt-3  { margin-top: 0.75rem; }
.mt-2  { margin-top: 0.5rem; }
.mt-1  { margin-top: 0.25rem; }
.mt-0\.5 { margin-top: 0.125rem; }
.ml-1  { margin-left: 0.25rem; }

/* Display */
.flex        { display: flex; }
.inline-flex { display: inline-flex; }
.grid        { display: grid; }
.block       { display: block; }

/* Flex */
.flex-col     { flex-direction: column; }
.flex-1       { flex: 1 1 0%; }
.items-center { align-items: center; }
.items-start  { align-items: flex-start; }
.justify-between { justify-content: space-between; }
.justify-center  { justify-content: center; }
.shrink-0        { flex-shrink: 0; }
.gap-8 { gap: 2rem; }
.gap-6 { gap: 1.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-2 { gap: 0.5rem; }

/* Grid */
@media (min-width: 768px) {
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Width / Height */
.w-full { width: 100%; }
.w-10   { width: 2.5rem; }
.w-5    { width: 1.25rem; }
.w-px   { width: 1px; }
.h-10   { height: 2.5rem; }
.h-5    { height: 1.25rem; }

/* Position */
.relative { position: relative; }
.absolute  { position: absolute; }
.-top-3    { top: -0.75rem; }
.left-1\/2 { left: 50%; }
.-translate-x-1\/2 { transform: translateX(-50%); }

/* Typography */
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-2xl { font-size: 1.5rem;  line-height: 2rem; }
.text-lg  { font-size: 1.125rem; line-height: 1.75rem; }
.text-sm  { font-size: 0.875rem; line-height: 1.25rem; }
.text-xs  { font-size: 0.75rem;  line-height: 1rem; }
.font-extrabold { font-weight: 800; }
.font-bold      { font-weight: 700; }
.font-semibold  { font-weight: 600; }
.font-medium    { font-weight: 500; }
.text-center    { text-align: center; }

/* Colors */
.text-white   { color: #ffffff; }
.text-gray-600 { color: rgb(75,  85,  99); }
.text-gray-500 { color: rgb(107, 114, 128); }
.text-gray-400 { color: rgb(156, 163, 175); }
.text-gray-300 { color: rgb(209, 213, 219); }
.text-gray-200 { color: rgb(229, 231, 235); }
.text-indigo-400  { color: rgb(129, 140, 248); }
.text-purple-400  { color: rgb(192, 132, 252); }
.text-emerald-400 { color: rgb(52,  211, 153); }

/* Backgrounds */
.bg-gray-950      { background-color: rgb(3,  7,  18); }
.bg-gray-900      { background-color: rgb(17, 24, 39); }
.bg-gray-900\/50  { background-color: rgba(17, 24, 39, 0.5); }
.bg-gray-800      { background-color: rgb(31, 41, 55); }
.bg-indigo-600    { background-color: rgb(79, 70, 229); }
.bg-emerald-600\/20 { background-color: rgba(5, 150, 105, 0.2); }

/* Gradients */
:root {
  --tw-gradient-from: transparent;
  --tw-gradient-to:   transparent;
}
.bg-gradient-to-br { background-image: linear-gradient(to bottom right, var(--tw-gradient-from), var(--tw-gradient-to)); }
.bg-gradient-to-r  { background-image: linear-gradient(to right,        var(--tw-gradient-from), var(--tw-gradient-to)); }
.from-indigo-500 { --tw-gradient-from: rgb(99,  102, 241); }
.from-indigo-600 { --tw-gradient-from: rgb(79,  70,  229); }
.to-purple-600   { --tw-gradient-to:   rgb(147, 51,  234); }

/* Borders */
.border-b  { border-bottom-width: 1px; border-bottom-style: solid; }
.border    { border-width: 1px; border-style: solid; }
.border-2  { border-width: 2px; border-style: solid; }
.border-gray-800  { border-color: rgb(31, 41, 55); }
.border-gray-700  { border-color: rgb(55, 65, 81); }
.border-indigo-600 { border-color: rgb(79, 70, 229); }

/* Border Radius */
.rounded-2xl { border-radius: 1rem; }
.rounded-xl  { border-radius: 0.75rem; }
.rounded-lg  { border-radius: 0.5rem; }
.rounded-md  { border-radius: 0.375rem; }
.rounded-full { border-radius: 9999px; }

/* Lists */
.space-y-3 > * + * { margin-top: 0.75rem; }

/* Transitions */
.transition-all { transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1); }

/* Hover States */
.hover\:text-indigo-300:hover { color: rgb(165, 180, 252); }
.hover\:text-white:hover      { color: #ffffff; }
.hover\:bg-gray-800:hover     { background-color: rgb(31, 41, 55); }
.hover\:bg-indigo-600\/10:hover { background-color: rgba(79, 70, 229, 0.1); }
.hover\:from-indigo-500:hover { --tw-gradient-from: rgb(99, 102, 241); }
.hover\:to-purple-500:hover   { --tw-gradient-to:   rgb(168, 85, 247); }
.hover\:underline:hover       { text-decoration: underline; }

/* Custom */
.plan-popular { box-shadow: 0 0 0 2px #6366f1, 0 20px 40px rgba(99,102,241,0.15); }

/* Disabled button */
button:disabled { opacity: 0.6; cursor: not-allowed; }

/* Link/button base resets */
a { color: inherit; text-decoration: none; }
button { cursor: pointer; background: none; border: none; color: inherit; font: inherit; }

/* SVG helpers */
.fill-none { fill: none; }
.stroke-current { stroke: currentColor; }