<!DOCTYPE html>
<html lang="en">
  <head>
    <!-- Cache busting - Conservative approach -->
    <meta http-equiv="Cache-Control" content="public, max-age=3600">
    <meta http-equiv="Pragma" content="no-cache">
    
    <!-- Google tag (gtag.js) - Deferred for performance -->
    <script>
      // Defer Google Analytics loading
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      
      // Load GA script after page load
      window.addEventListener('load', function() {
        const script = document.createElement('script');
        script.async = true;
        script.src = 'https://www.googletagmanager.com/gtag/js?id=G-1ES7MGC696';
        document.head.appendChild(script);
        
        script.onload = function() {
          gtag('js', new Date());
          gtag('config', 'G-1ES7MGC696');
        };
      });
      
    </script>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    
    <!-- Preconnect hints for performance optimization - CRITICAL RESOURCES FIRST -->
    <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link rel="preconnect" href="https://sakshamhospital.com" />
    
    <!-- Secondary resources - DNS prefetch for non-critical origins -->
    <link rel="dns-prefetch" href="//www.googletagmanager.com" />
    <link rel="dns-prefetch" href="//cdn.gpteng.co" />
    <link rel="dns-prefetch" href="//mnwfmycbhwgxjglqtokt.supabase.co" />
    
    <!-- Critical LCP image preloading - HIGHEST PRIORITY -->
    <link rel="preload" as="image" href="/images/desktop/hero.webp" media="(min-width: 1024px)" type="image/webp" fetchpriority="high">
    <link rel="preload" as="image" href="/images/tablet/hero.webp" media="(min-width: 768px) and (max-width: 1023px)" type="image/webp" fetchpriority="high">
    <link rel="preload" as="image" href="/images/mobile/hero.webp" media="(max-width: 767px)" type="image/webp" fetchpriority="high">
    
    <!-- Preload critical fonts with high priority -->
    <link rel="preload" href="https://fonts.gstatic.com/s/inter/v12/UcCO3FwrK3iLTeHuS_fvQtMwCp50KnMw2boKoduKmMEVuLyfAZ9hiJ-Ek-_EeA.woff2" as="font" type="font/woff2" crossorigin fetchpriority="high">
    
    <!-- React loading monitoring -->
    <script>
      // Monitor for React loading
      const checkReactLoaded = () => {
        if (window.React && window.React.createContext) {
          console.log('React loaded successfully');
        } else {
          setTimeout(checkReactLoaded, 10);
        }
      };
      
      // Start checking after page load
      window.addEventListener('load', checkReactLoaded);
    </script>
    
    <!-- Optimized font loading with font-display: swap -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" media="print" onload="this.media='all'">
    <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap"></noscript>
    
    <title>Saksham Hospital - Best Hospital in Saharanpur</title>
    
    <!-- Favicon and App Icons - Optimized for maximum browser tab visibility -->
    <link rel="icon" type="image/x-icon" href="/favicons/favicon.ico">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicons/favicon-16x16.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicons/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="48x48" href="/favicons/android-chrome-192x192.png">
    <link rel="icon" type="image/png" sizes="64x64" href="/favicons/android-chrome-192x192.png">
    <link rel="icon" type="image/png" sizes="96x96" href="/favicons/android-chrome-192x192.png">
    <link rel="icon" type="image/png" sizes="128x128" href="/favicons/android-chrome-192x192.png">
    <link rel="apple-touch-icon" sizes="180x180" href="/favicons/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="192x192" href="/favicons/android-chrome-192x192.png">
    <link rel="icon" type="image/png" sizes="256x256" href="/favicons/android-chrome-512x512.png">
    <link rel="icon" type="image/png" sizes="512x512" href="/favicons/android-chrome-512x512.png">
    <link rel="manifest" href="/favicons/site.webmanifest">
    
    <!-- Simplified loading approach -->
    
    <!-- Critical CSS inlined for above-the-fold content - ENHANCED FOR LCP -->
    <style>
      /* CSS Variables - CRITICAL */
      :root{--background:0 0% 100%;--foreground:222.2 84% 4.9%;--primary:221.2 83.2% 53.3%;--primary-foreground:210 40% 98%;--border:214.3 31.8% 91.4%}
      
      /* Base Reset - CRITICAL */
      *,::before,::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:hsl(var(--border))}
      html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
      body{margin:0;background-color:hsl(var(--background));color:hsl(var(--foreground));line-height:inherit}
      
      /* Container - CRITICAL */
      .container{width:100%;margin-left:auto;margin-right:auto;padding-left:1rem;padding-right:1rem}
      @media (min-width:640px){.container{max-width:640px}}
      @media (min-width:768px){.container{max-width:768px}}
      @media (min-width:1024px){.container{max-width:1024px}}
      @media (min-width:1280px){.container{max-width:1280px}}
      
      /* Hero Section - LCP CRITICAL PATH */
      .hero-section{position:relative;text-align:center;padding-top:6rem;padding-bottom:4rem;overflow:hidden;height:600px;color:#fff}
      @media (min-width:768px){.hero-section{height:800px}}
      @media (min-width:1024px){.hero-section{height:100vh}}
      
      /* Hero Image - LCP ELEMENT */
      .hero-image,picture img{position:absolute;top:0;left:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:right center;object-position:right center}
      .hero-image[data-lcp="true"],.hero-image[loading="eager"]{content-visibility:auto;contain-intrinsic-size:100vw 600px;will-change:transform;transform:translateZ(0)}
      
      /* Hero Content - CRITICAL */
      .hero-content{z-index:10;position:relative;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}
      .hero-text{max-width:32rem;margin:0 auto;padding:0 1rem}
      .hero-title{font-size:2.5rem;font-weight:700;margin-bottom:1rem;line-height:1.1}
      @media (min-width:640px){.hero-title{font-size:3rem}}
      @media (min-width:768px){.hero-title{font-size:3.5rem}}
      @media (min-width:1024px){.hero-title{font-size:4.5rem}}
      .hero-subtitle{font-size:1rem;margin-bottom:1.5rem;line-height:1.6;opacity:0.95}
      @media (min-width:640px){.hero-subtitle{font-size:1.125rem}}
      @media (min-width:768px){.hero-subtitle{font-size:1.25rem}}
      @media (min-width:1024px){.hero-subtitle{font-size:1.5rem}}
      
      /* Buttons - CRITICAL */
      .btn-primary{background-color:hsl(var(--primary));color:hsl(var(--primary-foreground));padding:0.75rem 1.5rem;border-radius:0.5rem;font-weight:600;display:inline-flex;align-items:center;justify-content:center;transition:all 0.2s}
      
      /* Header - CRITICAL */
      header{position:fixed;top:0;left:0;right:0;z-index:50;transition:all 0.3s}
      
      /* Performance Optimizations */
      .lazy-load{content-visibility:auto;contain-intrinsic-size:100px 100px}
      .above-fold{will-change:transform;transform:translateZ(0)}
      [data-priority="true"]{content-visibility:auto;contain-intrinsic-size:100vw 600px}
      
      /* Loading Animation */
      .skeleton{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;animation:loading 1.5s infinite}
      @keyframes loading{0%{background-position:200% 0}100%{background-position:-200% 0}}
      
      /* Prevent FOUC */
      .hidden{display:none}
      .md\:block{display:none}
      @media (min-width:768px){.md\:block{display:block}}
    </style>
    
    <!-- Main CSS will be injected by Vite automatically -->
    
    <!-- Defer non-critical CSS loading -->
    <script>
      // Defer CSS to prevent render blocking
      (function() {
        // Mark as loading
        document.documentElement.classList.add('css-loading');
        
        // After page load, trigger CSS
        window.addEventListener('load', function() {
          document.documentElement.classList.remove('css-loading');
        });
      })();
    </script>
    
    <!-- Defer non-critical JavaScript -->
    <script>
      // Performance monitoring and optimization
      window.addEventListener('load', function() {
        // Monitor LCP performance
        if ('PerformanceObserver' in window) {
          const observer = new PerformanceObserver((list) => {
            const entries = list.getEntries();
            const lcpEntry = entries[entries.length - 1];
            if (lcpEntry) {
              console.log('LCP Element:', lcpEntry.element);
              console.log('LCP Time:', lcpEntry.startTime);
            }
          });
          observer.observe({ entryTypes: ['largest-contentful-paint'] });
        }
      });
    </script>
    
    <!-- CSS will be injected by Vite automatically -->
    <meta name="description" content="Best Multi-Speciality Hospital in Saharanpur. Saksham Hospital, established in 1999, has been a beacon of healthcare excellence in Saharanpur and surrounding regions. With over 25 years of dedicated service, we have grown from a modest healthcare facility to a state-of-the-art hospital offering comprehensive medical services. To be the leading healthcare provider in the region, recognized for excellence in patient care, medical education, and research. We envision a future where every individual has access to world-class healthcare services, delivered with compassion and cutting-edge technology. Core Medical Services:
    🫀 General Medicine & Critical Care
    Comprehensive medical care for all ages
    Experienced physicians and specialized critical care services
    💓 Cardiology
    Advanced heart care with state-of-the-art diagnostic equipment
    Complete cardiovascular treatment
    🤱 Gynaecology & Obstetrics
    Comprehensive women's health care
    Pregnancy, childbirth, and reproductive wellness services
    🫘 Urology & Nephrology
    Expert treatment for urinary tract disorders
    Kidney diseases and reproductive system conditions
    🦴 Orthopedics
    Treatment for bone, joint, and muscle conditions
    Comprehensive musculoskeletal care
    👂 ENT (Ear, Nose & Throat)
    Specialized care for ENT conditions and disorders
    Complete otolaryngology services
    ⚕️ Laparoscopic Surgery
    Minimally invasive surgical procedures
    Advanced surgical techniques for various conditions
    👶 Pediatrics
    Specialized care for children from birth through adolescence
    Complete child healthcare services
    Diagnostic & Support Services:
    🔬 Pathology
    Comprehensive laboratory testing
    Complete diagnostic services
    📸 Imaging Services
    X-ray, Ultrasound, and Echocardiography
    Advanced diagnostic imaging for accurate medical assessment" />
    <meta name="author" content="Saksham Makhija" />

    <meta property="og:title" content="Saksham Hospital - Best Hospital in Saharanpur" />
    <meta property="og:description" content="Best Multi-Speciality Hospital in Saharanpur. Saksham Hospital, established in 1999, has been a beacon of healthcare excellence in Saharanpur and surrounding regions. With over 25 years of dedicated service, we have grown from a modest healthcare facility to a state-of-the-art hospital offering comprehensive medical services. To be the leading healthcare provider in the region, recognized for excellence in patient care, medical education, and research. We envision a future where every individual has access to world-class healthcare services, delivered with compassion and cutting-edge technology." />
    <meta property="og:type" content="website" />
    <meta property="og:image" content="https://lovable.dev/opengraph-image-p98pqg.png" />

    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@lovable_dev" />
    <meta name="twitter:image" content="https://lovable.dev/opengraph-image-p98pqg.png" />
    <script type="module" crossorigin src="/assets/index-CHVw3X6S.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/react-vendor-BYG-SVZy.js">
    <link rel="modulepreload" crossorigin href="/assets/ui-vendor-DKqXgd-U.js">
    <link rel="modulepreload" crossorigin href="/assets/supabase-vendor-DIIAs9HR.js">
    <link rel="modulepreload" crossorigin href="/assets/query-vendor-BBZiCXqs.js">
    <link rel="stylesheet" crossorigin href="/assets/index-DXy-HH77.css">
  </head>

  <body>
    <div id="root"></div>
    <!-- IMPORTANT: DO NOT REMOVE THIS SCRIPT TAG OR THIS VERY COMMENT! -->
    <script src="https://cdn.gpteng.co/gptengineer.js" type="module" defer></script>
    
    <!-- Service Worker Registration - Deferred for better initial load -->
    <script>
      if ('serviceWorker' in navigator) {
        // Register service worker after page load to avoid blocking LCP
        window.addEventListener('load', () => {
          setTimeout(() => {
            navigator.serviceWorker.register('/sw.js')
              .then((registration) => {
                console.log('[SW] Registered successfully:', registration.scope);
              })
              .catch((error) => {
                console.log('[SW] Registration failed:', error);
              });
          }, 2000); // Delay by 2s to prioritize page load
        });
      }
    </script>
  </body>
</html>
