/*
Theme Name:  Hello Kakinada
Theme URI:   https://hellokakkinada.in
Author:      Hello Kakinada
Description: Kakinada's #1 local discovery platform — exact WordPress port of the React app.
Version:     2.0.0
License:     GNU General Public License v2 or later
Text Domain: hello-kakinada
Tags:        directory, listing, local, hyper-local
*/

/* ═══════════════════════════════════════════
   FONTS
═══════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700;800&family=Noto+Sans+Telugu:wght@400;600;700&display=swap');

/* ═══════════════════════════════════════════
   DESIGN TOKENS  (matches React index.css exactly)
═══════════════════════════════════════════ */
:root {
  --background: hsl(210 40% 99%);
  --foreground: hsl(222 47% 11%);
  --card: hsl(0 0% 100%);
  --card-foreground: hsl(222 47% 11%);
  --primary: hsl(218 85% 22%);
  --primary-fg: hsl(0 0% 100%);
  --primary-glow: hsl(218 90% 45%);
  --accent: hsl(22 95% 55%);
  --accent-fg: hsl(0 0% 100%);
  --accent-glow: hsl(38 95% 60%);
  --secondary: hsl(210 40% 96%);
  --muted: hsl(210 40% 96%);
  --muted-fg: hsl(215 16% 47%);
  --border: hsl(214 32% 91%);
  --success: hsl(142 70% 42%);
  --destructive: hsl(0 84% 60%);
  --radius: 1rem;

  /* Gradients */
  --grad-hero:    linear-gradient(135deg, hsl(218 85% 22%) 0%, hsl(218 75% 32%) 45%, hsl(22 95% 55%) 100%);
  --grad-primary: linear-gradient(135deg, hsl(218 85% 22%), hsl(218 90% 45%));
  --grad-accent:  linear-gradient(135deg, hsl(22 95% 55%), hsl(38 95% 60%));
  --grad-ocean:   linear-gradient(180deg, hsl(218 85% 22%) 0%, hsl(200 80% 45%) 100%);
  --grad-glass:   linear-gradient(135deg, hsl(0 0% 100% / .7), hsl(0 0% 100% / .4));
  --grad-mesh:    radial-gradient(at 20% 20%, hsl(218 90% 45% / .15) 0px, transparent 50%),
                  radial-gradient(at 80% 0%,  hsl(22 95% 55% / .15) 0px, transparent 50%),
                  radial-gradient(at 80% 80%, hsl(38 95% 60% / .10) 0px, transparent 50%);
  /* Shadows */
  --shadow-sm:  0 1px 2px hsl(218 50% 15% / .06);
  --shadow-md:  0 4px 20px -4px hsl(218 50% 15% / .10);
  --shadow-lg:  0 20px 50px -12px hsl(218 50% 15% / .18);
  --shadow-glow: 0 10px 40px -10px hsl(218 90% 45% / .45);
  --shadow-accent-glow: 0 10px 40px -10px hsl(22 95% 55% / .50);
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --background: hsl(222 47% 6%);
    --foreground: hsl(210 40% 98%);
    --card: hsl(222 47% 9%);
    --card-foreground: hsl(210 40% 98%);
    --primary: hsl(218 90% 55%);
    --primary-glow: hsl(218 95% 65%);
    --accent: hsl(22 95% 60%);
    --accent-glow: hsl(38 95% 65%);
    --secondary: hsl(222 30% 14%);
    --muted: hsl(222 30% 14%);
    --muted-fg: hsl(215 20% 65%);
    --border: hsl(222 30% 18%);
    --grad-glass: linear-gradient(135deg, hsl(222 47% 12% / .7), hsl(222 47% 9% / .4));
    --grad-mesh:  radial-gradient(at 20% 20%, hsl(218 90% 45% / .25) 0px, transparent 50%),
                  radial-gradient(at 80% 0%,  hsl(22 95% 55% / .20) 0px, transparent 50%),
                  radial-gradient(at 80% 80%, hsl(38 95% 60% / .15) 0px, transparent 50%);
  }
}

