<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover, user-scalable=yes, maximum-scale=5.0, minimum-scale=0.25" />
    <meta http-equiv="Cache-Control" content="public, max-age=3600" />
    <meta name="theme-color" content="#000000" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="apple-touch-fullscreen" content="yes" />
    <title>Cellcrypt | Quantum‑Safe Secure Communications</title>
    
    <meta name="author" content="Cellcrypt" />

    <!-- Favicon -->
    <link rel="icon" type="image/png" href="/favicon copy.png" sizes="32x32">
    <link rel="apple-touch-icon" href="/favicon copy.png">
    <link rel="icon" href="/favicon copy.png" type="image/png">
    
    <!-- Critical Resource Hints for Performance - Optimized for FCP -->
    <link rel="dns-prefetch" href="//www.cellcrypt.com">
    <!-- Asset preloads will be added by Vite during build -->
    
    <!-- Optimized font loading for FCP - Google Fonts with preconnect and font-display:swap -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

    <!-- Async CSS with font-display:swap - fastest approach -->
    <link rel="preload" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700&display=swap"></noscript>

    
    <!-- COMPREHENSIVE Critical CSS - Dramatically expanded to reduce main CSS bundle impact -->
    <style>
      /* Core design system variables - CRITICAL for consistent theming */
      :root{
        --background:0 0% 0%;--foreground:0 0% 100%;--primary:208 100% 40%;--primary-foreground:0 0% 100%;
        --secondary:0 0% 15%;--secondary-foreground:0 0% 95%;--muted:0 0% 15%;--muted-foreground:0 0% 65%;
        --accent:208 100% 40%;--accent-foreground:0 0% 100%;--primary-orange:22 85% 49%;--primary-orange-foreground:0 0% 100%;
        --border:0 0% 25%;--input:0 0% 15%;--ring:208 100% 40%;--card:0 0% 10%;--card-foreground:0 0% 95%;
        --popover:0 0% 10%;--popover-foreground:0 0% 95%;--destructive:0 84.2% 60.2%;--destructive-foreground:0 0% 100%;
        --gradient-primary:linear-gradient(135deg,hsl(208 100% 40%),hsl(208 100% 50%));
        --gradient-orange:linear-gradient(135deg,hsl(22 85% 49%),hsl(22 85% 55%));
        --gradient-subtle:linear-gradient(180deg,hsl(0 0% 0%),hsl(0 0% 5%));
        --shadow-orange:0 10px 15px -3px hsl(22 85% 49%/0.25),0 4px 6px -2px hsl(22 85% 49%/0.15);
        --transition-smooth:all 0.4s cubic-bezier(0.25,0.46,0.45,0.94);--radius:12px;
      }
      
      /* Base reset and core styles */
      *,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:hsl(var(--border))}
      html,body{margin:0;padding:0;height:100%}
      body{
        background-color:hsl(var(--background));color:hsl(var(--foreground));
        font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;
        line-height:1.6;letter-spacing:-0.01em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
        font-display:swap;
      }
      
      /* Typography hierarchy - CRITICAL for above-the-fold */
      h1,h2,h3,h4,h5,h6{
        font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-weight:500;letter-spacing:-0.02em;
      }

      /* Critical above-the-fold layout styles */
      .hero-section{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;z-index:1}
      .header{backdrop-filter:blur(10px);background:rgba(38,38,38,0.7);border-bottom:1px solid rgba(64,64,64,1);position:sticky;top:0;z-index:30}
      .max-w-7xl{max-width:80rem}
      .mx-auto{margin-left:auto;margin-right:auto}
      .flex{display:flex}
      .items-center{align-items:center}
      .justify-between{justify-content:space-between}
      .px-6{padding-left:1.5rem;padding-right:1.5rem}
      .py-4{padding-top:1rem;padding-bottom:1rem}

      /* Continue typography styles */
      h1,h2,h3,h4,h5,h6{margin:0;line-height:1.2;color:hsl(var(--foreground))}
      h1{font-size:2.5rem;font-weight:700;line-height:1.1}
      h2{font-size:2rem;font-weight:600}
      h3{font-size:1.5rem;font-weight:600}
      p{margin:0 0 1rem;line-height:1.6;color:hsl(var(--foreground)/0.9)}
      
      /* Header space reservation - CRITICAL to prevent CLS */
      #header-placeholder{height:72px;width:100%;background:transparent;position:relative;z-index:-1}
      @media(min-width:768px){#header-placeholder{height:80px}}

      /* Header and Navigation - CRITICAL above-the-fold */
      header{position:fixed;top:0;width:100%;z-index:50;background:hsl(var(--background)/0.95);backdrop-filter:blur(10px);border-bottom:1px solid hsl(var(--border))}
      nav{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.5rem;max-width:80rem;margin:0 auto}
      .logo{font-weight:700;font-size:1.5rem;color:hsl(var(--foreground));font-family:'Plus Jakarta Sans',Inter,sans-serif}
      .nav-links{display:none;gap:2rem}@media(min-width:768px){.nav-links{display:flex}}
      .nav-link{color:hsl(var(--foreground)/0.8);text-decoration:none;padding:0.5rem 1rem;border-radius:0.5rem;transition:color 0.2s;font-weight:500}
      .nav-link:hover{color:hsl(var(--foreground))}
      
      /* Hero Section - CRITICAL above-the-fold */
      .hero-section{position:relative;min-height:100vh;margin-top:0;display:flex;align-items:center;overflow:hidden;isolation:isolate}
      .hero-bg{position:absolute;inset:0;height:100%;width:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}
      .hero-bg img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;display:block;transition:none;opacity:1;position:absolute;top:0;left:0}
      .hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom right,rgba(9,9,11,0.7),rgba(24,24,27,0.7),rgba(0,0,0,0.7))}
      .hero-content{position:relative;z-index:10;margin:0 auto;width:100%;max-width:72rem;padding:3rem 1.5rem;flex:1;display:flex;align-items:center}
      .hero-grid{display:grid;gap:3rem;align-items:center;width:100%}
      .hero-title{font-size:2.5rem;font-weight:700;line-height:1.1;letter-spacing:-0.025em;color:white;margin:0}
      
      /* Buttons - CRITICAL for CTA above-the-fold */
      .btn-primary-orange{display:inline-flex;items-center:center;justify-content:center;gap:0.5rem;padding:1rem 2rem;border-radius:0.75rem;font-weight:600;background:var(--gradient-orange);color:hsl(var(--primary-orange-foreground));text-decoration:none;border:none;cursor:pointer;transition:all 0.3s;box-shadow:var(--shadow-orange);font-size:1rem}
      .btn-primary-orange:hover{transform:translateY(-1px);box-shadow:0 20px 25px -5px hsl(22 85% 49%/0.4),0 10px 10px -5px hsl(22 85% 49%/0.2)}
      .btn-primary{background:hsl(var(--primary));color:hsl(var(--primary-foreground));font-weight:500;padding:0.75rem 1.5rem;border-radius:0.75rem;transition:all 0.3s;display:inline-flex;align-items:center;gap:0.5rem;text-decoration:none;border:none;cursor:pointer}
      .btn-primary:hover{background:hsl(var(--primary)/0.9);transform:translateY(-1px)}
      
      /* Utility classes - CRITICAL for layout */
      .w-full{width:100%}.h-full{height:100%}.object-cover{-o-object-fit:cover;object-fit:cover}.object-center{-o-object-position:center;object-position:center}
      .relative{position:relative}.absolute{position:absolute}.inset-0{top:0;right:0;bottom:0;left:0}.z-10{z-index:10}
      .flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}
      .mx-auto{margin-left:auto;margin-right:auto}.max-w-6xl{max-width:72rem}.max-w-4xl{max-width:56rem}.max-w-xl{max-width:36rem}
      .space-y-8>*+*{margin-top:2rem}.space-y-6>*+*{margin-top:1.5rem}.space-y-4>*+*{margin-top:1rem}
      .text-center{text-align:center}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}
      .text-3xl{font-size:1.875rem}.text-4xl{font-size:2.25rem}.text-5xl{font-size:3rem}
      .font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}
      .hidden{display:none}.block{display:block}.inline-flex{display:inline-flex}
      .py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}
      .py-8{padding-top:2rem;padding-bottom:2rem}.py-12{padding-top:3rem;padding-bottom:3rem}
      .px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}
      .px-8{padding-left:2rem;padding-right:2rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}
      .mb-8{margin-bottom:2rem}.mb-12{margin-bottom:3rem}.mt-8{margin-top:2rem}.mt-12{margin-top:3rem}
      .rounded{border-radius:0.25rem}.rounded-lg{border-radius:0.5rem}.rounded-xl{border-radius:0.75rem}
      .rounded-2xl{border-radius:1rem}.border{border-width:1px}.border-t{border-top-width:1px}
      .shadow-lg{box-shadow:0 10px 15px -3px rgba(0,0,0,0.1),0 4px 6px -2px rgba(0,0,0,0.05)}
      .opacity-0{opacity:0}.opacity-100{opacity:1}.transition-all{transition:all 0.3s}
      .hover\\:scale-105:hover{transform:scale(1.05)}.hover\\:scale-110:hover{transform:scale(1.1)}
      
      /* Text and color utilities */
      .text-white{color:#fff}.text-gray-300{color:#d1d5db}.text-blue-500{color:#3b82f6}
      .text-gradient{background:linear-gradient(135deg,hsl(var(--foreground)),hsl(220 100% 70%));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
      .bg-primary{background-color:hsl(var(--primary))}.bg-secondary{background-color:hsl(var(--secondary))}
      .bg-card{background-color:hsl(var(--card))}.text-foreground{color:hsl(var(--foreground))}
      .text-muted-foreground{color:hsl(var(--muted-foreground))}.border-border{border-color:hsl(var(--border))}
      
      /* Container and section utilities */
      .container-modern{max-width:72rem;margin:0 auto;padding-left:1.5rem;padding-right:1.5rem}
      .section-padding{padding-top:5rem;padding-bottom:5rem}
      @media(min-width:1024px){.container-modern{padding-left:2rem;padding-right:2rem}.section-padding{padding-top:8rem;padding-bottom:8rem}}
      
      /* Responsive breakpoints */
      @media(min-width:640px){
        .sm\\:text-5xl{font-size:3rem}.sm\\:text-xl{font-size:1.25rem}.hero-title{font-size:3rem}.sm\\:block{display:block}
        .sm\\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\\:py-8{padding-top:2rem;padding-bottom:2rem}
      }
      @media(min-width:768px){
        .md\\:text-5xl{font-size:3rem}.md\\:text-6xl{font-size:3.75rem}.md\\:block{display:block}.md\\:flex{display:flex}
        .md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\\:px-8{padding-left:2rem;padding-right:2rem}
      }
      @media(min-width:1024px){
        .lg\\:text-6xl{font-size:3.75rem}.lg\\:text-7xl{font-size:4.5rem}.lg\\:block{display:block}
        .hero-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-title{font-size:3.75rem}
        .lg\\:py-28{padding-top:7rem;padding-bottom:7rem}.lg\\:py-32{padding-top:8rem;padding-bottom:8rem}
      }
      
      /* Performance critical animations */
      @keyframes fadeIn{from{opacity:0}to{opacity:1}}
      @keyframes slideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
      @keyframes fadeInContent{from{opacity:0}to{opacity:1}}
      .animate-fade-in{animation:fadeIn 0.6s ease-out}.animate-slide-up{animation:slideUp 0.8s ease-out}
      
      /* Hero section critical styles - ESSENTIAL for LCP */
      .hero-section{position:relative;isolation:isolate;display:flex;width:100%;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;margin-top:-72px;padding-top:72px}
      .hero-bg{position:absolute;inset:0;height:100%;width:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:50% 35%;object-position:50% 35%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:-10}
      .hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom right,rgba(9,9,11,0.7),rgba(39,39,42,0.7),rgba(0,0,0,0.7))}
      @media (min-width:768px){.hero-section{margin-top:-80px;padding-top:80px}}

      /* Critical LCP image - render immediately without JavaScript */
      #lcp-hero-container{position:fixed!important;top:0!important;left:0!important;width:100vw!important;height:100vh!important;z-index:-1!important}
      #lcp-hero-bg{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;-o-object-fit:cover!important;object-fit:cover!important;-o-object-position:50% 35%!important;object-position:50% 35%!important}

      /* Root container optimized for immediate display */
      #root{position:relative;z-index:1;min-height:100vh}
    </style>
    
    

    <!-- Modulepreload removed - causing data URI issues in production -->
    
    <!-- Google Fonts now loaded asynchronously above -->

    <!-- Base meta tags for crawlers and no-JS environments (overridden by React Helmet at runtime) -->
    <meta property="og:type" content="website">
    <meta property="og:title" content="Cellcrypt: Quantum-Safe Secure Communications">
    
    <meta property="og:image" content="/lovable-uploads/125117f6-df1e-4f22-823c-73495c4e1156.png">
    <meta property="og:url" content="/">
    <meta property="og:site_name" content="Cellcrypt">
    <meta property="og:locale" content="en_US">

    <!-- Twitter Card metadata -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Cellcrypt: Quantum-Safe Secure Communications">

    <meta name="twitter:image" content="/lovable-uploads/125117f6-df1e-4f22-823c-73495c4e1156.png">



    <script type="module" crossorigin src="/assets/main-BGuz-PZd.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/vendor-react-core-CVCUkPJT.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-react-dom-DBxTRp9e.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-ui-CqLAjbHv.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-router-DJ1H4BEc.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-helmet-D8inTbPX.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-lucide-CgA47lJ0.js">
    <link rel="modulepreload" crossorigin href="/assets/vendor-i18n-CuwDiBXW.js">
    <link rel="preload" as="style" href="/assets/main-2qFd_5iN.css" onload="this.onload=null;this.rel='stylesheet'" crossorigin><noscript><link rel="stylesheet" href="/assets/main-2qFd_5iN.css" crossorigin></noscript>
  </head>

  <body>

    <div id="root"></div>

    <!-- DebugBear Real User Monitoring for performance tracking -->
    <script>(function(){var dbpr=100;if(Math.random()*100>100-dbpr){var d="dbbRum",w=window,o=document,a=addEventListener,scr=o.createElement("script");scr.async=!0;w[d]=w[d]||[];w[d].push(["presampling",dbpr]);["error","unhandledrejection"].forEach(function(t){a(t,function(e){w[d].push([t,e])});});scr.src="https://cdn.debugbear.com/qZGqAIp4Vkp6.js";o.head.appendChild(scr);}})()</script>

    <!-- Safari-specific error handling for structured data -->
    <script>
      // Safari error handler for @context undefined errors
      window.addEventListener('error', function(e) {
        if (e.message && e.message.includes('@context') && e.message.includes('undefined')) {
          e.preventDefault();
          return true;
        }
      });

      // Also handle unhandled promise rejections
      window.addEventListener('unhandledrejection', function(e) {
        if (e.reason && e.reason.message && e.reason.message.includes('@context')) {
          e.preventDefault();
        }
      });
    </script>

    <noscript>
      <main>
        <p>Cellcrypt: Quantum-Safe Secure Communications</p>
        <p>Enterprise-grade secure communications trusted by governments worldwide. Quantum-safe encryption protects sensitive calls, messages and files against emerging cyber threats.</p>
      </main>
    </noscript>

    <!-- Prioritize critical resources -->
    
  
<script async id="netlify-rum-container" src="/.netlify/scripts/rum" data-netlify-rum-site-id="e8a8a21f-2a3f-440a-b170-da637bfba753" data-netlify-deploy-branch="main" data-netlify-deploy-context="production" data-netlify-cwv-token="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzaXRlX2lkIjoiZThhOGEyMWYtMmEzZi00NDBhLWIxNzAtZGE2MzdiZmJhNzUzIiwiYWNjb3VudF9pZCI6IjY4ODY5MzllZTk3MDYwODI0MDNmMmRmOSIsImRlcGxveV9pZCI6IjY4ZGE0M2YzNmI1ZDAwMDAwODQ3NjIyNiIsImlzc3VlciI6Im5mc2VydmVyIn0.9e0EiDsfvvFdIhef2qwtNeDeFYIJzuXNWPciAcbg5nY"></script></body>
</html>
