import { PublicLayout } from '@/components/layout/public-layout'
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
import { Shield, Lock, Eye, CheckCircle } from 'lucide-react'

export default function SecurityPage() {
  return (
    <PublicLayout>
      <div className="min-h-screen bg-studio-black py-24 px-4">
        <div className="mx-auto max-w-4xl">
          <h1 className="mb-8 text-4xl font-bold text-white">Security</h1>
          
          <div className="space-y-8">
            <Card>
              <CardHeader>
                <div className="flex items-center gap-3">
                  <Shield className="h-8 w-8 text-phoenix-fire" />
                  <CardTitle className="text-white">Enterprise-Grade Security</CardTitle>
                </div>
              </CardHeader>
              <CardContent>
                <p className="text-gray-300 mb-4">
                  Sankofa Phoenix is built with security as a foundational principle. Our infrastructure 
                  implements defense-in-depth strategies, zero-trust networking, and comprehensive 
                  security monitoring.
                </p>
                <ul className="space-y-2 text-gray-300">
                  <li className="flex items-start gap-2">
                    <CheckCircle className="h-5 w-5 text-green-400 mt-0.5" />
                    <span>SOC 2 Type II certified</span>
                  </li>
                  <li className="flex items-start gap-2">
                    <CheckCircle className="h-5 w-5 text-green-400 mt-0.5" />
                    <span>ISO 27001 compliant</span>
                  </li>
                  <li className="flex items-start gap-2">
                    <CheckCircle className="h-5 w-5 text-green-400 mt-0.5" />
                    <span>Zero Trust architecture</span>
                  </li>
                  <li className="flex items-start gap-2">
                    <CheckCircle className="h-5 w-5 text-green-400 mt-0.5" />
                    <span>End-to-end encryption</span>
                  </li>
                </ul>
              </CardContent>
            </Card>

            <Card>
              <CardHeader>
                <div className="flex items-center gap-3">
                  <Lock className="h-8 w-8 text-sankofa-gold" />
                  <CardTitle className="text-white">Data Protection</CardTitle>
                </div>
              </CardHeader>
              <CardContent>
                <p className="text-gray-300 mb-4">
                  All data is encrypted at rest and in transit using industry-standard encryption 
                  algorithms. We implement comprehensive access controls and audit logging.
                </p>
              </CardContent>
            </Card>

            <Card>
              <CardHeader>
                <div className="flex items-center gap-3">
                  <Eye className="h-8 w-8 text-neon-cyan" />
                  <CardTitle className="text-white">Security Monitoring</CardTitle>
                </div>
              </CardHeader>
              <CardContent>
                <p className="text-gray-300 mb-4">
                  Continuous security monitoring, threat detection, and incident response capabilities 
                  ensure rapid detection and mitigation of security threats.
                </p>
              </CardContent>
            </Card>
          </div>
        </div>
      </div>
    </PublicLayout>
  )
}