/* ═══════════════════════════════════════════
   RESET & BASE
═══════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border-color: var(--border); }
html { scroll-behavior: smooth; }
body {
  font-family: 'Plus Jakarta Sans', 'Noto Sans Telugu', system-ui, sans-serif;
  font-feature-settings: 'cv11','ss01';
  background: var(--background);
  color: var(--foreground);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4 { font-family: 'Space Grotesk','Plus Jakarta Sans',sans-serif; letter-spacing: -0.02em; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
:lang(te) { font-family: 'Noto Sans Telugu','Plus Jakarta Sans',sans-serif; }

/* ═══════════════════════════════════════════
   ANIMATIONS  (matches tailwind.config.ts)
═══════════════════════════════════════════ */
@keyframes fade-in {
  0%   { opacity: 0; transform: translateY(12px); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes scale-in {
  0%   { opacity: 0; transform: scale(.95); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes float {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-12px); }
}
@keyframes float-slow {
  0%,100% { transform: translateY(0) rotate(0); }
  50%     { transform: translateY(-20px) rotate(3deg); }
}
@keyframes pulse-ring {
  0%   { transform: scale(.95); opacity: .6; }
  100% { transform: scale(1.6);  opacity: 0; }
}
@keyframes gradient-shift {
  0%,100% { background-position: 0% 50%; }
  50%     { background-position: 100% 50%; }
}
@keyframes shimmer {
  0%   { background-position: -1000px 0; }
  100% { background-position:  1000px 0; }
}

/* ═══════════════════════════════════════════
   UTILITY CLASSES
═══════════════════════════════════════════ */
.container { max-width: 1400px; margin: 0 auto; padding: 0 1.25rem; }
.glass { background: var(--grad-glass); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border: 1px solid hsl(0 0% 100% / .3); }
.glass-strong { background: hsl(0 0% 100% / .8); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid var(--border); }
@media (prefers-color-scheme: dark) {
  .glass-strong { background: var(--card); }
}
.gradient-text { background-clip: text; -webkit-background-clip: text; color: transparent; background-image: var(--grad-hero); }
.gradient-text-accent { background-clip: text; -webkit-background-clip: text; color: transparent; background-image: var(--grad-accent); }
.mesh-bg { background-image: var(--grad-mesh); }
.shadow-glow { box-shadow: var(--shadow-glow); }
.shadow-accent-glow { box-shadow: var(--shadow-accent-glow); }
.shadow-soft { box-shadow: var(--shadow-md); }
.shadow-elevated { box-shadow: var(--shadow-lg); }
.bg-gradient-primary { background-image: var(--grad-primary); }
.bg-gradient-accent  { background-image: var(--grad-accent);  }
.hide-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }
.hide-scrollbar::-webkit-scrollbar { display:none; }
.line-clamp-1 { overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.line-clamp-2 { overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.animate-float      { animation: float 6s ease-in-out infinite; }
.animate-float-slow { animation: float-slow 9s ease-in-out infinite; }
.animate-pulse-ring { animation: pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite; }
.animate-fade-in    { animation: fade-in .6s cubic-bezier(.16,1,.3,1) both; }

/* ═══════════════════════════════════════════
   HEADER
═══════════════════════════════════════════ */
.hk-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  height: 64px; transition: all .3s;
}
@media(min-width:1024px) { .hk-header { height: 80px; } }
.hk-header.scrolled { background: hsl(0 0% 100% / .85); backdrop-filter: blur(24px); border-bottom: 1px solid var(--border); box-shadow: var(--shadow-sm); }
@media (prefers-color-scheme: dark) { .hk-header.scrolled { background: hsl(222 47% 8% / .9); } }
.hk-header-inner { display:flex; align-items:center; justify-content:space-between; height:100%; max-width:1400px; margin:0 auto; padding:0 1.25rem; }

/* Logo */
.hk-logo { display:flex; align-items:center; gap:.625rem; }
.hk-logo-icon { position:relative; }
.hk-logo-pin {
  width:40px; height:40px; border-radius:12px;
  background-image: var(--grad-accent);
  display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-accent-glow);
}
.hk-logo-pin svg { width:20px; height:20px; color:#fff; fill:#fff; }
.hk-logo-dot {
  position:absolute; top:-2px; right:-2px; width:12px; height:12px;
  background:var(--success); border-radius:50%; border:2px solid var(--background);
}
.hk-logo-text { line-height:1; }
.hk-logo-name { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem; color:var(--foreground); }
.hk-logo-name span { color:var(--accent); }
.hk-logo-sub { font-size:.625rem; letter-spacing:.1em; font-weight:500; color:var(--muted-fg); text-transform:uppercase; }
.hk-logo-light .hk-logo-name { color:#fff; }
.hk-logo-light .hk-logo-sub  { color:hsl(0 0% 100% / .7); }

/* Nav */
.hk-nav { display:none; }
@media(min-width:1024px) {
  .hk-nav { display:flex; align-items:center; gap:.25rem; }
  .hk-nav a {
    position:relative; padding:.5rem 1rem; font-size:.875rem; font-weight:500;
    border-radius:.5rem; transition:color .2s; color:hsl(var(--foreground) / .7);
  }
  .hk-nav a:hover { color:var(--foreground); }
  .hk-nav a.active { color:var(--primary); }
  .hk-nav a.active::before {
    content:''; position:absolute; inset:0; background:hsl(218 85% 22% / .1);
    border-radius:.5rem; z-index:-1;
  }
}
.hk-header-actions { display:none; align-items:center; gap:.5rem; }
@media(min-width:1024px) { .hk-header-actions { display:flex; } }
.hk-btn-ghost {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.375rem .75rem; border-radius:.5rem; font-size:.875rem; font-weight:500;
  background:transparent; border:none; cursor:pointer; color:var(--foreground); transition:background .2s;
}
.hk-btn-ghost:hover { background:var(--muted); }
.hk-btn-primary-sm {
  display:inline-flex; align-items:center; gap:.375rem;
  padding:.5rem 1rem; border-radius:.625rem; font-size:.875rem; font-weight:600;
  background-image:var(--grad-accent); color:#fff; border:none; cursor:pointer;
  box-shadow:var(--shadow-accent-glow); transition:opacity .2s;
}
.hk-btn-primary-sm:hover { opacity:.9; }
.hk-hamburger { display:flex; flex-direction:column; gap:5px; padding:.375rem; background:none; border:none; cursor:pointer; border-radius:.5rem; }
.hk-hamburger span { width:22px; height:2px; background:var(--foreground); border-radius:2px; transition:all .3s; display:block; }
@media(min-width:1024px) { .hk-hamburger { display:none; } }

/* Mobile menu */
.hk-mobile-menu {
  position:absolute; top:100%; left:0; right:0;
  background: hsl(0 0% 100% / .9); backdrop-filter:blur(24px);
  border-top:1px solid var(--border); overflow:hidden;
  max-height:0; transition:max-height .3s ease;
}
.hk-mobile-menu.open { max-height:480px; }
.hk-mobile-menu-inner { padding:1rem 1.25rem; display:flex; flex-direction:column; gap:.25rem; }
.hk-mobile-menu a {
  padding:.75rem 1rem; border-radius:.5rem; font-size:.875rem; font-weight:500;
  color:hsl(var(--foreground) / .8); transition:background .2s;
}
.hk-mobile-menu a:hover, .hk-mobile-menu a.active { background:hsl(218 85% 22% / .1); color:var(--primary); }
.hk-mobile-actions { display:flex; gap:.5rem; padding:.5rem 0; }
.hk-mobile-actions .outline { flex:1; padding:.5rem; border:1px solid var(--border); border-radius:.5rem; text-align:center; font-size:.875rem; font-weight:500; }
.hk-mobile-actions .primary { flex:1; padding:.5rem; border-radius:.5rem; text-align:center; font-size:.875rem; font-weight:600; background-image:var(--grad-accent); color:#fff; }

/* ═══════════════════════════════════════════
   PAGE HEADER (PageHeader component)
═══════════════════════════════════════════ */
.hk-page-header {
  position:relative; padding:3rem 0 2.5rem; overflow:hidden;
}
@media(min-width:768px){ .hk-page-header { padding:4rem 0 3.5rem; } }
.hk-page-header::before {
  content:''; position:absolute; inset:0; z-index:0;
  background: linear-gradient(135deg, hsl(218 85% 22% / .10) 0%, transparent 60%, hsl(22 95% 55% / .10) 100%);
}
.hk-page-header-mesh { position:absolute; inset:0; z-index:0; background-image:var(--grad-mesh); }
.hk-page-header-content { position:relative; z-index:1; text-align:center; max-width:48rem; margin:0 auto; }
.hk-eyebrow { font-size:.75rem; font-weight:600; text-transform:uppercase; letter-spacing:.1em; color:var(--accent); margin-bottom:.75rem; display:block; }
.hk-page-header h1 { font-size:clamp(1.875rem,5vw,3rem); font-weight:800; }
.hk-page-header p  { margin-top:.75rem; color:var(--muted-fg); font-size:1.0625rem; }

/* ═══════════════════════════════════════════
   HERO SECTION
═══════════════════════════════════════════ */
.hk-hero {
  position:relative; overflow:hidden;
  padding:4rem 0 5rem;
}
@media(min-width:768px)  { .hk-hero { padding:6rem 0 7rem; } }
@media(min-width:1024px) { .hk-hero { padding:8rem 0 9rem; } }
.hk-hero-bg { position:absolute; inset:0; z-index:0; }
.hk-hero-bg img { width:100%; height:100%; object-fit:cover; }
.hk-hero-bg::after {
  content:''; position:absolute; inset:0;
  background: linear-gradient(to bottom, hsl(218 85% 22% / .85) 0%, hsl(218 75% 32% / .7) 50%, var(--background) 100%);
}
.hk-hero-mesh { position:absolute; inset:0; z-index:1; background-image:var(--grad-mesh); opacity:.6; }
.hk-hero-blob-1 { position:absolute; top:8rem; left:2rem; width:5rem; height:5rem; border-radius:50%; background:hsl(22 95% 55% / .3); filter:blur(2rem); z-index:1; animation:float-slow 9s ease-in-out infinite; }
.hk-hero-blob-2 { position:absolute; top:12rem; right:3rem; width:8rem; height:8rem; border-radius:50%; background:hsl(218 90% 45% / .3); filter:blur(3rem); z-index:1; animation:float 6s ease-in-out infinite; }
.hk-hero-content { position:relative; z-index:2; max-width:56rem; margin:0 auto; text-align:center; animation:fade-in .6s cubic-bezier(.16,1,.3,1); }
.hk-hero-badge {
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.375rem 1rem; border-radius:999px;
  background:hsl(0 0% 100% / .12); border:1px solid hsl(0 0% 100% / .3);
  color:hsl(0 0% 100% / .9); font-size:.75rem; font-weight:500; margin-bottom:1.5rem;
  backdrop-filter:blur(8px);
}
.hk-hero-badge svg { width:14px; height:14px; color:var(--accent-glow); }
.hk-hero h1 {
  font-size:clamp(2.25rem,7vw,4.5rem); font-weight:800; color:#fff;
  line-height:1.05; letter-spacing:-.03em;
}
.hk-hero h1 .accent-word { position:relative; display:inline-block; }
.hk-hero h1 .accent-word span { background-clip:text; -webkit-background-clip:text; color:transparent; background-image:var(--grad-accent); }
.hk-hero h1 .accent-word svg { position:absolute; bottom:-.5rem; left:0; width:100%; }
.hk-hero-desc { margin-top:1.5rem; font-size:1rem; color:hsl(0 0% 100% / .85); max-width:40rem; margin-left:auto; margin-right:auto; }
@media(min-width:768px){ .hk-hero-desc { font-size:1.125rem; } }
.hk-hero-telugu { margin-top:.25rem; font-size:.875rem; color:hsl(0 0% 100% / .6); font-family:'Noto Sans Telugu',sans-serif; }
.hk-hero-search-wrap { margin:2rem auto 0; max-width:48rem; }
.hk-search-form {
  display:flex; align-items:stretch; background:hsl(0 0% 100% / .9);
  backdrop-filter:blur(20px); border:1px solid hsl(0 0% 100% / .3);
  border-radius:1rem; overflow:hidden; box-shadow:var(--shadow-lg); padding:.5rem;
}
@media (prefers-color-scheme:dark) { .hk-search-form { background:hsl(222 47% 12% / .9); } }
.hk-search-location {
  display:none; align-items:center; gap:.5rem; padding:0 1rem;
  border-right:1px solid var(--border); min-width:150px;
}
@media(min-width:768px){ .hk-search-location { display:flex; } }
.hk-search-location svg { width:16px; height:16px; color:var(--accent); flex-shrink:0; }
.hk-search-location-label { font-size:.625rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted-fg); }
.hk-search-location-city  { font-size:.875rem; font-weight:600; color:var(--foreground); }
.hk-search-input-wrap { flex:1; display:flex; align-items:center; gap:.5rem; padding:0 1rem; }
.hk-search-input-wrap svg { width:20px; height:20px; color:var(--muted-fg); flex-shrink:0; }
.hk-search-input {
  flex:1; background:transparent; border:none; outline:none;
  font-size:.875rem; color:var(--foreground); padding:.75rem 0;
  font-family:inherit;
}
@media(min-width:768px){ .hk-search-input { font-size:1rem; } }
.hk-search-input::placeholder { color:var(--muted-fg); }
.hk-search-btn {
  display:flex; align-items:center; gap:.5rem; padding:.625rem 1.25rem;
  border-radius:.75rem; background-image:var(--grad-accent); color:#fff;
  border:none; cursor:pointer; font-size:.875rem; font-weight:600;
  box-shadow:var(--shadow-accent-glow); transition:opacity .2s; white-space:nowrap;
}
@media(min-width:768px){ .hk-search-btn { padding:.625rem 1.75rem; font-size:1rem; } }
.hk-search-btn:hover { opacity:.95; }
.hk-search-btn svg { width:16px; height:16px; }
.hk-trending { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.5rem; margin-top:1.25rem; font-size:.75rem; }
.hk-trending-label { display:flex; align-items:center; gap:.375rem; color:hsl(0 0% 100% / .8); font-weight:500; }
.hk-trending-label svg { width:14px; height:14px; color:var(--accent-glow); }
.hk-trending a { padding:.25rem .75rem; border-radius:999px; background:hsl(0 0% 100% / .12); border:1px solid hsl(0 0% 100% / .2); color:hsl(0 0% 100% / .9); transition:background .2s; }
.hk-trending a:hover { background:hsl(0 0% 100% / .2); }
.hk-hero-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.75rem; margin-top:2rem; }
.hk-btn-white { display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.25rem; border-radius:.75rem; background:#fff; color:var(--primary); font-weight:600; border:none; cursor:pointer; box-shadow:var(--shadow-lg); transition:transform .2s; }
.hk-btn-white:hover { transform:scale(1.05); }
.hk-btn-glass { display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.25rem; border-radius:.75rem; background:hsl(0 0% 100% / .12); border:1px solid hsl(0 0% 100% / .3); color:#fff; font-weight:600; cursor:pointer; transition:background .2s; }
.hk-btn-glass:hover { background:hsl(0 0% 100% / .2); }
.hk-btn-white svg, .hk-btn-glass svg { width:16px; height:16px; }
.hk-hero-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem 2rem; max-width:32rem; margin:3rem auto 0; text-align:center; }
.hk-stat-value { font-family:'Space Grotesk',sans-serif; font-size:clamp(1.5rem,4vw,2.5rem); font-weight:800; color:#fff; line-height:1; }
.hk-stat-label { font-size:.75rem; color:hsl(0 0% 100% / .7); margin-top:.25rem; }
@media(min-width:768px){ .hk-stat-value { font-size:clamp(2rem,4vw,2.5rem); } }

/* ═══════════════════════════════════════════
   SECTIONS SHARED
═══════════════════════════════════════════ */
.hk-section { padding:4rem 0; }
@media(min-width:768px){ .hk-section { padding:6rem 0; } }
.hk-section-head { display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:2.5rem; }
.hk-section-head-center { text-align:center; margin-bottom:3rem; }
.hk-section-tag { display:inline-flex; align-items:center; gap:.5rem; padding:.375rem .75rem; border-radius:999px; font-size:.75rem; font-weight:600; margin-bottom:.75rem; }
.hk-section-tag-accent  { background:hsl(22 95% 55% / .1);  color:var(--accent);   }
.hk-section-tag-primary { background:hsl(218 85% 22% / .1); color:var(--primary);  }
.hk-section-tag-red     { background:hsl(0 84% 60% / .1);   color:var(--destructive); }
.hk-section-tag svg { width:14px; height:14px; }
.hk-section-title { font-size:clamp(1.75rem,4vw,3rem); font-weight:800; line-height:1.1; }
.hk-section-sub   { color:var(--muted-fg); margin-top:.5rem; }
.hk-view-all { display:none; align-items:center; gap:.375rem; font-size:.875rem; font-weight:600; color:var(--primary); transition:color .2s; }
@media(min-width:768px){ .hk-view-all { display:flex; } }
.hk-view-all:hover { color:var(--accent); }
.hk-view-all svg { width:16px; height:16px; }
.hk-view-all-mobile { margin-top:1.5rem; text-align:center; }
@media(min-width:768px){ .hk-view-all-mobile { display:none; } }

/* ═══════════════════════════════════════════
   CATEGORIES SECTION
═══════════════════════════════════════════ */
.hk-categories-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
@media(min-width:768px)  { .hk-categories-grid { grid-template-columns:repeat(4,1fr); gap:1rem; } }
@media(min-width:1024px) { .hk-categories-grid { grid-template-columns:repeat(6,1fr); } }
.hk-cat-card {
  display:flex; flex-direction:column; align-items:center; gap:.75rem;
  padding:1rem .75rem; border-radius:1rem; background:var(--card);
  border:1px solid var(--border); transition:all .2s; cursor:pointer;
  animation:fade-in .4s cubic-bezier(.16,1,.3,1) both;
}
@media(min-width:768px){ .hk-cat-card { padding:1.25rem; } }
.hk-cat-card:hover { border-color:transparent; box-shadow:var(--shadow-lg); transform:translateY(-4px); }
.hk-cat-icon-wrap {
  width:48px; height:48px; border-radius:.75rem;
  display:flex; align-items:center; justify-content:center;
  box-shadow:var(--shadow-md); transition:transform .2s;
}
@media(min-width:768px){ .hk-cat-icon-wrap { width:56px; height:56px; border-radius:.875rem; } }
.hk-cat-card:hover .hk-cat-icon-wrap { transform:scale(1.1) rotate(3deg); }
.hk-cat-icon-wrap svg { width:24px; height:24px; color:#fff; }
@media(min-width:768px){ .hk-cat-icon-wrap svg { width:28px; height:28px; } }
.hk-cat-label { font-size:.75rem; font-weight:600; text-align:center; line-height:1.3; }
@media(min-width:768px){ .hk-cat-label { font-size:.875rem; } }
.hk-cat-telugu { font-size:.625rem; color:var(--muted-fg); font-family:'Noto Sans Telugu',sans-serif; text-align:center; margin-top:1px; }
.hk-cat-count  { font-size:.625rem; font-weight:600; color:var(--accent); margin-top:2px; }

/* ═══════════════════════════════════════════
   BUSINESS CARD
═══════════════════════════════════════════ */
.hk-grid-3 { display:grid; gap:1.25rem; }
@media(min-width:640px)  { .hk-grid-3 { grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px) { .hk-grid-3 { grid-template-columns:repeat(3,1fr); gap:1.5rem; } }
.hk-biz-card {
  background:var(--card); border:1px solid var(--border); border-radius:1.25rem;
  overflow:hidden; transition:all .3s; display:flex; flex-direction:column;
  animation:fade-in .4s cubic-bezier(.16,1,.3,1) both;
}
.hk-biz-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-4px); }
.hk-biz-img-wrap { position:relative; aspect-ratio:16/10; overflow:hidden; }
.hk-biz-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.hk-biz-card:hover .hk-biz-img-wrap img { transform:scale(1.1); }
.hk-biz-img-overlay { position:absolute; inset:0; background:linear-gradient(to top,hsl(0 0% 0% / .6),transparent 50%); }
.hk-biz-badges { position:absolute; top:.75rem; left:.75rem; display:flex; gap:.5rem; }
.hk-badge { display:inline-flex; align-items:center; gap:.25rem; padding:.25rem .5rem; border-radius:.375rem; font-size:.625rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.hk-badge-sponsored { background:var(--accent); color:#fff; }
.hk-badge-featured   { background-image:var(--grad-primary); color:#fff; }
.hk-badge-featured svg { width:12px; height:12px; }
.hk-biz-img-bottom { position:absolute; bottom:.75rem; left:.75rem; right:.75rem; display:flex; align-items:flex-end; justify-content:space-between; }
.hk-rating-pill { display:flex; align-items:center; gap:.375rem; padding:.375rem .625rem; border-radius:.5rem; background:hsl(0 0% 100% / .95); backdrop-filter:blur(4px); box-shadow:var(--shadow-sm); }
.hk-rating-pill svg { width:14px; height:14px; color:var(--accent); fill:var(--accent); }
.hk-rating-pill span { font-size:.75rem; font-weight:700; }
.hk-rating-pill small { font-size:.625rem; color:var(--muted-fg); }
.hk-distance-pill { padding:.375rem .625rem; border-radius:.5rem; background:hsl(0 0% 0% / .5); backdrop-filter:blur(4px); color:#fff; font-size:.75rem; font-weight:500; }
.hk-biz-body { padding:1rem; flex:1; display:flex; flex-direction:column; gap:.375rem; }
.hk-biz-header { display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; margin-bottom:.25rem; }
.hk-biz-name { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1rem; line-height:1.3; transition:color .2s; overflow:hidden; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; }
.hk-biz-name:hover { color:var(--primary); }
.hk-open-badge { display:inline-flex; align-items:center; gap:.25rem; font-size:.625rem; font-weight:600; padding:.25rem .5rem; border-radius:999px; white-space:nowrap; flex-shrink:0; }
.hk-open-badge svg { width:12px; height:12px; }
.hk-open-badge.open   { background:hsl(142 70% 42% / .1); color:var(--success); }
.hk-open-badge.closed { background:hsl(0 84% 60% / .1);   color:var(--destructive); }
.hk-biz-cat  { font-size:.75rem; color:var(--muted-fg); }
.hk-biz-addr { display:flex; align-items:flex-start; gap:.375rem; font-size:.75rem; color:var(--muted-fg); }
.hk-biz-addr svg { width:14px; height:14px; margin-top:1px; flex-shrink:0; }
.hk-biz-tags { display:flex; flex-wrap:wrap; gap:.375rem; margin:.125rem 0; }
.hk-biz-tag  { font-size:.625rem; font-weight:500; padding:.25rem .5rem; border-radius:.375rem; background:var(--muted); color:var(--muted-fg); }
.hk-biz-actions { display:grid; grid-template-columns:repeat(3,1fr); gap:.375rem; padding:.75rem 1rem; border-top:1px solid var(--border); margin-top:auto; }
.hk-action-btn {
  display:flex; align-items:center; justify-content:center; gap:.375rem;
  padding:.5rem .25rem; border-radius:.5rem; font-size:.75rem; font-weight:600;
  border:none; cursor:pointer; transition:all .2s; text-decoration:none;
}
.hk-action-btn svg { width:14px; height:14px; }
.hk-action-call    { background:hsl(218 85% 22% / .1); color:var(--primary); }
.hk-action-call:hover { background:var(--primary); color:#fff; }
.hk-action-whatsapp { background:hsl(141 64% 48% / .1); color:#25D366; }
.hk-action-whatsapp:hover { background:#25D366; color:#fff; }
.hk-action-map     { background:hsl(22 95% 55% / .1); color:var(--accent); }
.hk-action-map:hover  { background:var(--accent); color:#fff; }

/* ═══════════════════════════════════════════
   JOB CARD
═══════════════════════════════════════════ */
.hk-job-card {
  background:var(--card); border:1px solid var(--border); border-radius:1.25rem;
  padding:1.25rem; transition:all .3s;
  animation:fade-in .4s cubic-bezier(.16,1,.3,1) both;
}
.hk-job-card:hover { border-color:hsl(218 85% 22% / .3); box-shadow:var(--shadow-lg); }
.hk-job-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:.75rem; margin-bottom:.75rem; }
.hk-job-avatar {
  width:48px; height:48px; border-radius:.75rem; flex-shrink:0;
  background-image:var(--grad-primary); display:flex; align-items:center; justify-content:center;
  color:#fff; font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem;
}
.hk-job-meta-top { display:flex; flex-direction:column; align-items:flex-end; gap:.25rem; }
.hk-job-badge { display:inline-flex; align-items:center; gap:.25rem; padding:.25rem .5rem; border-radius:.375rem; background:hsl(22 95% 55% / .15); color:var(--accent); font-size:.625rem; font-weight:700; text-transform:uppercase; }
.hk-job-badge svg { width:12px; height:12px; }
.hk-job-posted { font-size:.625rem; color:var(--muted-fg); }
.hk-job-title  { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem; line-height:1.3; transition:color .2s; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; margin-bottom:.25rem; }
.hk-job-title:hover { color:var(--primary); }
.hk-job-company { font-size:.875rem; color:var(--muted-fg); margin-bottom:.75rem; }
.hk-job-details { display:flex; flex-direction:column; gap:.375rem; font-size:.75rem; color:var(--muted-fg); margin-bottom:1rem; }
.hk-job-detail-row { display:flex; align-items:center; gap:.375rem; }
.hk-job-detail-row svg { width:14px; height:14px; }
.hk-job-detail-row.salary svg { color:var(--success); }
.hk-job-detail-row.loc svg    { color:var(--primary); }
.hk-job-detail-row.exp svg    { color:var(--primary); }
.hk-job-detail-row.type svg   { color:var(--accent);  }
.hk-job-two-col { display:flex; align-items:center; gap:1rem; }
.hk-job-tags { display:flex; flex-wrap:wrap; gap:.375rem; margin-bottom:1rem; }
.hk-job-tag  { font-size:.625rem; font-weight:500; padding:.25rem .5rem; border-radius:.375rem; background:hsl(218 85% 22% / .08); color:var(--primary); }
.hk-job-actions { display:flex; gap:.5rem; padding-top:.75rem; border-top:1px solid var(--border); }
.hk-job-apply { flex:1; display:flex; align-items:center; justify-content:center; gap:.375rem; padding:.5rem; border-radius:.5rem; background-image:var(--grad-primary); color:#fff; font-size:.75rem; font-weight:600; border:none; cursor:pointer; text-decoration:none; }
.hk-job-apply svg { width:14px; height:14px; }
.hk-job-wa    { display:flex; align-items:center; justify-content:center; gap:.375rem; padding:.5rem .75rem; border-radius:.5rem; background:hsl(141 64% 48% / .1); color:#25D366; font-size:.75rem; font-weight:600; border:none; cursor:pointer; text-decoration:none; }
.hk-job-wa:hover { background:#25D366; color:#fff; }
.hk-job-wa svg { width:14px; height:14px; }

/* ═══════════════════════════════════════════
   PLACES SECTION
═══════════════════════════════════════════ */
.hk-places-grid { display:grid; gap:1.25rem; }
@media(min-width:640px)  { .hk-places-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px) { .hk-places-grid { grid-template-columns:repeat(4,1fr); } }
.hk-place-card {
  position:relative; border-radius:1.25rem; overflow:hidden;
  aspect-ratio:3/4; cursor:pointer; transition:all .3s;
  animation:fade-in .5s cubic-bezier(.16,1,.3,1) both;
}
.hk-place-card:hover { box-shadow:var(--shadow-lg); }
.hk-place-card:hover img { transform:scale(1.1); }
.hk-place-card img { width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.hk-place-overlay { position:absolute; inset:0; background:linear-gradient(to top,hsl(0 0% 0% / .85) 0%,hsl(0 0% 0% / .3) 50%,transparent 100%); }
.hk-place-type { position:absolute; top:.75rem; left:.75rem; padding:.375rem .625rem; border-radius:.5rem; background:hsl(0 0% 100% / .9); backdrop-filter:blur(4px); font-size:.625rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--primary); }
.hk-place-body { position:absolute; bottom:0; left:0; right:0; padding:1.25rem; color:#fff; }
.hk-place-name    { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem; line-height:1.2; }
.hk-place-telugu  { font-size:.75rem; color:hsl(0 0% 100% / .7); font-family:'Noto Sans Telugu',sans-serif; margin-top:2px; }
.hk-place-desc    { font-size:.75rem; color:hsl(0 0% 100% / .8); margin-top:.5rem; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.hk-place-dir-btn {
  margin-top:.75rem; display:inline-flex; align-items:center; gap:.375rem;
  padding:.375rem .75rem; border-radius:.5rem; background:var(--accent); color:#fff;
  font-size:.75rem; font-weight:600; border:none; cursor:pointer;
  opacity:0; transition:opacity .2s;
}
.hk-place-card:hover .hk-place-dir-btn { opacity:1; }
.hk-place-dir-btn svg { width:14px; height:14px; }

/* ═══════════════════════════════════════════
   MAP SECTION
═══════════════════════════════════════════ */
.hk-map-grid { display:grid; gap:2.5rem; align-items:center; }
@media(min-width:1024px){ .hk-map-grid { grid-template-columns:1fr 1fr; } }
.hk-map-features { margin-top:1.5rem; display:flex; flex-direction:column; gap:.75rem; }
.hk-map-feature { display:flex; align-items:flex-start; gap:.75rem; padding:.75rem; border-radius:.75rem; background:var(--card); border:1px solid var(--border); }
.hk-map-feature-icon { width:40px; height:40px; border-radius:.5rem; background:hsl(218 85% 22% / .1); display:flex; align-items:center; justify-content:center; color:var(--primary); flex-shrink:0; }
.hk-map-feature-icon svg { width:20px; height:20px; }
.hk-map-feature-title { font-weight:600; font-size:.875rem; }
.hk-map-feature-sub   { font-size:.75rem; color:var(--muted-fg); margin-top:2px; }
.hk-find-near-btn {
  margin-top:1.5rem; display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.25rem; border-radius:.75rem; background-image:var(--grad-primary);
  color:#fff; font-weight:600; border:none; cursor:pointer; box-shadow:var(--shadow-glow);
  transition:transform .2s;
}
.hk-find-near-btn:hover { transform:scale(1.05); }
.hk-find-near-btn svg { width:16px; height:16px; }
.hk-map-visual {
  position:relative; aspect-ratio:5/4; border-radius:1.5rem; overflow:hidden;
  border:1px solid var(--border); background:linear-gradient(135deg,hsl(218 50% 96%),hsl(22 100% 97%));
  box-shadow:var(--shadow-lg);
}
@media (prefers-color-scheme:dark){ .hk-map-visual { background:linear-gradient(135deg,hsl(218 50% 10%),hsl(22 50% 10%)); } }
.hk-map-grid-svg { position:absolute; inset:0; width:100%; height:100%; opacity:.6; }
.hk-map-pin { position:absolute; transform:translate(-50%,-100%); }
.hk-map-pin-inner { position:relative; }
.hk-map-pin-dot {
  width:36px; height:36px; border-radius:50% 50% 50% 0; transform:rotate(-45deg);
  display:flex; align-items:center; justify-content:center;
  border:2px solid #fff; box-shadow:var(--shadow-md);
}
.hk-map-pin-dot svg { width:16px; height:16px; color:#fff; fill:#fff; transform:rotate(45deg); }
.hk-map-pin-ring { position:absolute; inset:0; border-radius:50% 50% 50% 0; animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite; opacity:.5; }
.hk-map-user { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); }
.hk-map-user-dot { width:16px; height:16px; border-radius:50%; background:var(--primary); border:2px solid #fff; box-shadow:var(--shadow-md); position:relative; }
.hk-map-user-ring { position:absolute; inset:0; border-radius:50%; background:var(--primary); animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite; }
.hk-map-filters { position:absolute; top:.75rem; left:.75rem; right:.75rem; display:flex; gap:.5rem; overflow-x:auto; }
.hk-map-filter-btn { flex-shrink:0; padding:.375rem .75rem; border-radius:999px; font-size:.75rem; font-weight:600; border:none; cursor:pointer; transition:all .2s; background:hsl(0 0% 100% / .9); backdrop-filter:blur(4px); color:var(--foreground); }
.hk-map-filter-btn.active { background:var(--primary); color:#fff; box-shadow:var(--shadow-sm); }

/* ═══════════════════════════════════════════
   OFFERS SECTION
═══════════════════════════════════════════ */
.hk-offers-grid { display:grid; gap:1.25rem; }
@media(min-width:640px)  { .hk-offers-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px) { .hk-offers-grid { grid-template-columns:repeat(4,1fr); } }
.hk-offer-card {
  position:relative; background:linear-gradient(135deg,var(--card),var(--secondary));
  border:1px solid var(--border); border-radius:1.25rem; padding:1.25rem;
  overflow:hidden; transition:all .3s;
  animation:fade-in .4s cubic-bezier(.16,1,.3,1) both;
}
.hk-offer-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-4px); }
.hk-offer-deco-1 { position:absolute; top:-24px; right:-24px; width:96px; height:96px; border-radius:50%; background-image:var(--grad-accent); opacity:.1; }
.hk-offer-deco-2 { position:absolute; bottom:-32px; left:-32px; width:128px; height:128px; border-radius:50%; background-image:var(--grad-primary); opacity:.05; }
.hk-offer-inner { position:relative; }
.hk-offer-cat  { font-size:.625rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:var(--muted-fg); }
.hk-offer-discount { font-family:'Space Grotesk',sans-serif; font-size:1.875rem; font-weight:800; background-clip:text; -webkit-background-clip:text; color:transparent; background-image:var(--grad-accent); margin-top:.25rem; line-height:1; }
.hk-offer-title   { font-weight:700; margin-top:.5rem; line-height:1.3; }
.hk-offer-biz     { font-size:.75rem; color:var(--muted-fg); margin-top:.25rem; }
.hk-offer-code-row { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:1rem; }
.hk-offer-code-box { flex:1; padding:.5rem .75rem; border-radius:.5rem; border:2px dashed hsl(22 95% 55% / .5); background:hsl(22 95% 55% / .05); }
.hk-offer-code-lbl { font-size:.625rem; color:var(--muted-fg); }
.hk-offer-code-val { font-family:'Space Grotesk',monospace; font-weight:700; font-size:.875rem; color:var(--accent); }
.hk-offer-copy-btn {
  width:40px; height:40px; border-radius:.5rem; background:var(--accent);
  color:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:transform .2s;
}
.hk-offer-copy-btn:hover { transform:scale(1.05); }
.hk-offer-copy-btn svg { width:16px; height:16px; }
.hk-offer-valid { font-size:.625rem; color:var(--muted-fg); margin-top:.5rem; }

/* ═══════════════════════════════════════════
   EMERGENCY SECTION
═══════════════════════════════════════════ */
.hk-emergency-section {
  position:relative; padding:4rem 0; overflow:hidden;
}
@media(min-width:768px){ .hk-emergency-section { padding:5rem 0; } }
.hk-emergency-bg { position:absolute; inset:0; background:linear-gradient(135deg,hsl(0 72% 51%),hsl(351 84% 44%)); }
.hk-emergency-mesh { position:absolute; inset:0; background-image:var(--grad-mesh); opacity:.3; }
.hk-emergency-head { display:flex; align-items:center; gap:1rem; margin-bottom:2rem; color:#fff; }
.hk-emergency-icon { width:56px; height:56px; border-radius:.875rem; background:hsl(0 0% 100% / .15); backdrop-filter:blur(8px); display:flex; align-items:center; justify-content:center; }
.hk-emergency-icon svg { width:28px; height:28px; color:#fff; }
.hk-emergency-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(1.25rem,3vw,1.875rem); font-weight:800; color:#fff; }
.hk-emergency-sub   { color:hsl(0 0% 100% / .8); font-size:.875rem; margin-top:2px; }
.hk-emergency-grid  { display:grid; grid-template-columns:repeat(2,1fr); gap:.75rem; }
@media(min-width:768px){ .hk-emergency-grid { grid-template-columns:repeat(4,1fr); } }
.hk-emergency-card {
  background:hsl(0 0% 100% / .12); border:1px solid hsl(0 0% 100% / .2);
  border-radius:1rem; padding:1rem; color:#fff;
  backdrop-filter:blur(8px); transition:background .2s; text-decoration:none; display:block;
  animation:fade-in .4s cubic-bezier(.16,1,.3,1) both;
}
.hk-emergency-card:hover { background:hsl(0 0% 100% / .2); }
.hk-emergency-type   { font-size:.625rem; font-weight:600; text-transform:uppercase; letter-spacing:.05em; color:hsl(0 0% 100% / .7); }
.hk-emergency-name   { font-weight:600; font-size:.875rem; margin-top:.25rem; line-height:1.3; }
.hk-emergency-bottom { display:flex; align-items:center; justify-content:space-between; margin-top:.75rem; }
.hk-emergency-number { font-family:'Space Grotesk',sans-serif; font-weight:800; font-size:1.125rem; }
.hk-emergency-phone-btn { width:36px; height:36px; border-radius:50%; background:#fff; color:hsl(0 72% 51%); display:flex; align-items:center; justify-content:center; transition:transform .2s; }
.hk-emergency-card:hover .hk-emergency-phone-btn { transform:scale(1.1); }
.hk-emergency-phone-btn svg { width:16px; height:16px; fill:currentColor; }

/* ═══════════════════════════════════════════
   CTA SECTION
═══════════════════════════════════════════ */
.hk-cta-grid { display:grid; gap:1.25rem; }
@media(min-width:768px){ .hk-cta-grid { grid-template-columns:repeat(2,1fr); } }
.hk-cta-card {
  position:relative; border-radius:1.5rem; overflow:hidden;
  padding:2rem 2.5rem; color:#fff; box-shadow:var(--shadow-lg);
}
.hk-cta-card-deco-1 { position:absolute; top:-48px; right:-48px; width:192px; height:192px; border-radius:50%; background:hsl(0 0% 100% / .1); }
.hk-cta-card-deco-2 { position:absolute; bottom:0; right:0; width:128px; height:128px; border-radius:50%; filter:blur(3rem); }
.hk-cta-card-primary { background-image:var(--grad-primary); }
.hk-cta-card-primary .hk-cta-card-deco-2 { background:hsl(22 95% 55% / .3); }
.hk-cta-card-accent  { background-image:var(--grad-accent); }
.hk-cta-card-accent  .hk-cta-card-deco-3 { position:absolute; top:-48px; left:-48px; width:192px; height:192px; border-radius:50%; background:hsl(0 0% 100% / .15); }
.hk-cta-icon  { position:relative; width:40px; height:40px; margin-bottom:1rem; }
.hk-cta-icon svg { width:40px; height:40px; color:var(--accent-glow); }
.hk-cta-card-accent .hk-cta-icon svg { color:#fff; }
.hk-cta-title { position:relative; font-family:'Space Grotesk',sans-serif; font-weight:800; font-size:clamp(1.25rem,3vw,1.875rem); line-height:1.2; }
.hk-cta-desc  { position:relative; margin-top:.75rem; font-size:.9375rem; color:hsl(0 0% 100% / .85); }
.hk-cta-btn {
  position:relative; margin-top:1.5rem; display:inline-flex; align-items:center; gap:.5rem;
  padding:.75rem 1.25rem; border-radius:.75rem; background:#fff;
  font-weight:600; border:none; cursor:pointer; transition:transform .2s;
}
.hk-cta-card-primary .hk-cta-btn { color:var(--primary); }
.hk-cta-card-accent  .hk-cta-btn { color:var(--accent);  }
.hk-cta-btn:hover { transform:scale(1.05); }
.hk-cta-btn svg { width:16px; height:16px; }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
.hk-footer { background:var(--primary); color:#fff; margin-top:4rem; }
.hk-footer-main { padding:3.5rem 0 2rem; display:grid; gap:2.5rem; }
@media(min-width:768px)  { .hk-footer-main { grid-template-columns:repeat(2,1fr); } }
@media(min-width:1024px) { .hk-footer-main { grid-template-columns:2fr 1fr 1fr 1fr; } }
.hk-footer-brand p { margin-top:1rem; font-size:.875rem; color:hsl(0 0% 100% / .7); max-width:20rem; line-height:1.7; }
.hk-footer-social { display:flex; gap:.75rem; margin-top:1.25rem; }
.hk-footer-social a { width:36px; height:36px; border-radius:50%; background:hsl(0 0% 100% / .1); display:flex; align-items:center; justify-content:center; transition:background .2s; }
.hk-footer-social a:hover { background:var(--accent); }
.hk-footer-social svg { width:16px; height:16px; }
.hk-footer-col h4 { font-weight:600; font-size:1rem; margin-bottom:1rem; }
.hk-footer-col ul { list-style:none; display:flex; flex-direction:column; gap:.625rem; }
.hk-footer-col ul li a { font-size:.875rem; color:hsl(0 0% 100% / .7); transition:color .2s; }
.hk-footer-col ul li a:hover { color:var(--accent); }
.hk-footer-contact li { display:flex; align-items:flex-start; gap:.625rem; font-size:.875rem; color:hsl(0 0% 100% / .7); }
.hk-footer-contact svg { width:16px; height:16px; color:var(--accent); flex-shrink:0; margin-top:2px; }
.hk-footer-bottom { border-top:1px solid hsl(0 0% 100% / .1); padding:1.25rem 0; display:flex; flex-direction:column; align-items:center; justify-content:space-between; gap:.75rem; font-size:.75rem; color:hsl(0 0% 100% / .6); }
@media(min-width:768px){ .hk-footer-bottom { flex-direction:row; } }
.hk-footer-links { display:flex; gap:1.25rem; }
.hk-footer-links a { color:hsl(0 0% 100% / .6); transition:color .2s; }
.hk-footer-links a:hover { color:#fff; }

/* ═══════════════════════════════════════════
   BOTTOM NAV (mobile)
═══════════════════════════════════════════ */
.hk-bottom-nav {
  display:flex; position:fixed; bottom:0; left:0; right:0; z-index:40;
  background:hsl(0 0% 100% / .9); backdrop-filter:blur(24px);
  border-top:1px solid var(--border); height:64px;
  padding-bottom:env(safe-area-inset-bottom,0);
}
@media(min-width:1024px){ .hk-bottom-nav { display:none; } }
@media (prefers-color-scheme:dark){ .hk-bottom-nav { background:hsl(222 47% 8% / .9); } }
.hk-bottom-nav-inner { display:flex; align-items:center; justify-content:space-around; width:100%; }
.hk-bottom-nav-item { display:flex; flex-direction:column; align-items:center; gap:2px; padding:.5rem .75rem; min-width:58px; color:var(--muted-fg); font-size:.625rem; font-weight:500; text-decoration:none; transition:color .2s; }
.hk-bottom-nav-item.active { color:var(--primary); }
.hk-bottom-nav-item svg { width:20px; height:20px; transition:transform .2s; }
.hk-bottom-nav-item.active svg { transform:scale(1.1); }
.hk-bottom-nav-dot { width:4px; height:4px; border-radius:50%; background:var(--accent); position:absolute; top:-4px; left:50%; transform:translateX(-50%); }

/* ═══════════════════════════════════════════
   FLOATING ACTIONS
═══════════════════════════════════════════ */
.hk-float-actions { position:fixed; bottom:80px; right:1rem; z-index:40; display:flex; flex-direction:column; gap:.75rem; }
@media(min-width:1024px){ .hk-float-actions { bottom:1.5rem; right:1.5rem; } }
.hk-float-add {
  display:none; align-items:center; gap:.5rem; padding:.75rem 1rem;
  border-radius:999px; background-image:var(--grad-primary); color:#fff;
  font-weight:600; font-size:.875rem; box-shadow:var(--shadow-glow);
  transition:transform .2s; text-decoration:none;
}
@media(min-width:1024px){ .hk-float-add { display:flex; } }
.hk-float-add:hover { transform:scale(1.05); }
.hk-float-add svg { width:20px; height:20px; }
.hk-float-wa {
  position:relative; width:56px; height:56px; border-radius:50%;
  background:#25D366; color:#fff; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 20px hsl(141 64% 48% / .4); transition:transform .2s; text-decoration:none;
}
.hk-float-wa:hover { transform:scale(1.1); }
.hk-float-wa svg { width:24px; height:24px; fill:#fff; position:relative; z-index:1; }
.hk-float-wa-ring { position:absolute; inset:0; border-radius:50%; background:#25D366; animation:pulse-ring 2s cubic-bezier(.4,0,.6,1) infinite; }

/* ═══════════════════════════════════════════
   SINGLE BUSINESS
═══════════════════════════════════════════ */
.hk-single-hero { height:40vh; min-height:280px; overflow:hidden; position:relative; }
@media(min-width:768px){ .hk-single-hero { height:55vh; } }
.hk-single-hero img { width:100%; height:100%; object-fit:cover; }
.hk-single-hero-overlay { position:absolute; inset:0; background:linear-gradient(to top,var(--background) 0%,hsl(var(--background) / .6) 40%,transparent 100%); }
.hk-single-body { max-width:1400px; margin:-8rem auto 0; padding:0 1.25rem 5rem; position:relative; z-index:1; }
.hk-single-grid { display:grid; gap:1.5rem; }
@media(min-width:1024px){ .hk-single-grid { grid-template-columns:1fr 320px; align-items:start; } }
.hk-single-card { background:var(--card); border:1px solid var(--border); border-radius:1.5rem; padding:1.5rem 2rem; box-shadow:var(--shadow-lg); }
@media(min-width:768px){ .hk-single-card { padding:2rem 2.5rem; } }
.hk-single-sidebar { background:var(--card); border:1px solid var(--border); border-radius:1.5rem; padding:1.5rem; position:sticky; top:88px; }
.hk-detail-actions { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem; margin-top:1.5rem; }
@media(min-width:768px){ .hk-detail-actions { grid-template-columns:repeat(4,1fr); } }
.hk-detail-action-btn { display:flex; align-items:center; justify-content:center; gap:.375rem; padding:.625rem; border-radius:.625rem; font-size:.875rem; font-weight:600; border:none; cursor:pointer; transition:all .2s; text-decoration:none; }
.hk-detail-action-btn svg { width:16px; height:16px; }
.hk-da-primary { background-image:var(--grad-primary); color:#fff; }
.hk-da-green   { border:1px solid #25D366; color:#25D366; background:transparent; }
.hk-da-green:hover  { background:#25D366; color:#fff; }
.hk-da-outline { border:1px solid var(--border); color:var(--foreground); background:transparent; }
.hk-da-outline:hover { background:var(--muted); }
.hk-info-row { display:flex; align-items:flex-start; gap:.75rem; padding:.625rem 0; border-bottom:1px solid var(--border); font-size:.875rem; }
.hk-info-row:last-child { border-bottom:none; }
.hk-info-row svg { width:16px; height:16px; color:var(--primary); flex-shrink:0; margin-top:2px; }

/* ═══════════════════════════════════════════
   ARCHIVE / LISTINGS
═══════════════════════════════════════════ */
.hk-archive-jobs-bg { position:relative; padding:4rem 0; overflow:hidden; }
.hk-archive-jobs-bg::before { content:''; position:absolute; inset:0; background:linear-gradient(135deg,hsl(218 85% 22% / .05),transparent,hsl(22 95% 55% / .05)); z-index:0; }
.hk-archive-jobs-bg::after  { content:''; position:absolute; top:5rem; right:2.5rem; width:18rem; height:18rem; border-radius:50%; background:hsl(218 85% 22% / .1); filter:blur(3rem); z-index:0; }
.hk-jobs-tabs { display:flex; gap:.5rem; overflow-x:auto; padding-bottom:.5rem; }
.hk-jobs-tab { flex-shrink:0; padding:.5rem 1rem; border-radius:999px; font-size:.875rem; font-weight:500; border:1px solid var(--border); background:var(--card); cursor:pointer; transition:all .2s; }
.hk-jobs-tab.active { background:var(--primary); color:#fff; border-color:var(--primary); }
.hk-jobs-tab-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; position:relative; z-index:1; }
.hk-job-filter-tags { display:flex; flex-wrap:wrap; justify-content:center; gap:.5rem; margin-top:2.5rem; position:relative; z-index:1; }
.hk-job-filter-tag { padding:.5rem 1rem; border-radius:999px; background:var(--card); border:1px solid var(--border); font-size:.75rem; font-weight:500; transition:all .2s; text-decoration:none; color:var(--foreground); }
.hk-job-filter-tag:hover { border-color:var(--primary); color:var(--primary); }

/* ═══════════════════════════════════════════
   EVENTS CARDS
═══════════════════════════════════════════ */
.hk-event-card {
  background:var(--card); border:1px solid var(--border); border-radius:1.25rem;
  overflow:hidden; transition:all .3s;
}
.hk-event-card:hover { box-shadow:var(--shadow-lg); }
.hk-event-img-wrap { position:relative; aspect-ratio:16/10; overflow:hidden; }
.hk-event-img-wrap img { width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.hk-event-card:hover .hk-event-img-wrap img { transform:scale(1.1); }
.hk-event-date-badge { position:absolute; top:.75rem; left:.75rem; background:hsl(0 0% 100% / .95); backdrop-filter:blur(4px); border-radius:.5rem; padding:.5rem .625rem; text-align:center; min-width:55px; }
.hk-event-date-month { font-size:.625rem; text-transform:uppercase; font-weight:600; color:var(--muted-fg); }
.hk-event-date-day   { font-family:'Space Grotesk',sans-serif; font-size:1.25rem; font-weight:800; color:var(--accent); line-height:1; }
.hk-event-body { padding:1.25rem; }
.hk-event-title { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem; margin-bottom:.75rem; }
.hk-event-details { display:flex; flex-direction:column; gap:.375rem; font-size:.875rem; color:var(--muted-fg); margin-bottom:1rem; }
.hk-event-detail { display:flex; align-items:center; gap:.5rem; }
.hk-event-detail svg { width:16px; height:16px; }
.hk-event-detail.time svg { color:var(--primary); }
.hk-event-detail.venue svg { color:var(--accent); }
.hk-event-actions { display:flex; gap:.5rem; }
.hk-event-ticket-btn { flex:1; padding:.5rem 1rem; border-radius:.5rem; background-image:var(--grad-primary); color:#fff; font-size:.875rem; font-weight:600; border:none; cursor:pointer; }
.hk-event-share-btn  { padding:.5rem .75rem; border-radius:.5rem; background:var(--secondary); border:none; cursor:pointer; color:var(--foreground); }
.hk-event-share-btn svg { width:16px; height:16px; display:block; }

/* ═══════════════════════════════════════════
   PLAN CARDS (AddBusiness)
═══════════════════════════════════════════ */
.hk-plan-card { position:relative; padding:1.25rem; border-radius:1rem; border:2px solid var(--border); background:var(--card); }
.hk-plan-card.popular { border-color:var(--accent); box-shadow:var(--shadow-accent-glow); }
.hk-plan-popular-badge { position:absolute; top:-10px; right:1rem; padding:.25rem .5rem; border-radius:.375rem; background:var(--accent); color:#fff; font-size:.625rem; font-weight:700; text-transform:uppercase; }
.hk-plan-header { display:flex; align-items:baseline; justify-content:space-between; }
.hk-plan-name  { font-family:'Space Grotesk',sans-serif; font-weight:700; }
.hk-plan-price { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1.125rem; }
.hk-plan-price span { font-size:.75rem; font-weight:400; color:var(--muted-fg); }
.hk-plan-features { list-style:none; margin-top:.75rem; display:flex; flex-direction:column; gap:.375rem; }
.hk-plan-feature { display:flex; align-items:center; gap:.5rem; font-size:.75rem; color:var(--muted-fg); }
.hk-plan-feature svg { width:14px; height:14px; color:var(--success); }

/* ═══════════════════════════════════════════
   FORMS
═══════════════════════════════════════════ */
.hk-form-card { background:var(--card); border:1px solid var(--border); border-radius:1.5rem; padding:1.5rem; box-shadow:var(--shadow-md); }
@media(min-width:768px){ .hk-form-card { padding:2rem 2.5rem; } }
.hk-form-grid { display:grid; gap:1rem; }
@media(min-width:768px){ .hk-form-grid { grid-template-columns:repeat(2,1fr); } }
.hk-field { display:flex; flex-direction:column; gap:.375rem; }
.hk-field.full { grid-column:1/-1; }
.hk-label { font-size:.875rem; font-weight:600; }
.hk-input, .hk-select, .hk-textarea {
  padding:.625rem .875rem; border:1px solid var(--border); border-radius:.625rem;
  font-size:.9375rem; outline:none; transition:border-color .2s;
  background:var(--background); color:var(--foreground); font-family:inherit;
}
.hk-input:focus, .hk-select:focus, .hk-textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px hsl(218 85% 22% / .1); }
.hk-submit-btn {
  width:100%; padding:.875rem; border-radius:.75rem; background-image:var(--grad-accent);
  color:#fff; font-size:1rem; font-weight:700; border:none; cursor:pointer;
  box-shadow:var(--shadow-accent-glow); transition:opacity .2s;
}
.hk-submit-btn:hover { opacity:.9; }
.hk-submit-btn:disabled { opacity:.6; cursor:not-allowed; }

/* ═══════════════════════════════════════════
   DASHBOARD TABS
═══════════════════════════════════════════ */
.hk-tabs { display:flex; flex-wrap:wrap; gap:.375rem; border-bottom:1px solid var(--border); padding-bottom:.5rem; margin-bottom:1.5rem; }
.hk-tab { display:inline-flex; align-items:center; gap:.375rem; padding:.5rem 1rem; border-radius:.5rem; font-size:.875rem; font-weight:500; border:none; background:transparent; cursor:pointer; color:var(--muted-fg); transition:all .2s; }
.hk-tab svg { width:16px; height:16px; }
.hk-tab.active { background:hsl(218 85% 22% / .1); color:var(--primary); font-weight:600; }
.hk-tab-panel { display:none; }
.hk-tab-panel.active { display:block; }

/* ═══════════════════════════════════════════
   ADMIN TABLE ROWS
═══════════════════════════════════════════ */
.hk-admin-row { background:var(--card); border:1px solid var(--border); border-radius:.75rem; padding:1rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.hk-approve-btn { padding:.375rem .875rem; border-radius:.5rem; background-image:var(--grad-primary); color:#fff; font-size:.8125rem; font-weight:600; border:none; cursor:pointer; }
.hk-reject-btn  { padding:.375rem .875rem; border-radius:.5rem; border:1px solid var(--border); background:transparent; font-size:.8125rem; font-weight:500; cursor:pointer; }

/* ═══════════════════════════════════════════
   SEARCH PAGE FILTERS
═══════════════════════════════════════════ */
.hk-search-filters { display:flex; gap:.5rem; overflow-x:auto; padding-bottom:.5rem; margin-bottom:2rem; }
.hk-search-filter-btn { flex-shrink:0; display:inline-flex; align-items:center; gap:.375rem; padding:.5rem 1rem; border-radius:999px; background:var(--card); border:1px solid var(--border); font-size:.875rem; font-weight:500; cursor:pointer; transition:all .2s; }
.hk-search-filter-btn svg { width:14px; height:14px; }
.hk-search-filter-btn:hover { border-color:var(--primary); color:var(--primary); }

/* ═══════════════════════════════════════════
   PAGINATION
═══════════════════════════════════════════ */
.hk-pagination { display:flex; justify-content:center; gap:.375rem; margin-top:2.5rem; }
.hk-pagination a, .hk-pagination span.current {
  width:38px; height:38px; display:flex; align-items:center; justify-content:center;
  border-radius:.5rem; border:1px solid var(--border); font-size:.875rem; font-weight:500; transition:all .2s;
}
.hk-pagination a:hover, .hk-pagination span.current { background:var(--primary); color:#fff; border-color:var(--primary); }

/* ═══════════════════════════════════════════
   LOGIN
═══════════════════════════════════════════ */
.hk-login-wrap { min-height:calc(100vh - 10rem); display:flex; align-items:center; justify-content:center; padding:4rem 1.25rem; }
.hk-login-card { width:100%; max-width:28rem; background:var(--card); border:1px solid var(--border); border-radius:1.5rem; padding:2rem; box-shadow:var(--shadow-lg); }
.hk-divider { display:flex; align-items:center; gap:.75rem; font-size:.75rem; color:var(--muted-fg); margin:1rem 0; }
.hk-divider::before, .hk-divider::after { content:''; flex:1; height:1px; background:var(--border); }

/* ═══════════════════════════════════════════
   NOTICE/ALERT BOXES
═══════════════════════════════════════════ */
.hk-notice { padding:1rem 1.25rem; border-radius:.625rem; font-size:.875rem; margin-bottom:1rem; }
.hk-notice-success { background:hsl(142 70% 42% / .1); border-left:4px solid var(--success); color:hsl(142 60% 25%); }
.hk-notice-error   { background:hsl(0 84% 60% / .1);   border-left:4px solid var(--destructive); color:hsl(0 60% 35%); }
.hk-notice-info    { background:hsl(218 85% 22% / .08); border-left:4px solid var(--primary); color:var(--primary); }

/* ═══════════════════════════════════════════
   404 PAGE
═══════════════════════════════════════════ */
.hk-404 { text-align:center; padding:6rem 1.25rem; }
.hk-404-code { font-family:'Space Grotesk',sans-serif; font-size:8rem; font-weight:800; line-height:1; background-clip:text; -webkit-background-clip:text; color:transparent; background-image:var(--grad-hero); }
.hk-404-title { font-size:1.5rem; font-weight:700; margin-bottom:.75rem; }
.hk-404-btn { display:inline-flex; align-items:center; gap:.5rem; padding:.75rem 1.5rem; border-radius:.75rem; background-image:var(--grad-primary); color:#fff; font-weight:600; }

/* ═══════════════════════════════════════════
   RESPONSIVE LAYOUT
═══════════════════════════════════════════ */
body { padding-bottom: 64px; }
@media(min-width:1024px) { body { padding-bottom: 0; } }
main { padding-top: 64px; }
@media(min-width:1024px) { main { padding-top: 80px; } }

/* ── Filter button (archive pages) ────────────── */
.hk-filter-btn {
  display:inline-flex; align-items:center; padding:.375rem .875rem;
  border-radius:999px; border:1px solid var(--border); background:var(--card);
  font-size:.8125rem; font-weight:500; cursor:pointer; transition:all .2s;
  text-decoration:none; color:var(--foreground); white-space:nowrap;
}
.hk-filter-btn:hover, .hk-filter-btn.active {
  background:var(--primary); color:#fff; border-color:var(--primary);
}
/* Active nav link underline */
.hk-nav a.active::after {
  content:''; position:absolute; bottom:0; left:.75rem; right:.75rem;
  height:2px; background:var(--primary); border-radius:2px;
}
/* Single job layout */
.hk-single-job-grid { display:grid; gap:1.5rem; }
@media(min-width:1024px){ .hk-single-job-grid { grid-template-columns:1fr 300px; align-items:start; } }