:root {
  --slate-900: #0f172a;
  --slate-800: #1e293b;
  --slate-700: #334155;
  --slate-400: #94a3b8;
  --slate-300: #cbd5e1;
  --blue-500: #3b82f6;
  --blue-400: #60a5fa;
  --indigo-400: #818cf8;
  --green-400: #4ade80;
  --brand: #7777ff;
  --brand-600: #6666ee;
  --white: #ffffff;
}

main { display: block; }

/* Spacing */
main .pt-16 { padding-top: 4rem; }
main .pt-32 { padding-top: 8rem; }
main .pb-16 { padding-bottom: 4rem; }
main .py-24 { padding-top: 6rem; padding-bottom: 6rem; }
main .px-4 { padding-left: 1rem; padding-right: 1rem; }
main .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 640px) {
  main .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
}
main .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
@media (min-width: 1024px) {
  main .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
}
main .mb-6 { margin-bottom: 1.5rem; }
main .mb-8 { margin-bottom: 2rem; }
main .mb-12 { margin-bottom: 3rem; }
main .p-4 { padding: 1rem; }
main .p-6 { padding: 1.5rem; }
main .p-8 { padding: 2rem; }
main .px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
main .py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
main .py-4 { padding-top: 1rem; padding-bottom: 1rem; }

/* Layout */
main .min-h-screen { min-height: 100vh; }
main .relative { position: relative; }
main .absolute { position: absolute; }
main .inset-0 { top:0; right:0; bottom:0; left:0; }
main .top-20 { top: 5rem; }
main .right-20 { right: 5rem; }
main .bottom-20 { bottom: 5rem; }
main .left-20 { left: 5rem; }
main .w-80 { width: 20rem; }
main .h-80 { height: 20rem; }
main .w-96 { width: 24rem; }
main .h-96 { height: 24rem; }
main .w-full { width: 100%; }
main .h-10 { height: 2.5rem; }
main .rounded-full { border-radius: 9999px; }
main .rounded-2xl { border-radius: 1rem; }
main .rounded-xl { border-radius: 0.75rem; }
main .rounded-md { border-radius: 0.375rem; }
main .overflow-hidden { overflow: hidden; }
main .z-10 { z-index: 10; }

