<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <!-- Favicon v7 — uses new HALYO brand PNG icon -->
    <link rel="icon" type="image/png" sizes="512x512" href="/halyo-logo.png?v=7" />
    <link rel="icon" type="image/png" sizes="192x192" href="/halyo-logo.png?v=7" />
    <link rel="icon" type="image/png" sizes="96x96"   href="/halyo-logo.png?v=7" />
    <link rel="icon" type="image/png"                 href="/halyo-logo.png?v=7" />
    <link rel="apple-touch-icon" sizes="180x180" href="/halyo-logo.png?v=7" />
    <link rel="apple-touch-icon" sizes="152x152" href="/halyo-logo.png?v=7" />
    <link rel="apple-touch-icon" sizes="144x144" href="/halyo-logo.png?v=7" />
    <link rel="apple-touch-icon" sizes="120x120" href="/halyo-logo.png?v=7" />
    <link rel="apple-touch-icon"                 href="/halyo-logo.png?v=7" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=5.0, user-scalable=yes, viewport-fit=cover" />
    <meta name="theme-color" content="#e00000" />

    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="apple-mobile-web-app-title" content="HALYO" />
    <meta name="mobile-web-app-capable" content="yes" />
    <meta name="application-name" content="HALYO" />
    <meta name="msapplication-TileColor" content="#e00000" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta name="msapplication-TileImage" content="/halyo-logo.png?v=7" />

    <title>HALYO - India's Trusted Wedding Marketplace | Venues &amp; Vendors</title>
    <meta name="description" content="Find perfect wedding venues, photographers, caterers &amp; decorators. Book kalyana mandapams, party halls, resorts for your special day. India's trusted wedding marketplace." />
    <meta name="keywords" content="wedding venues, kalyana mandapam, Telugu wedding, Andhra Pradesh, Telangana, wedding vendors, photographers, catering" />
    <meta name="robots" content="index, follow" />
    <link rel="canonical" href="https://halyo.in/" />

    <meta property="og:title" content="HALYO - India's Trusted Wedding Marketplace" />
    <meta property="og:description" content="India's trusted wedding venue and services marketplace. Find venues, photographers, caterers &amp; more in Andhra Pradesh and Telangana." />
    <meta property="og:image" content="https://images.pexels.com/photos/1444442/pexels-photo-1444442.jpeg?auto=compress&cs=tinysrgb&w=1200" />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:image:alt" content="HALYO - India's Trusted Wedding Marketplace" />
    <meta property="og:type" content="website" />
    <meta property="og:site_name" content="HALYO" />
    <meta property="og:url" content="https://halyo.in/" />
    <meta property="og:locale" content="en_IN" />

    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:site" content="@halyo_in" />
    <meta name="twitter:title" content="HALYO - India's Trusted Wedding Marketplace" />
    <meta name="twitter:description" content="India's trusted wedding venue and services marketplace in Andhra Pradesh and Telangana" />
    <meta name="twitter:image" content="https://images.pexels.com/photos/1444442/pexels-photo-1444442.jpeg?auto=compress&cs=tinysrgb&w=1200" />
    <meta name="twitter:image:alt" content="HALYO - Wedding Marketplace" />

    <link rel="manifest" href="/manifest.json?v=8" />
    <link rel="apple-touch-startup-image" href="/halyo-logo.png?v=7" />

    <!-- Structured data -->
    <script type="application/ld+json">
    {"@context":"https://schema.org","@type":"Organization","name":"HALYO","url":"https://halyo.in","logo":"https://halyo.in/halyo-logo.png","contactPoint":{"@type":"ContactPoint","telephone":"+91-7997009097","contactType":"customer service","areaServed":"IN","availableLanguage":["English","Telugu"]}}
    </script>
    <script type="application/ld+json">
    {"@context":"https://schema.org","@type":"WebSite","name":"HALYO","url":"https://halyo.in","description":"India's trusted wedding marketplace for venues, photographers, caterers and more","potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://halyo.in/venues?city={search_term_string}"},"query-input":"required name=search_term_string"}}
    </script>

    <!--
      Critical inline CSS — paints the loading shell instantly before any JS executes.
      Eliminates the "blank white flash" that drives up FCP on mobile.
      Covers: body bg, navbar placeholder, hero image container, skeleton shimmer.
    -->
    <style>
      *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
      html{height:100%;-webkit-text-size-adjust:100%}
      body{
        min-height:100dvh;
        background:#030712;
        font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
        -webkit-font-smoothing:antialiased;
        overflow-x:hidden
      }
      #root{min-height:100dvh;background:#fff}

      /* ── Branded splash screen ──────────────────────────────────────── */
      /* Shown immediately while JS loads; faded out after React renders  */
      #app-splash{
        position:fixed;inset:0;z-index:9999;
        display:flex;flex-direction:column;align-items:center;justify-content:center;
        background:#030712;
        gap:0;
        will-change:opacity;
        transition:opacity 0.35s ease
      }
      #app-splash.spl-out{opacity:0;pointer-events:none}

      /* Icon container — matches HALYO logo: red-to-crimson gradient rounded square */
      #spl-icon{
        width:88px;height:88px;
        background:linear-gradient(150deg,#f23054 0%,#d01030 55%,#b80f2c 100%);
        border-radius:24px;
        display:flex;align-items:center;justify-content:center;
        box-shadow:0 6px 32px rgba(210,16,44,0.55),0 2px 8px rgba(0,0,0,0.25);
        margin-bottom:22px;
        flex-shrink:0
      }
      /* Brand name — amber HAL, red YO exactly like the logo */
      #spl-brand{
        font-size:2.75rem;font-weight:900;
        letter-spacing:-0.02em;line-height:1
      }
      #spl-hal{color:#f59e0b}
      #spl-yo {color:#e11d48}
      /* Tagline — gray, spaced, matches logo */
      #spl-tag{
        font-size:0.6rem;font-weight:700;
        letter-spacing:0.3em;text-transform:uppercase;
        color:#6b7280;margin-top:6px
      }
      /* Loading dots */
      #spl-dots{display:flex;gap:7px;margin-top:28px}
      .sdot{
        width:7px;height:7px;
        background:#e11d48;border-radius:50%;
        animation:_sdot 1.4s ease-in-out infinite
      }
      .sdot:nth-child(2){animation-delay:.22s}
      .sdot:nth-child(3){animation-delay:.44s}
      @keyframes _sdot{
        0%,60%,100%{transform:scale(0.5);opacity:0.25}
        30%{transform:scale(1.1);opacity:1}
      }

      /* Shimmer skeleton for below-hero content */
      @keyframes _shimmer{
        0%{background-position:-200% center}
        100%{background-position:200% center}
      }
      .skel{
        border-radius:0.75rem;
        background:linear-gradient(90deg,#f1f5f9 25%,#e2e8f0 50%,#f1f5f9 75%);
        background-size:200% auto;
        animation:_shimmer 1.4s ease-in-out infinite
      }
    </style>

    <!--
      Resource hints — ordered by priority:
      1. preconnect for fonts + Supabase API (3 origins max per Lighthouse guidance)
      2. dns-prefetch for Pexels (the LCP preload below establishes the connection)
      3. preload for LCP hero image (must resolve before React boots)
      4. Non-blocking font load
    -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link rel="preconnect" href="https://wvkxtebpkxcwvsmrprpz.supabase.co" crossorigin />
    <link rel="dns-prefetch" href="https://images.pexels.com" />
    <link rel="dns-prefetch" href="https://wa.me" />

    <!--
      Preload LCP hero image.
      imagesizes uses responsive breakpoints so mobile (390px) fetches 640w,
      tablet fetches 1200w, desktop fetches 1920w.
      fetchpriority=high tells the browser to fetch this before parser-discovered resources.
    -->
    <link rel="preload" as="image"
      href="https://images.pexels.com/photos/16151770/pexels-photo-16151770.jpeg?auto=compress&cs=tinysrgb&fm=webp&w=640"
      imagesrcset="https://images.pexels.com/photos/16151770/pexels-photo-16151770.jpeg?auto=compress&cs=tinysrgb&fm=webp&w=640 640w, https://images.pexels.com/photos/16151770/pexels-photo-16151770.jpeg?auto=compress&cs=tinysrgb&fm=webp&w=1200 1200w, https://images.pexels.com/photos/16151770/pexels-photo-16151770.jpeg?auto=compress&cs=tinysrgb&fm=webp&w=1920 1920w"
      imagesizes="(max-width: 640px) 640px, (max-width: 1200px) 1200px, 1920px"
      fetchpriority="high" />

    <!--
      Fonts: display=swap so body text renders in system font immediately,
      then swaps to Inter/Playfair once loaded. Prevents invisible text (FOIT).
      display=optional was causing fonts to never load on slow connections.
    -->
    <link rel="preload" href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;800&family=Inter:wght@400;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=Playfair+Display:wght@700;800&family=Inter:wght@400;500;600;700&display=swap" /></noscript>
    <!--
      Prefetch high-traffic Vendors page chunk so navigation feels instant.
      The actual hash is injected by Vite at build time; this hint works on
      first-visit because the browser will cache-miss gracefully.
    -->

    <!-- Service Worker — deferred to after load to not block parse -->
    <script>
      if ('serviceWorker' in navigator) {
        window.addEventListener('load', function() {
          navigator.serviceWorker.register('/sw.js?v=4.7', { scope: '/', updateViaCache: 'none' })
            .then(function(reg) {
              reg.addEventListener('updatefound', function() {
                var w = reg.installing;
                if (!w) return;
                w.addEventListener('statechange', function() {
                  if (w.state === 'installed' && navigator.serviceWorker.controller) {
                    w.postMessage({ type: 'SKIP_WAITING' });
                  }
                });
              });
            });
          var refreshing = false;
          navigator.serviceWorker.addEventListener('controllerchange', function() {
            if (!refreshing) { refreshing = true; window.location.reload(); }
          });
        });
      }
    </script>
    <script type="module" crossorigin src="/assets/index-DtHmQR4w.js"></script>
    <link rel="modulepreload" crossorigin href="/assets/react-core-c0Mdgnio.js">
    <link rel="modulepreload" crossorigin href="/assets/supabase-Bq3leFbq.js">
    <link rel="modulepreload" crossorigin href="/assets/router-C0Fdosl2.js">
    <link rel="modulepreload" crossorigin href="/assets/icons-CQ3dEDTi.js">
    <link rel="modulepreload" crossorigin href="/assets/admin-CwtGG0R2.js">
    <link rel="modulepreload" crossorigin href="/assets/dashboard-9m6bqDrH.js">
    <link rel="modulepreload" crossorigin href="/assets/blog-DzFCAGlU.js">
    <link rel="preload" as="style" href="/assets/index-Bt_5-9z8.css" onload="this.onload=null;this.rel='stylesheet'"><noscript><link rel="stylesheet" href="/assets/index-Bt_5-9z8.css"></noscript>
  <script async src="https://bolt.new/badge.js?s=eff865d5-e9d8-405c-8703-9e89c7bb45d9"></script></head>
  <body>
    <!-- React app mounts here -->
    <div id="root"></div>

    <!--
      Branded splash screen — position:fixed overlay above #root.
      Shown instantly before any JS executes.
      Faded out by main.tsx after React has painted its first frame.
    -->
    <div id="app-splash" role="status" aria-label="Loading HALYO">
      <div id="spl-icon" aria-hidden="true">
        <!--
          Exact HALYO logo icon reproduced as inline SVG:
          • Tall center building (outline rect) with 4 horizontal floor bars (filled)
          • Two shorter wing buildings flanking the center (outline rects)
          All white on the red gradient square — zero network request, instant render.
        -->
        <svg width="48" height="48" viewBox="0 0 52 52" fill="none" xmlns="http://www.w3.org/2000/svg">
          <!-- Left wing building -->
          <rect x="4" y="19" width="13" height="24" rx="2.5" stroke="white" stroke-width="2.6"/>
          <!-- Right wing building -->
          <rect x="35" y="19" width="13" height="24" rx="2.5" stroke="white" stroke-width="2.6"/>
          <!-- Center tall building (outline) -->
          <rect x="15" y="7" width="22" height="36" rx="3" stroke="white" stroke-width="2.6"/>
          <!-- Floor bars inside center building -->
          <rect x="20" y="15" width="12" height="2.8" rx="1.4" fill="white"/>
          <rect x="20" y="21" width="12" height="2.8" rx="1.4" fill="white"/>
          <rect x="20" y="27" width="12" height="2.8" rx="1.4" fill="white"/>
          <rect x="20" y="33" width="12" height="2.8" rx="1.4" fill="white"/>
        </svg>
      </div>
      <div id="spl-brand" aria-hidden="true">
        <span id="spl-hal">HAL</span><span id="spl-yo">YO</span>
      </div>
      <p id="spl-tag" aria-hidden="true">Celebrations Begin</p>
      <div id="spl-dots" aria-hidden="true">
        <div class="sdot"></div>
        <div class="sdot"></div>
        <div class="sdot"></div>
      </div>
    </div>

  </body>
</html>
