---
import Layout from '../../../layouts/Layout.astro';
import SimpleHeader from '../../../components/SimpleHeader.astro';
---

<Layout title="Introduction - Black Canyon Tickets Documentation">
  <SimpleHeader />
  <main class="min-h-screen bg-gray-50">
    <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
      
      <!-- Breadcrumb -->
      <nav class="mb-8">
        <ol class="flex items-center space-x-2 text-sm text-gray-500">
          <li><a href="/docs" class="hover:text-blue-600">Documentation</a></li>
          <li>•</li>
          <li><a href="/docs/getting-started" class="hover:text-blue-600">Getting Started</a></li>
          <li>•</li>
          <li class="text-gray-900">Introduction</li>
        </ol>
      </nav>

      <!-- Article Header -->
      <div class="mb-12">
        <h1 class="text-4xl font-bold text-gray-900 mb-4">
          Welcome to Black Canyon Tickets
        </h1>
        <p class="text-xl text-gray-600 leading-relaxed">
          Black Canyon Tickets is a sophisticated, self-service ticketing platform built for upscale venues everywhere. Whether you're hosting intimate dance performances, elegant weddings, or exclusive galas, our platform provides the tools you need to sell tickets professionally and efficiently.
        </p>
      </div>

      <!-- Content -->
      <div class="prose prose-lg max-w-none">
        
        <h2>What Makes Us Different</h2>

        <h3>Premium Experience</h3>
        <ul>
          <li><strong>Elegant Design</strong>: Every aspect of our platform is crafted with sophistication in mind</li>
          <li><strong>White-Label Solution</strong>: Seamlessly integrate with your venue's brand</li>
          <li><strong>Mobile-First</strong>: Beautiful, responsive design that works perfectly on all devices</li>
        </ul>

        <h3>Built for Premium Events</h3>
        <ul>
          <li><strong>Upscale Focus</strong>: Understanding the unique needs of high-end venues</li>
          <li><strong>Sophisticated Events</strong>: Designed for discerning event organizers and their audiences</li>
          <li><strong>Flexible Scheduling</strong>: Handle both recurring and one-time premium events</li>
        </ul>

        <h3>Technical Excellence</h3>
        <ul>
          <li><strong>No Apps Required</strong>: Everything works through web browsers</li>
          <li><strong>Instant Setup</strong>: Get started in minutes, not days</li>
          <li><strong>Reliable Infrastructure</strong>: Built on enterprise-grade cloud services</li>
        </ul>

        <h2>Key Features</h2>

        <h3>Event Management</h3>
        <ul>
          <li>Create and customize events with rich descriptions and media</li>
          <li>Set up multiple ticket types with different pricing tiers</li>
          <li>Manage seating charts and seat assignments</li>
          <li>Real-time inventory tracking</li>
        </ul>

        <h3>Payment Processing</h3>
        <ul>
          <li>Integrated Stripe payments with Connect for automatic payouts</li>
          <li>Transparent fee structure (2.5% + $1.50 per transaction)</li>
          <li>PCI compliant and secure</li>
          <li>Automatic tax calculation and reporting</li>
        </ul>

        <h3>QR Code Ticketing</h3>
        <ul>
          <li>Secure, UUID-based QR codes prevent fraud</li>
          <li>Mobile-friendly scanning interface</li>
          <li>Real-time check-in tracking</li>
          <li>Offline capability for poor connectivity areas</li>
        </ul>

        <h3>Analytics & Reporting</h3>
        <ul>
          <li>Real-time sales dashboards</li>
          <li>Comprehensive attendee lists</li>
          <li>Financial reporting and reconciliation</li>
          <li>Export capabilities for external systems</li>
        </ul>

        <h2>Getting Started</h2>
        
        <p>Ready to transform your ticketing experience? Follow these steps:</p>
        
        <ol>
          <li><a href="/docs/getting-started/account-setup" class="text-blue-600 hover:text-blue-800">Set up your account</a> - Create your organizer profile</li>
          <li><a href="/docs/getting-started/stripe-connect" class="text-blue-600 hover:text-blue-800">Connect Stripe</a> - Enable payment processing</li>
          <li><a href="/docs/getting-started/first-event" class="text-blue-600 hover:text-blue-800">Create your first event</a> - Build your event page</li>
          <li><a href="/docs/events/publishing-events" class="text-blue-600 hover:text-blue-800">Start selling</a> - Go live and share your event</li>
        </ol>

        <h2>Support</h2>
        
        <p>Our support team is here to help you succeed:</p>
        
        <ul>
          <li><strong>Email</strong>: <a href="mailto:support@blackcanyontickets.com">support@blackcanyontickets.com</a></li>
          <li><strong>Response Time</strong>: Typically within 24 hours</li>
          <li><strong>Documentation</strong>: This comprehensive guide covers all features</li>
          <li><strong>Training</strong>: We offer personalized onboarding for larger venues</li>
        </ul>

      </div>

      <!-- Navigation -->
      <div class="mt-16 pt-8 border-t border-gray-200">
        <div class="flex justify-between">
          <a href="/docs" class="inline-flex items-center text-blue-600 hover:text-blue-800">
            ← Back to Documentation
          </a>
          <a href="/docs/getting-started/account-setup" class="inline-flex items-center text-blue-600 hover:text-blue-800">
            Account Setup →
          </a>
        </div>
      </div>

    </div>
  </main>
</Layout>

<style>
  .prose h2 {
    @apply text-2xl font-bold text-gray-900 mt-8 mb-4;
  }
  .prose h3 {
    @apply text-xl font-semibold text-gray-900 mt-6 mb-3;
  }
  .prose p {
    @apply text-gray-700 mb-4 leading-relaxed;
  }
  .prose ul {
    @apply list-disc list-inside text-gray-700 mb-4 space-y-2;
  }
  .prose ol {
    @apply list-decimal list-inside text-gray-700 mb-4 space-y-2;
  }
  .prose li {
    @apply leading-relaxed;
  }
</style>