/* Typography */
main .text-center { text-align: center; }
main .text-white { color: var(--white); }
main .text-slate-300 { color: var(--slate-300); }
main .text-slate-400 { color: var(--slate-400); }
main .text-blue-400 { color: var(--blue-400); }
main .text-indigo-400 { color: var(--indigo-400); }
main .text-\[\#7777ff\], main [class*="text-[#7777ff]"] { color: var(--brand); }
main .font-bold { font-weight: 700; }
main .font-medium { font-weight: 500; }
main .text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
main .text-xl { font-size: 1.25rem; line-height: 1.75rem; }
main .text-2xl { font-size: 1.5rem; line-height: 2rem; }
main .text-lg { font-size: 1.125rem; line-height: 1.75rem; }
main .text-xs { font-size: 0.75rem; line-height: 1rem; }
main .leading-relaxed { line-height: 1.625; }
@media (min-width: 768px) {
  main .md\:text-6xl { font-size: 3.75rem; line-height: 1; }
  main .md\:text-2xl { font-size: 1.5rem; line-height: 2rem; }
}

/* Flex and spacing between children */
main .flex { display: flex; }
main .inline-flex { display: inline-flex; }
main .items-center { align-items: center; }
main .items-start { align-items: flex-start; }
main .justify-center { justify-content: center; }
main .flex-col { flex-direction: column; }
main .space-x-3 > :not([hidden]) ~ :not([hidden]) { margin-left: 0.75rem; }
main .space-x-4 > :not([hidden]) ~ :not([hidden]) { margin-left: 1rem; }
main .space-y-4 > :not([hidden]) ~ :not([hidden]) { margin-top: 1rem; }
main .space-y-6 > :not([hidden]) ~ :not([hidden]) { margin-top: 1.5rem; }
main .space-y-8 > :not([hidden]) ~ :not([hidden]) { margin-top: 2rem; }
@media (min-width: 768px) {
  main .md\:flex { display: flex; }
  main .md\:flex-row { flex-direction: row; }
  main .md\:space-y-0 > :not([hidden]) ~ :not([hidden]) { margin-top: 0; }
  main .md\:space-x-12 > :not([hidden]) ~ :not([hidden]) { margin-left: 3rem; }
}

/* Grid */
main .grid { display: grid; }
main .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
main .gap-16 { gap: 4rem; }
@media (min-width: 1024px) {
  main .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Width helpers */
main .w-4 { width: 1rem; } 
main .w-5 { width: 1.25rem; }
main .w-6 { width: 1.5rem; }
main .h-4 { height: 1rem; }
main .h-5 { height: 1.25rem; }
main .h-6 { height: 1.5rem; }
main .mr-2 { margin-right: 0.5rem; }
main .ml-2 { margin-left: 0.5rem; }

/* Container widths */
main .max-w-6xl { width: 100%; max-width: 72rem; }
main .max-w-4xl { width: 100%; max-width: 56rem; }
main .mx-auto { margin-left: auto; margin-right: auto; }

/* Forms */
main .border { border-width: 1px; border-style: solid; }
main .border-slate-700 { border-color: var(--slate-700); }
main .text-sm { font-size: 0.875rem; line-height: 1.25rem; }
main .placeholder\:text-muted-foreground::placeholder { color: var(--slate-400); }
main .bg-slate-800\/50 { background-color: rgba(30,41,59,0.5); }
main .pl-12 { padding-left: 3rem; }
main .disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }
main .disabled\:opacity-50:disabled { opacity: 0.5; }
main .resize-none { resize: none; }

/* Focus styles */
main .focus-visible\:outline-none:focus-visible { outline: none; }
main .focus-visible\:ring-2:focus-visible { box-shadow: 0 0 0 2px var(--brand); }
main .focus-visible\:ring-offset-2:focus-visible { outline-offset: 2px; }
main .focus-visible\:ring-ring:focus-visible { box-shadow: 0 0 0 2px var(--brand); }
main .focus\:border-[\#7777ff]:focus { border-color: var(--brand); }
main .focus\:ring-[\#7777ff]:focus { box-shadow: 0 0 0 2px var(--brand); }

/* Buttons and groups */
main .inline-flex.items-center.justify-center.h-10.w-full { min-height: 2.5rem; }
main .transition-colors { transition: color 0.2s ease, background-color 0.2s ease; }
main .transition-transform { transition: transform 0.2s ease; }
main .group:hover .group-hover\:translate-x-1 { transform: translateX(0.25rem); }
main .group:hover .group-hover\:scale-110 { transform: scale(1.10); }

/* Custom components */
main .glass {
  background: rgba(15, 23, 42, 0.5);
  border: 1px solid rgba(119, 119, 255, 0.2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
main .gradient-text {
  background: linear-gradient(90deg, var(--brand), var(--blue-400));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

main .hover\:bg-slate-800\/30:hover { background-color: rgba(30,41,59,0.3); }

main .glow { box-shadow: 0 0 0 0 rgba(119,119,255,0); }
main .glow:hover { box-shadow: 0 8px 30px rgba(119,119,255,0.35); }

/* Background blobs (совместимость селекторов с []) */
main .bg-\[\#7777ff\]\/10,
main [class*="bg-[#7777ff]/10"] { background-color: rgba(119,119,255,0.1); }

main .bg-blue-500\/10,
main [class*="bg-blue-500/10"] { background-color: rgba(59,130,246,0.1); }

main .blur-3xl { filter: blur(64px); }

/* Primary button colors */
main .bg-\[\#7777ff\], main [class*="bg-[#7777ff]"] { background-color: var(--brand); color: #fff; }
main .hover\:bg-\[\#6666ee\]:hover,
main [class*="hover:bg-[#6666ee]"]:hover { background-color: var(--brand-600); }

/* Safelists for class matchers */
main [class*="file:border-0"]::-webkit-file-upload-button { border: 0; }
main [class*="file:bg-transparent"]::-webkit-file-upload-button { background: transparent; }
main [class*="file:text-sm"]::-webkit-file-upload-button { font-size: 0.875rem; }
main [class*="file:font-medium"]::-webkit-file-upload-button { font-weight: 500; }
/*************************************/ 
.b-form svg{margin: 10px 0 0 10px;}
.space-y-6 h3{padding: 0; margin: 0 0 2px 0; line-height: 1.3;}
.space-y-6 p{padding: 0; margin: 0; line-height: 1.3;}
.space-y-6 p.font-medium{margin-top: 10px;}
#email-box:hover h3{color: var(--brand);}