/* index.css — extracted from index.php (styles unchanged, same order) */
:root{--primary:#0f766e;--primary-dark:#0d9488;--primary-light:#f0fdfa;--accent:#b45309;--accent-dark:#92400e;--success:#047857;--danger:#ef4444;--warning:#b45309;--info:#0369a1;--text:#0f172a;--text-muted:#334155;--text-light:#475569;--border:#e2e8f0;--border-light:#f1f5f9;--bg:#ffffff;--bg-alt:#f8fafc;--card-bg:#ffffff;--radius:12px;--radius-sm:8px;--radius-lg:16px;--radius-xl:24px;--shadow:0 1px 3px rgba(0,0,0,.06);--shadow-md:0 4px 12px rgba(0,0,0,.08);--shadow-lg:0 10px 30px rgba(0,0,0,.1);--shadow-xl:0 20px 50px rgba(0,0,0,.12);--font:'Inter',system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--header-h:60px;--bottom-nav-h:64px;--transition:all .2s ease;--focus-ring:0 0 0 3px #ffffff,0 0 0 6px var(--primary);--focus-ring-dark:0 0 0 3px var(--primary),0 0 0 6px #ffffff}
[data-theme="dark"]{--text:#f1f5f9 !important;--text-muted:#cbd5e1 !important;--text-light:#94a3b8 !important;--border:#334155 !important;--border-light:#1e293b !important;--bg:#0f172a !important;--bg-alt:#1e293b !important;--card-bg:#1e293b !important;--primary-light:#134e4a !important}

/* Ensure Top Bar & Header Have Highest Click Priority */
.top-bar, .site-header, .header-inner, .accessibility-toolbar, .header-actions {
  pointer-events: auto !important;
  z-index: 10005 !important;
  position: relative;
}
.theme-toggle, .text-size-controls button, .lang-switcher a {
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth;scrollbar-gutter:stable;font-size:16px;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{font-family:var(--font)!important;color:var(--text);background:var(--bg-alt);line-height:1.6;padding-bottom:var(--bottom-nav-h);overflow-x:hidden;max-width:100vw;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;touch-action:manipulation;transition:background .25s ease, color .25s ease;}
body.menu-open,body.hm-nav-open{overflow:hidden!important;touch-action:none}
h1,h2,h3,h4,h5,h6,p,span,a,button,input,select,textarea,.btn,.nav-link,.form-control,.form-select,.vendor-name,.cat-chip-name,.section-title,.top-logo,.badge-count,.breadcrumb,label,li,td,th{font-family:var(--font)!important}
a{color:inherit;text-decoration:none;transition:color .2s ease;touch-action:manipulation}
a:hover{color:var(--primary)}
a:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:4px}
img{max-width:100%;height:auto;display:block;object-fit:cover}
ul,ol{list-style:none}
button{cursor:pointer;font-family:inherit;border:none;background:none;touch-action:manipulation}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 16px}

.hero-banner-slider{position:relative;margin:18px 0 0;border-radius:18px;overflow:hidden;box-shadow:0 12px 36px rgba(0,0,0,.28);min-height:auto;width:100%;max-width:100%;box-sizing:border-box;background:linear-gradient(135deg,#09335f 0%,#1e3a8a 50%,#0f766e 100%);contain:layout style;touch-action:pan-y pinch-zoom}
.hero-banner-track{display:flex;width:100%;transition:transform .5s cubic-bezier(0.25,0.8,0.25,1);will-change:transform}
.hero-banner-slide{flex:0 0 100%;width:100%;min-width:100%;max-width:100%;box-sizing:border-box;position:relative;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 16px 44px;word-break:break-word;overflow-wrap:break-word}
@media(min-width:768px){.hero-banner-slide{min-height:240px;padding:36px 40px 48px}}
.hero-banner-inner{position:relative;z-index:1;max-width:540px;width:100%;margin:0 auto;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;text-align:center}
.hero-banner-kicker{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-size:.74rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);padding:5px 14px;border-radius:999px;margin-bottom:10px;max-width:100%;white-space:nowrap}
.hero-banner-title{margin:0 0 8px;font-size:clamp(1.2rem,4.4vw,1.75rem);font-weight:800;line-height:1.25;color:#ffffff;text-shadow:0 2px 8px rgba(0,0,0,0.3);width:100%;word-wrap:break-word;overflow-wrap:break-word;box-sizing:border-box}
.hero-banner-sub{margin:0 auto 16px;font-size:clamp(0.8rem,3.2vw,0.9rem);opacity:.96;line-height:1.45;max-width:440px;width:100%;color:#f1f5f9;word-wrap:break-word;overflow-wrap:break-word;box-sizing:border-box}
.hero-banner-cta{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#ffffff;color:#0f172a!important;font-weight:700;font-size:.88rem;padding:10px 22px;border-radius:50px;text-decoration:none;box-shadow:0 6px 18px rgba(0,0,0,.2);touch-action:manipulation;min-height:42px;white-space:nowrap}
.hero-banner-cta:hover,.hero-banner-cta:focus-visible{background:#f8fafc;color:#0f172a!important;transform:translateY(-1px)}
.hero-banner-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.92);border:none;font-size:1.3rem;color:#0f172a;cursor:pointer;z-index:5;display:flex;align-items:center;justify-content:center;touch-action:manipulation;box-shadow:0 2px 8px rgba(0,0,0,0.25)}
.hero-banner-nav.prev{left:8px}
.hero-banner-nav.next{right:8px}
.hero-banner-dots{position:absolute;bottom:6px;left:0;right:0;display:flex;justify-content:center;gap:2px;z-index:5}
.hero-banner-dots button{position:relative;width:24px;height:24px;min-width:24px;min-height:24px;padding:0;border:0;border-radius:999px;background:transparent;cursor:pointer;touch-action:manipulation;display:inline-flex;align-items:center;justify-content:center}
.hero-banner-dots button::before{content:"";display:block;width:9px;height:9px;border-radius:999px;background:rgba(255,255,255,.55);transition:width .25s ease,background .2s ease}
.hero-banner-dots button.active::before{background:#ffffff;width:22px}
.hero-banner-toggle{position:absolute;top:10px;right:10px;background:rgba(2,6,23,.62);color:#fff;border-radius:999px;font-size:.72rem;font-weight:700;min-height:28px;min-width:44px;padding:4px 12px;border:1px solid rgba(255,255,255,.25);cursor:pointer;z-index:6;touch-action:manipulation}

.floating-actions{position:fixed;top:50%;right:14px;transform:translateY(-50%);z-index:9990;display:flex;flex-direction:column;gap:10px;align-items:flex-end;pointer-events:none;width:160px}
.floating-actions .fab{pointer-events:auto;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;min-width:148px;height:48px;min-height:48px;border-radius:50px;font-size:.88rem;font-weight:700;color:#fff!important;box-shadow:0 6px 20px rgba(0,0,0,.22);transition:transform .2s,box-shadow .2s;white-space:nowrap;touch-action:manipulation;border:none;cursor:pointer}
.fab-book{background:linear-gradient(135deg,#0369a1,#0284c7)}
.fab-quote{background:linear-gradient(135deg,#6d28d9,#5b21b6)}
.fab-track{background:linear-gradient(135deg,#047857,#065f46)}
.fab-install{background:linear-gradient(135deg,#0d9488 0%,#0f766e 50%,#115e59 100%);display:none}
@media(max-width:767px){.floating-actions{position:fixed!important;left:10px!important;right:10px!important;top:auto!important;bottom:calc(var(--bottom-nav-h,64px) + env(safe-area-inset-bottom,0px) + 10px)!important;width:auto!important;height:auto!important;transform:none!important;display:flex!important;flex-direction:row!important;align-items:stretch!important;justify-content:space-between!important;gap:6px!important;pointer-events:none!important;z-index:9990!important}.floating-actions .fab:not(#installBtn){display:inline-flex!important;flex:1 1 0!important;width:auto!important;min-width:0!important;height:58px!important;min-height:58px!important;padding:8px 3px!important;border-radius:14px!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:3px!important;font-size:.68rem!important;line-height:1.12!important;text-align:center!important;pointer-events:auto!important;touch-action:manipulation!important}.floating-actions .fab-icon svg{width:20px!important;height:20px!important}.floating-actions .fab-text{display:block!important;font-size:.64rem!important;font-weight:700!important;line-height:1.15!important}.floating-actions #installBtn.fab-install{display:inline-flex}body{padding-bottom:calc(var(--bottom-nav-h) + 78px + env(safe-area-inset-bottom,0px))}}

.grid-4{display:grid;grid-template-columns:1fr;gap:16px}
.grid-3{display:grid;grid-template-columns:1fr;gap:16px}
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.cat-chip{display:flex;flex-direction:column;align-items:center;padding:16px 8px;background:var(--card-bg);border:1.5px solid var(--border);border-radius:14px;text-align:center;transition:var(--transition);min-height:80px;justify-content:center;color:var(--text)!important;}
.cat-chip:active{transform:scale(0.97)}
.cat-chip:hover{border-color:var(--primary);background:var(--primary-light)}
.cat-chip-name{font-weight:700;font-size:0.86rem;color:var(--text);margin-top:6px;}
.cat-chip-icon,.shop-chip-icon{display:flex;align-items:center;justify-content:center;width:68px;height:68px}
.cat-chip-img{width:70px;height:70px;object-fit:contain;border-radius:10px;display:block}

/* ==============================================================================
   COMMERCIAL MASTER VENDOR CARD STYLES (MATCHING SCREENSHOT)
   ============================================================================== */
.vendor-card {
  background: var(--card-bg, #ffffff);
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid var(--border, #e8ecf1);
  box-shadow: 0 4px 16px rgba(15,23,42,.05);
  display: flex;
  flex-direction: column;
  height: 100%;
  transition: transform .18s ease, box-shadow .18s ease;
  position: relative;
}
.vendor-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(15,23,42,.1);
}
.vendor-card-img {
  position: relative;
  display: flex;
  width: 100%;
  height: 165px;
  min-height: 165px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(135deg, #0f766e, #0d9488);
  text-decoration: none;
  color: #fff;
}
.vendor-card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .25s ease;
}
.vendor-card:hover .vendor-card-img img {
  transform: scale(1.03);
}
.vendor-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #ffffff;
  color: #0f766e;
  font-size: 1.8rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,.15);
}

.vendor-badges {
  position: absolute;
  top: 10px;
  left: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  pointer-events: none;
  z-index: 2;
}
.vendor-badge {
  font-size: .68rem;
  font-weight: 700;
  padding: 4px 9px;
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.badge-featured { background: #fef08a; color: #854d0e; }
.badge-verified { background: #dcfce7; color: #15803d; }
.badge-role {
  background: #fef3c7;
  color: #b45309;
  border: 1px solid rgba(180,83,9,.15);
  font-size: 11px;
}
.vendor-id-chip {
  position: absolute;
  bottom: 8px;
  right: 10px;
  background: rgba(15,23,42,.65);
  color: #f1f5f9;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 4px;
}

.vendor-card-body {
  padding: 14px 14px 16px;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.vendor-name {
  font-size: 1.05rem;
  font-weight: 800;
  color: var(--text, #0f172a);
  line-height: 1.3;
  margin: 0 0 4px;
}
.vendor-name a { color: inherit; text-decoration: none; }
.vendor-name a:hover { color: var(--primary, #0f766e); }

/* CATEGORY & SUB-CATEGORY HIERARCHY (MATCHING SCREENSHOT) */
.vendor-cat-hierarchy {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  font-size: 0.8rem;
  margin-bottom: 6px;
}
.vendor-cat-main {
  font-weight: 700;
  color: #0f766e;
  background: #ccfbf1;
  padding: 2px 7px;
  border-radius: 4px;
}
.vendor-cat-sep {
  color: #94a3b8;
  font-weight: 700;
}
.vendor-cat-sub {
  font-weight: 600;
  color: #475569;
  background: #f1f5f9;
  padding: 2px 7px;
  border-radius: 4px;
}

.vendor-location {
  font-size: .82rem;
  color: var(--text-muted, #64748b);
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
  margin-bottom: 6px;
}
.vendor-rating {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: .82rem;
  font-weight: 700;
  margin: 4px 0 8px;
}

/* DYNAMIC SERVICE CHIPS */
.vendor-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 2px 0 12px;
}
.vendor-tags .tag {
  font-size: 0.72rem;
  font-weight: 500;
  color: #334155;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  padding: 2px 7px;
  border-radius: 6px;
}
.vendor-tags .tag-more {
  font-size: 0.72rem;
  font-weight: 700;
  color: #0f766e;
  padding: 2px 4px;
}

/* ==============================================================================
   2x2 ACTION BUTTON GRID – 100% UNIFIED COLOR THEME
   • Call: #0f766e (Dark Teal)
   • WhatsApp: #22c55e (Vibrant WA Green)
   • Enquiry: #f8fafc / Border #cbd5e1 (Clean Slate/White)
   • Profile: #e0f2fe / Border #bae6fd / Text #0369a1 (Soft Sky Blue)
   ============================================================================== */
.vendor-actions {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 8px !important;
  margin-top: auto !important;
  padding-top: 10px !important;
  border-top: 1px solid #f1f5f9 !important;
}
.vendor-actions .btn {
  min-height: 42px !important;
  font-size: .82rem !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  border: 0 !important;
  transition: all .15s ease !important;
}
.btn-call {
  background: #0f766e !important;
  color: #ffffff !important;
}
.btn-call:hover {
  background: #0d9488 !important;
}
.btn-wa {
  /* v2: darker WhatsApp green — white text now passes WCAG AA (5:1) */
  background: #15803d !important;
  color: #ffffff !important;
}
.btn-wa:hover {
  background: #166534 !important;
}
.btn-enquiry {
  background: #f8fafc !important;
  color: #0f172a !important;
  border: 1px solid #cbd5e1 !important;
}
.btn-enquiry:hover {
  background: #e2e8f0 !important;
}
.vendor-actions .btn-primary {
  background: #e0f2fe !important;
  color: #0369a1 !important;
  border: 1px solid #bae6fd !important;
}
.vendor-actions .btn-primary:hover {
  background: #bae6fd !important;
}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:50px;font-weight:600;font-size:.9rem;border:2px solid transparent;cursor:pointer;touch-action:manipulation;min-height:44px}
.btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff}
.btn-accent{background:var(--accent);color:#fff}
.btn-outline{background:transparent;color:var(--primary);border-color:var(--primary)}
.section{padding:40px 0}
.section-alt{background:var(--bg)}
.section-header{text-align:center;margin-bottom:28px}
.section-title{font-size:1.45rem;font-weight:800;color:var(--text)}
.section-sub{color:var(--text-muted);font-size:.92rem}

/* ─────────────────────────────────────────────────────────────────────────────
   A-GRADE HIGH CLASS 360° AUTOROTATED BACKGROUND ANIMATION (DYNAMIC INDIAN THEME)
───────────────────────────────────────────────────────────────────────────── */
.search-section {
  position: relative !important;
  overflow: hidden !important;
  background: #061126 !important;
  padding: 58px 0 38px !important;
  color: #fff !important;
  contain: layout style;
}

/* 360 Degree Continuous Auto-Rotating Ambient Indian Spectrum Beam */
.search-section .hm-autorotate-bg {
  position: absolute;
  inset: -70%;
  width: 240%;
  height: 240%;
  background: conic-gradient(
    from 0deg at 50% 50%,
    rgba(15, 118, 110, 0.42) 0deg,
    rgba(30, 58, 138, 0.45) 55deg,
    rgba(13, 148, 136, 0.38) 115deg,
    rgba(2, 132, 199, 0.42) 175deg,
    rgba(109, 40, 217, 0.34) 235deg,
    rgba(245, 158, 11, 0.28) 295deg,
    rgba(15, 118, 110, 0.42) 360deg
  );
  filter: blur(75px);
  animation: hm360AutoRotateBeam 26s linear infinite;
  pointer-events: none;
  z-index: 1;
  will-change: transform;
}

@keyframes hm360AutoRotateBeam {
  0% { transform: rotate(0deg) scale(1.08); }
  50% { transform: rotate(180deg) scale(1.22); }
  100% { transform: rotate(360deg) scale(1.08); }
}

/* Floating luminous service glow orbs */
.search-section .hm-glow-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(50px);
  pointer-events: none;
  z-index: 2;
  opacity: 0.55;
  animation: hmFloatGlow 14s ease-in-out infinite alternate;
}
.search-section .hm-glow-orb-1 {
  width: 380px;
  height: 380px;
  top: -10%;
  left: 5%;
  background: radial-gradient(circle, rgba(14, 165, 233, 0.35) 0%, transparent 70%);
}
.search-section .hm-glow-orb-2 {
  width: 340px;
  height: 340px;
  bottom: -15%;
  right: 8%;
  background: radial-gradient(circle, rgba(16, 185, 129, 0.3) 0%, transparent 70%);
  animation-delay: -6s;
}

@keyframes hmFloatGlow {
  0% { transform: translate(0, 0) scale(1); }
  100% { transform: translate(40px, -30px) scale(1.15); }
}

@media (prefers-reduced-motion: reduce) {
  .search-section .hm-autorotate-bg,
  .search-section .hm-glow-orb {
    animation: none !important;
  }
}

.hero-container {
  position: relative !important;
  z-index: 5 !important;
}

.search-title {
  font-size: clamp(1.65rem, 5.2vw, 2.85rem) !important;
  font-weight: 900 !important;
  color: #ffffff !important;
  letter-spacing: -0.025em !important;
  line-height: 1.18 !important;
  margin-bottom: 12px !important;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5) !important;
}

.search-sub {
  color: #f1f5f9 !important;
  font-size: clamp(0.85rem, 3.2vw, 1rem) !important;
  max-width: 680px !important;
  margin: 0 auto 20px !important;
  line-height: 1.5 !important;
  opacity: 0.96;
}

/* Central Search Box matching image.png */
.search-box {
  background: #ffffff !important;
  border-radius: 18px !important;
  padding: 14px !important;
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(255, 255, 255, 0.25) !important;
  position: relative;
  z-index: 10;
}

.search-row .form-control {
  background: #f8fafc !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 12px !important;
  height: 50px !important;
  padding: 10px 14px 10px 44px !important;
  font-size: 16px !important;
  color: #0f172a !important;
  font-weight: 500 !important;
}
.search-row .form-control:focus {
  border-color: #0f766e !important;
  box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.15) !important;
  background: #ffffff !important;
}

.filter-row .form-select {
  background-color: #f8fafc !important;
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 10px !important;
  height: 48px !important;
  font-size: 14px !important;
  color: #0f172a !important;
  font-weight: 600 !important;
}

.search-btn {
  background: #0f766e !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  border-radius: 10px !important;
  height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
}
.search-btn:hover {
  background: #0d9488 !important;
  transform: translateY(-1px);
}

/* Indian Market Category Keyword Auto-Suggest Dropdown */
.hm-suggest-box {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
  border: 1px solid #cbd5e1;
  padding: 10px 8px;
  z-index: 1000;
  max-height: 340px;
  overflow-y: auto;
  text-align: left;
  display: none;
}
.hm-suggest-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  border-radius: 10px;
  color: #0f172a;
  text-decoration: none;
  font-size: 0.88rem;
  transition: background 0.15s ease;
  cursor: pointer;
}
.hm-suggest-item:hover, .hm-suggest-item.active {
  background: #f0fdfa;
  color: #0f766e;
}
.hm-suggest-tag {
  font-size: 0.72rem;
  font-weight: 800;
  padding: 2px 8px;
  border-radius: 6px;
  background: #ccfbf1;
  color: #0f766e;
}

/* Popular Cities with Yellow Badges matching image.png */
.popular-cities-bar .pop-city {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  transition: all 0.2s ease !important;
}
.popular-cities-bar .pop-city:hover {
  background: rgba(255, 255, 255, 0.28) !important;
  transform: translateY(-1px);
}
.popular-cities-bar .city-badge-yellow {
  background: #f59e0b !important;
  color: #0f172a !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  padding: 1px 6px !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
}

.search-title{font-size:1.6rem;font-weight:800;color:#fff;line-height:1.3}
.search-sub{color:rgba(255,255,255,.95);font-size:.95rem;margin-bottom:22px}
.search-box{background:var(--card-bg);border-radius:16px;padding:14px;box-shadow:var(--shadow-xl)}
.filter-row{display:flex;flex-direction:column;gap:10px;min-height:52px}
.filter-row .form-control,.filter-row .form-select{width:100%;height:48px;border-radius:10px;font-size:16px;color:var(--text);background:var(--bg);border:1.5px solid var(--border);}
.search-row .form-control{width:100%;height:48px;padding:10px 14px 10px 42px;border-radius:12px;border:1.5px solid var(--border);font-size:16px;color:var(--text);background:var(--bg);}
.search-row{position:relative;margin-bottom:10px;}
.search-row .input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-muted);}
@media(min-width:576px){.cat-grid{grid-template-columns:repeat(3,1fr)}.filter-row{flex-direction:row;flex-wrap:wrap}.filter-row .form-control,.filter-row .form-select{flex:1;min-width:130px}}
@media(min-width:768px){.cat-grid{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.cat-grid{grid-template-columns:repeat(6,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}

.home-faq-section{padding:56px 0 20px;background:var(--bg)}
.home-faq-wrapper{max-width:900px;margin:0 auto}
.home-faq-header{text-align:center;margin-bottom:32px}
.home-faq-badge{display:inline-flex;align-items:center;gap:6px;background:#ecfdf5;color:#0f766e;font-size:0.78rem;font-weight:700;padding:4px 14px;border-radius:9999px;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:10px;border:1px solid #a7f3d0}
.home-faq-title{font-size:clamp(1.4rem,3.6vw,1.85rem);font-weight:800;color:var(--text);margin-bottom:8px;letter-spacing:-0.02em}
.home-faq-subtitle{color:var(--text-muted);font-size:0.94rem;max-width:600px;margin:0 auto;line-height:1.5}
.home-faq-list{display:flex;flex-direction:column;gap:12px}
.home-faq-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 2px 8px rgba(15,23,42,0.03);transition:all 0.22s cubic-bezier(0.4,0,0.2,1)}
.home-faq-card:hover{border-color:#cbd5e1;box-shadow:0 6px 16px rgba(15,23,42,0.06)}
.home-faq-card[open]{border-color:var(--primary);box-shadow:0 8px 24px rgba(15,118,110,0.09)}
.home-faq-question{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;font-size:0.98rem;font-weight:700;color:var(--text);cursor:pointer;list-style:none;min-height:52px;user-select:none;touch-action:manipulation}
.home-faq-question::-webkit-details-marker{display:none}
.home-faq-chevron{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--bg-alt);color:var(--primary);font-size:1.15rem;transition:transform 0.25s ease,background 0.2s ease,color 0.2s ease;line-height:1;flex-shrink:0;margin-left:14px}
.home-faq-card[open] .home-faq-chevron{transform:rotate(180deg);background:var(--primary);color:#ffffff}
.home-faq-answer{padding:0 22px 20px;font-size:0.91rem;line-height:1.65;color:var(--text-muted);border-top:1px solid var(--border-light);margin-top:4px;padding-top:14px}
.home-faq-answer p{margin:0}
.home-faq-footer{text-align:center;margin-top:24px;padding-top:18px;border-top:1px dashed var(--border)}
.home-faq-cta{display:inline-flex;align-items:center;gap:8px;font-size:0.88rem;font-weight:700;color:var(--primary);text-decoration:none;padding:8px 18px;background:var(--primary-light);border-radius:9999px;transition:all 0.2s}
.home-faq-cta:hover{background:var(--primary);color:#ffffff;transform:translateY(-1px)}

/* Vendor Sliders Container */
.vendor-slider-wrapper{position:relative;margin:16px 0 24px;width:100%;overflow:hidden;}
.vendor-slider{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:10px;}
.vendor-slider::-webkit-scrollbar{display:none;}
.vendor-slide{flex:0 0 300px;max-width:320px;scroll-snap-align:start;}
@media(max-width:767px){.vendor-slide{flex:0 0 min(84vw,320px);}}
.slider-btn{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:#ffffff;box-shadow:0 4px 12px rgba(0,0,0,0.15);border:none;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:#0f172a;cursor:pointer;z-index:5;}
.slider-btn.prev{left:4px;}
.slider-btn.next{right:4px;}
.slider-dots{display:flex;justify-content:center;flex-wrap:wrap;gap:0;margin-top:8px;}
.slider-dots button{width:24px;height:24px;min-width:24px;border-radius:999px;background:transparent;border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;touch-action:manipulation;}
.slider-dots button::before{content:"";display:block;width:8px;height:8px;border-radius:999px;background:#94a3b8;transition:width .25s ease,background .2s ease;}
.slider-dots button.active::before{background:var(--primary);width:20px;}
.slider-toggle{display:flex;align-items:center;justify-content:center;margin:6px auto 0;min-height:28px;min-width:64px;padding:4px 14px;border-radius:999px;border:1px solid var(--border);background:var(--card-bg);color:var(--text);font-size:.74rem;font-weight:700;cursor:pointer;touch-action:manipulation;}
.slider-toggle:hover{border-color:var(--primary);color:var(--primary);}

/* Lead Card & Form */
.lead-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:20px;padding:28px 20px;max-width:720px;margin:0 auto;box-shadow:0 8px 30px rgba(0,0,0,0.06);}
.form-row{display:flex;flex-direction:column;gap:12px;margin-bottom:12px;}
@media(min-width:640px){.form-row{flex-direction:row;}.form-col{flex:1;}}
.form-group{margin-bottom:12px;}
.form-label{display:block;font-size:0.82rem;font-weight:700;color:var(--text);margin-bottom:4px;}
.lead-card .form-control,.lead-card .form-select{width:100%;height:46px;border-radius:10px;border:1.5px solid var(--border);padding:8px 14px;font-size:16px;color:var(--text);background:var(--bg);}
.lead-submit{width:100%;height:48px;font-size:0.95rem;font-weight:700;background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-radius:10px;}

/* Stats Bar */
.stats-bar{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;text-align:center;}
@media(min-width:768px){.stats-bar{grid-template-columns:repeat(4,1fr);}}
.stat-item{padding:16px;background:var(--card-bg);border:1px solid var(--border);border-radius:14px;}
.stat-num{font-size:1.8rem;font-weight:900;color:var(--primary);}
.stat-label{font-size:0.82rem;color:var(--text-muted);font-weight:600;}

/* Scrap CTA */
.scrap-cta{background:linear-gradient(135deg,#134e4a,#0f766e);color:#fff;padding:48px 0;text-align:center;}
.scrap-icon{margin-bottom:12px;color:#a7f3d0;}
.scrap-btns{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:18px;}

/* Steps */
.steps-grid{display:grid;grid-template-columns:1fr;gap:16px;}
@media(min-width:768px){.steps-grid{grid-template-columns:repeat(3,1fr);}}
.step-item{background:var(--card-bg);border:1.5px solid var(--border);border-radius:14px;padding:22px;display:flex;align-items:center;gap:14px;}
.step-num{width:42px;height:42px;border-radius:50%;background:var(--primary-light);color:var(--primary);font-size:1.2rem;font-weight:900;display:flex;align-items:center;justify-content:center;flex-shrink:0;}

/* Subscription Cards */
.card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;position:relative;}
.card-featured{border-color:var(--primary);box-shadow:0 8px 24px rgba(15,118,110,0.12);}
.popular-ribbon{position:absolute;top:12px;right:12px;background:var(--primary);color:#fff;font-size:0.7rem;font-weight:800;padding:3px 10px;border-radius:20px;text-transform:uppercase;}
.plan-price{font-size:2rem;font-weight:900;color:var(--text);margin:12px 0;}
.plan-feature{font-size:0.86rem;color:var(--text-muted);display:flex;align-items:center;gap:8px;justify-content:center;margin-bottom:8px;}
.btn-block{width:100%;}
/* ==============================================================================
   v2 A-GRADE ENHANCEMENT LAYER — additive only, overrides nothing structural
   Accessibility (WCAG 2.2 AA) • Premium modern UI • Mobile-first polish
   ============================================================================== */
.visually-hidden,.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.skip-link{position:absolute;left:12px;top:-80px;z-index:10050;background:#0f172a;color:#fff!important;padding:12px 18px;border-radius:12px;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.3);transition:top .2s ease}
.skip-link:focus,.skip-link:focus-visible{top:12px}
main:focus{outline:none}
.text-center{text-align:center}

/* Focus visibility for every interactive element (2.4.7 / 2.4.11) */
:where(button,[role="button"],input,select,textarea,summary,[tabindex]:not([tabindex="-1"])):focus-visible{outline:3px solid var(--primary);outline-offset:2px}
.search-section :where(a,button):focus-visible,.scrap-cta :where(a,button):focus-visible,.offer-card :where(a,button):focus-visible,.hero-banner-slider :where(a,button):focus-visible{outline:3px solid #ffffff;outline-offset:2px;box-shadow:0 0 0 6px rgba(2,6,23,.6)}
.home-faq-question:focus-visible{outline:3px solid var(--primary);outline-offset:-3px;border-radius:16px}

/* Forms */
::placeholder{color:#64748b;opacity:1}
input[type="search"]{-webkit-appearance:none;appearance:none}
input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
.form-control,.form-select{transition:border-color .18s ease,box-shadow .18s ease}
.form-control:focus,.form-select:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px rgba(15,118,110,.18);outline:none}
.form-control:user-invalid{border-color:#b91c1c!important}
.form-hint{display:block;margin-top:4px;font-size:.76rem;color:var(--text-muted)}
.lead-message.is-success{color:#047857}
.lead-message.is-error{color:#b91c1c}
[data-theme="dark"] .lead-message.is-success{color:#6ee7b7}
[data-theme="dark"] .lead-message.is-error{color:#fca5a5}
.lead-submit[aria-busy="true"]{opacity:.75;cursor:progress}

/* Premium hero */
.search-section{position:relative;overflow:hidden;background:radial-gradient(900px 420px at 8% -12%,rgba(20,184,166,.38),transparent 62%),radial-gradient(760px 380px at 100% 0%,rgba(59,130,246,.34),transparent 60%),linear-gradient(135deg,#0b1224 0%,#1e3a8a 55%,#0f766e 100%);padding:56px 0 32px}
.search-section .container{position:relative;z-index:1}
.search-title{font-size:clamp(1.6rem,5.2vw,2.6rem);letter-spacing:-.02em;line-height:1.15;text-wrap:balance;margin-bottom:10px}
.search-sub{max-width:640px;margin-left:auto;margin-right:auto;text-wrap:pretty}
.search-section .hero-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;margin-bottom:14px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.24);color:#fff;font-size:.78rem;font-weight:700;letter-spacing:.02em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.search-box{border:1px solid rgba(255,255,255,.6);box-shadow:0 24px 60px -20px rgba(2,6,23,.6),0 0 0 6px rgba(255,255,255,.08)}
.search-btn{transition:transform .18s ease,box-shadow .18s ease}
.search-btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px -10px rgba(15,118,110,.8)}
.hero-btn{transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.hero-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -10px rgba(0,0,0,.5)}
.hero-btn--ghost:hover{background:rgba(255,255,255,.28)!important}
.pop-tag{display:inline-flex;align-items:center;min-height:28px;transition:background .18s ease,transform .18s ease}
.pop-tag:hover{background:rgba(255,255,255,.34)!important;color:#fff!important;transform:translateY(-1px)}
.hero-banner-slider{border:1px solid rgba(255,255,255,.14)}
.hero-banner-kicker{white-space:normal;text-align:center}
.hero-banner-cta{white-space:normal;text-align:center;transition:transform .18s ease}

/* Section headings with accent bar */
.section-header .section-title{letter-spacing:-.02em;text-wrap:balance}
.section-header .section-title::after{content:"";display:block;width:44px;height:4px;margin:10px auto 0;border-radius:4px;background:linear-gradient(90deg,var(--primary),#14b8a6)}
.section-sub{max-width:680px;margin-left:auto;margin-right:auto;text-wrap:pretty}
.view-all{min-height:28px}
.view-all:hover{text-decoration:underline;text-underline-offset:3px}

/* Category & service chips */
.cat-chip{box-shadow:0 1px 2px rgba(15,23,42,.04);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.cat-chip:hover{transform:translateY(-3px);box-shadow:0 14px 28px -14px rgba(15,118,110,.45)}
.cat-chip:focus-visible{box-shadow:var(--focus-ring)}

/* Stats */
.stat-item{background:linear-gradient(180deg,var(--card-bg),var(--bg-alt));box-shadow:0 1px 2px rgba(15,23,42,.04);transition:transform .18s ease}
.stat-item:hover{transform:translateY(-2px)}
.stat-num{letter-spacing:-.02em}

/* Vendor & product cards */
.vendor-card{border-radius:18px}
.vendor-card:focus-within{box-shadow:0 0 0 3px var(--primary),0 12px 28px rgba(15,23,42,.1)}
.vendor-name{font-size:1.05rem}
.vendor-actions .btn.is-disabled{opacity:.5;pointer-events:none;filter:grayscale(.4)}
.vendor-slide .empty-state{background:var(--card-bg);border:1.5px dashed var(--border);border-radius:16px;padding:28px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%}
.vendor-slide .empty-state .icon{font-size:2rem;line-height:1}
.vendor-slide .empty-state h3{font-size:1rem;font-weight:800;color:var(--text)}
.vendor-slide .empty-state p{font-size:.86rem;color:var(--text-muted)}
.slider-btn{transition:transform .18s ease,box-shadow .18s ease}
.slider-btn:hover{box-shadow:0 8px 20px rgba(0,0,0,.2)}

/* Offers */
.offer-card{transition:transform .2s ease,box-shadow .2s ease}
.offer-card:hover{transform:translateY(-3px)}
@media(max-width:400px){.offer-card-row{flex-direction:column-reverse}}

/* Steps, plans, FAQ */
.step-item{transition:transform .18s ease,box-shadow .18s ease}
.step-item:hover{transform:translateY(-2px);box-shadow:0 12px 28px -16px rgba(15,23,42,.35)}
.step-content h3{font-size:1rem;font-weight:800;color:var(--text);margin-bottom:2px}
.step-content p{font-size:.88rem;color:var(--text-muted)}
.card{transition:transform .18s ease,box-shadow .18s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 36px -18px rgba(15,23,42,.35)}

/* Dark-mode contrast safety */
[data-theme="dark"] .view-all,[data-theme="dark"] .product-category-link{color:#5eead4!important}
[data-theme="dark"] .stat-num{color:#5eead4}
[data-theme="dark"] .cat-chip [style*="#047857"]{color:#6ee7b7!important}

/* Performance: skip rendering of far-below-the-fold sections until needed */
.hm-cv{content-visibility:auto;contain-intrinsic-size:auto 640px}

/* Mobile-first polish + notch safe areas */
.container{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
@media(max-width:575px){
  .section{padding:32px 0}
  .section-title{font-size:1.3rem}
  .search-section{padding:40px 0 24px}
  .hero-actions .btn{flex:1 1 calc(50% - 10px)}
  .vendor-actions .btn{font-size:.8rem!important}
  .lead-card{padding:22px 16px}
}
@media(hover:none){.cat-chip:hover,.card:hover,.step-item:hover,.offer-card:hover,.stat-item:hover,.vendor-card:hover{transform:none}}

/* Motion & high-contrast preferences */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
@media (forced-colors: active){
  .btn,.cat-chip,.vendor-card,.hero-banner-dots button,.slider-dots button{border:1px solid CanvasText}
  .hero-banner-dots button.active::before,.slider-dots button.active::before{background:Highlight}
}
@property --hm-base{syntax:"<color>";inherits:true;initial-value:#061126}
@property --hm-o1{syntax:"<color>";inherits:true;initial-value:#f59e0b}
@property --hm-o2{syntax:"<color>";inherits:true;initial-value:#0284c7}
.search-section.hm-hero-themed{background:var(--hm-base)!important;isolation:isolate;--hm-speed:1;--hm-alpha:38%;--hm-alpha2:26%;--primary:var(--hm-btn-a);--primary-dark:var(--hm-btn-b);transition:--hm-base 1.6s ease,--hm-o1 1.6s ease,--hm-o2 1.6s ease}
.hm-hero-themed[data-hm-speed="slow"]{--hm-speed:1.7}
.hm-hero-themed[data-hm-speed="fast"]{--hm-speed:.6}
.hm-hero-themed[data-hm-intensity="low"]{--hm-alpha:26%;--hm-alpha2:18%}
.hm-hero-themed[data-hm-intensity="high"]{--hm-alpha:46%;--hm-alpha2:32%}

/* Two colour layers that cross-fade (opacity only = composited, no repaint storms) */
.search-section.hm-hero-themed .hm-autorotate-bg{inset:auto;top:-50%;left:-50%;width:200%;height:200%;filter:none;animation:none;opacity:0;transition:opacity 1.8s ease;will-change:opacity,transform;z-index:1;
  background:
    radial-gradient(closest-side at 30% 32%,color-mix(in srgb,var(--l1) var(--hm-alpha),transparent),transparent),
    radial-gradient(closest-side at 70% 30%,color-mix(in srgb,var(--l2) var(--hm-alpha),transparent),transparent),
    radial-gradient(closest-side at 68% 70%,color-mix(in srgb,var(--l3) var(--hm-alpha),transparent),transparent),
    radial-gradient(closest-side at 32% 68%,color-mix(in srgb,var(--l4) var(--hm-alpha2),transparent),transparent)}
.search-section .hm-layer-a{--l1:var(--hm-a1);--l2:var(--hm-a2);--l3:var(--hm-a3);--l4:var(--hm-a4)}
.search-section .hm-layer-b{--l1:var(--hm-b1);--l2:var(--hm-b2);--l3:var(--hm-b3);--l4:var(--hm-b4)}
.hm-hero-themed[data-hm-front="a"] .hm-layer-a,.hm-hero-themed[data-hm-front="b"] .hm-layer-b{opacity:1}
.hm-fx-aurora.hm-anim-on .hm-autorotate-bg{animation:hmAuroraSpin calc(36s * var(--hm-speed)) linear infinite}
@keyframes hmAuroraSpin{0%{transform:rotate(0deg) scale(1)}50%{transform:rotate(180deg) scale(1.12)}100%{transform:rotate(360deg) scale(1)}}

/* Glow orbs follow the active theme (blur removed: radial fade already soft = cheaper paint) */
.search-section.hm-hero-themed .hm-glow-orb{filter:none;opacity:.6;animation:none;will-change:transform}
.search-section.hm-hero-themed .hm-glow-orb-1{background:radial-gradient(circle,color-mix(in srgb,var(--hm-o1) 30%,transparent) 0%,transparent 70%)}
.search-section.hm-hero-themed .hm-glow-orb-2{background:radial-gradient(circle,color-mix(in srgb,var(--hm-o2) 32%,transparent) 0%,transparent 70%)}
.hm-hero-themed.hm-anim-on .hm-glow-orb{animation:hmFloatGlow calc(14s * var(--hm-speed)) ease-in-out infinite alternate}
.hm-hero-themed.hm-anim-on .hm-glow-orb-2{animation-delay:-6s}

/* Rangoli / mandala motif (Indian heritage pattern) */
.hm-mandala{--mz:min(620px,130vw);position:absolute;width:var(--mz);height:var(--mz);top:calc(50% - var(--mz) / 2);right:calc(var(--mz) / -3);z-index:2;color:var(--hm-o1);opacity:.13;pointer-events:none;will-change:transform}
.hm-anim-on .hm-mandala{animation:hmMandalaSpin calc(120s * var(--hm-speed)) linear infinite}
@keyframes hmMandalaSpin{to{transform:rotate(360deg)}}

/* Flowing waves */
.hm-waves{position:absolute;left:0;right:0;bottom:0;height:clamp(44px,8vw,96px);z-index:2;pointer-events:none;overflow:hidden}
.hm-waves svg{position:absolute;bottom:0;left:0;width:200%;height:100%;will-change:transform}
.hm-waves .hm-wave-1{fill:color-mix(in srgb,var(--hm-o2) 22%,transparent)}
.hm-waves .hm-wave-2{fill:color-mix(in srgb,var(--hm-o1) 14%,transparent);height:78%}
.hm-anim-on .hm-wave-1{animation:hmWave calc(18s * var(--hm-speed)) linear infinite}
.hm-anim-on .hm-wave-2{animation:hmWave calc(28s * var(--hm-speed)) linear infinite reverse}
@keyframes hmWave{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Diya sparkles */
.hm-sparkles{position:absolute;inset:0;z-index:2;pointer-events:none}
.hm-sparkles i{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--hm-o1);box-shadow:0 0 10px 2px color-mix(in srgb,var(--hm-o1) 60%,transparent);opacity:.25;will-change:transform,opacity}
.hm-sparkles i:nth-child(1){left:6%;top:18%}.hm-sparkles i:nth-child(2){left:14%;top:62%;animation-delay:-1.2s!important}
.hm-sparkles i:nth-child(3){left:23%;top:34%;animation-delay:-2.6s!important}.hm-sparkles i:nth-child(4){left:31%;top:82%;animation-delay:-.7s!important}
.hm-sparkles i:nth-child(5){left:42%;top:12%;animation-delay:-3.3s!important}.hm-sparkles i:nth-child(6){left:52%;top:72%;animation-delay:-1.9s!important}
.hm-sparkles i:nth-child(7){left:61%;top:26%;animation-delay:-4.1s!important}.hm-sparkles i:nth-child(8){left:70%;top:56%;animation-delay:-.3s!important}
.hm-sparkles i:nth-child(9){left:79%;top:16%;animation-delay:-2.2s!important}.hm-sparkles i:nth-child(10){left:86%;top:78%;animation-delay:-3.8s!important}
.hm-sparkles i:nth-child(11){left:93%;top:40%;animation-delay:-1.5s!important}.hm-sparkles i:nth-child(12){left:48%;top:46%;animation-delay:-2.9s!important}
.hm-anim-on .hm-sparkles i{animation:hmTwinkle calc(4.8s * var(--hm-speed)) ease-in-out infinite}
@keyframes hmTwinkle{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:.85;transform:scale(1.15)}}

/* Readability scrim: keeps white text >= 7:1 on every theme */
.hm-hero-scrim{position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(2,6,23,.30) 0%,rgba(2,6,23,0) 32%,rgba(2,6,23,0) 68%,rgba(2,6,23,.38) 100%)}

/* Themed hero accents (original markup untouched) */
.hm-hero-themed .hero-badge{border-color:color-mix(in srgb,var(--hm-o1) 55%,transparent)!important}
.hm-hero-themed .hero-banner-slider{background:linear-gradient(135deg,color-mix(in srgb,var(--hm-base) 60%,var(--hm-btn-a)) 0%,var(--hm-btn-a) 55%,var(--hm-btn-b) 100%)}
.search-section.hm-hero-themed .search-btn{background:linear-gradient(135deg,var(--hm-btn-a),var(--hm-btn-b))!important}
.search-section.hm-hero-themed .search-btn:hover{background:var(--hm-btn-b)!important;box-shadow:0 10px 22px -10px color-mix(in srgb,var(--hm-btn-a) 80%,transparent)}

/* Visitor theme picker + motion pause (WCAG 2.2: 40px targets, focus rings, keyboard) */
.hm-theme-bar{position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:14px}
.hm-theme-pick{position:static}
.hm-theme-btn{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:6px 16px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:rgba(2,6,23,.5);color:#fff;font:600 .8rem/1.2 var(--font);cursor:pointer;touch-action:manipulation;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .18s ease,border-color .18s ease}
.hm-theme-btn:hover{background:rgba(2,6,23,.72);border-color:rgba(255,255,255,.55)}
.hm-theme-btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
.hm-theme-dot{width:16px;height:16px;border-radius:50%;border:2px solid #fff;flex:0 0 16px;background:conic-gradient(var(--hm-btn-a),var(--hm-o1),var(--hm-o2),var(--hm-btn-a))}
.hm-motion-icon{display:inline-flex;gap:3px}
.hm-motion-icon i{display:block;width:3px;height:11px;border-radius:2px;background:currentColor}
.hm-motion-paused .hm-motion-icon i:last-child{display:none}
.hm-motion-paused .hm-motion-icon i:first-child{width:0;height:0;border-radius:0;background:none;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent currentColor}
.hm-theme-panel{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);width:min(92vw,360px);z-index:20;padding:14px;border-radius:16px;background:rgba(2,6,23,.95);border:1px solid rgba(255,255,255,.18);box-shadow:0 24px 60px -16px rgba(0,0,0,.7);text-align:left}
.hm-theme-panel[hidden]{display:none!important}
.hm-theme-panel fieldset{border:0;margin:0;padding:0;min-width:0}
.hm-theme-panel legend{font-size:.8rem;font-weight:700;color:#e2e8f0;margin-bottom:10px;padding:0}
.hm-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
.hm-sw{position:relative;display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 10px;border-radius:12px;cursor:pointer;color:#f8fafc;font-size:.82rem;font-weight:600;touch-action:manipulation}
.hm-sw:hover{background:rgba(255,255,255,.08)}
.hm-sw input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.hm-sw-chip{position:relative;flex:0 0 28px;width:28px;height:28px;border-radius:50%;border:2px solid rgba(255,255,255,.35)}
.hm-sw-auto{background:conic-gradient(#ea580c,#be185d,#1d4ed8,#0e7490,#15803d,#b45309,#ea580c)}
.hm-sw input:checked + .hm-sw-chip{border-color:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.35)}
.hm-sw input:checked + .hm-sw-chip::after{content:"";position:absolute;left:8px;top:4px;width:7px;height:12px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg);filter:drop-shadow(0 0 2px rgba(0,0,0,.8))}
.hm-sw input:checked ~ .hm-sw-name{text-decoration:underline;text-underline-offset:3px}
.hm-sw input:focus-visible + .hm-sw-chip{outline:3px solid #fff;outline-offset:3px}

/* Pause states: user pause, off-screen, hidden tab */
.hm-hero-themed.hm-motion-paused :is(.hm-autorotate-bg,.hm-glow-orb,.hm-mandala,.hm-waves svg,.hm-sparkles i),
.hm-hero-themed.hm-offscreen :is(.hm-autorotate-bg,.hm-glow-orb,.hm-mandala,.hm-waves svg,.hm-sparkles i){animation-play-state:paused!important}

/* Mobile-first tuning */
@media (max-width:767px){
  .hm-mandala{--mz:150vw;right:auto;left:calc(50% - var(--mz) / 2);top:calc(var(--mz) / -2.4);opacity:.09}
  .search-section.hm-hero-themed .hm-glow-orb{width:240px;height:240px}
}
/* Lite mode (Save-Data / <=2GB RAM): keep colours, drop extra layers */
.hm-lite .hm-waves,.hm-lite .hm-sparkles,.hm-lite .hm-glow-orb-2{display:none}
.hm-lite.hm-anim-on .hm-mandala{animation:none}
@media (prefers-reduced-motion:reduce){
  .hm-hero-themed :is(.hm-autorotate-bg,.hm-glow-orb,.hm-mandala,.hm-waves svg,.hm-sparkles i){animation:none!important}
  .search-section.hm-hero-themed,.search-section.hm-hero-themed .hm-autorotate-bg{transition:none!important}
}
@media (forced-colors:active){
  .hm-hero-themed :is(.hm-autorotate-bg,.hm-glow-orb,.hm-mandala,.hm-waves,.hm-sparkles,.hm-hero-scrim){display:none}
  .hm-theme-btn,.hm-sw-chip{border:1px solid CanvasText}
}
@media print{.hm-theme-bar,.hm-hero-themed :is(.hm-autorotate-bg,.hm-glow-orb,.hm-mandala,.hm-waves,.hm-sparkles){display:none}}

/* =====================================================================
   HM DESIGN UPGRADE v2 — visual layer only (append-only, no logic)
   Same brand colours (teal + amber). Removing this block restores v1.
   ===================================================================== */
:root{--hm2-grad:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 55%,#14b8a6 100%);--hm2-grad-accent:linear-gradient(135deg,#f59e0b 0%,var(--accent) 100%);--hm2-ring:0 0 0 1px rgba(15,118,110,.08);--hm2-shadow:0 1px 2px rgba(15,23,42,.04),0 8px 24px -8px rgba(15,23,42,.10);--hm2-shadow-hover:0 2px 4px rgba(15,23,42,.05),0 18px 40px -12px rgba(15,118,110,.28);--hm2-ease:cubic-bezier(.2,.7,.2,1)}
::selection{background:rgba(15,118,110,.18)}

/* Section rhythm + headings */
.section{padding-block:clamp(40px,6vw,72px)}
.section-alt{background:linear-gradient(180deg,var(--bg-alt) 0%,var(--bg) 100%)}
.section-header{margin-bottom:clamp(20px,3vw,32px)}
.section-title,.home-faq-title{font-weight:800;letter-spacing:-.02em;line-height:1.2;font-size:clamp(1.4rem,1.1rem + 1.4vw,2.1rem)}
.section-title::after{content:"";display:block;width:56px;height:4px;margin-top:10px;border-radius:99px;background:var(--hm2-grad-accent)}
.text-center .section-title::after,.section-title.text-center::after{margin-inline:auto}
.section-sub{color:var(--text-muted);font-size:clamp(.95rem,.9rem + .2vw,1.05rem);max-width:62ch}
.text-center .section-sub,.section-sub.text-center{margin-inline:auto}

/* Buttons */
.btn{border-radius:12px;font-weight:700;letter-spacing:.01em;transition:transform .2s var(--hm2-ease),box-shadow .2s var(--hm2-ease),background-color .2s,filter .2s;min-height:44px}
.btn-primary{background:var(--hm2-grad)!important;border-color:transparent!important;color:#fff!important;box-shadow:0 6px 18px -6px rgba(15,118,110,.55)}
.btn-accent{background:var(--hm2-grad-accent)!important;border-color:transparent!important;color:#fff!important;box-shadow:0 6px 18px -6px rgba(180,83,9,.5)}
.btn:hover{transform:translateY(-2px)}
.btn-primary:hover,.btn-accent:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:focus-visible,.cat-chip:focus-visible,.shop-chip:focus-visible,.home-faq-question:focus-visible{outline:none;box-shadow:var(--focus-ring)}

/* Cards (services, vendors, products, plans) */
.card,.vendor-card,.ps-card,.lead-card,.step-item,.stat-item,.home-faq-card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--hm2-shadow);transition:transform .25s var(--hm2-ease),box-shadow .25s var(--hm2-ease),border-color .25s}
.card:hover,.vendor-card:hover,.ps-card:hover,.step-item:hover{transform:translateY(-4px);box-shadow:var(--hm2-shadow-hover);border-color:rgba(15,118,110,.35)}
.vendor-card-img img,.ps-card img{transition:transform .5s var(--hm2-ease)}
.vendor-card:hover .vendor-card-img img,.ps-card:hover img{transform:scale(1.05)}
.vendor-name{font-weight:700;letter-spacing:-.01em}
.vendor-badge,.badge-featured,.pop-tag,.tag{border-radius:999px;font-weight:700}
.badge-featured{background:var(--hm2-grad-accent)!important;color:#fff!important}
.card-featured{border:2px solid var(--primary)!important;box-shadow:0 20px 50px -18px rgba(15,118,110,.45)!important}
.popular-ribbon{background:var(--hm2-grad-accent)!important;color:#fff!important;font-weight:800;letter-spacing:.04em}
.plan-price{font-weight:800;letter-spacing:-.02em;background:var(--hm2-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.plan-feature svg{color:var(--success)}

/* Category / shop chips */
.cat-chip,.shop-chip{border-radius:16px;border:1px solid var(--border);background:var(--card-bg);transition:transform .2s var(--hm2-ease),box-shadow .2s,border-color .2s,background .2s}
.cat-chip:hover,.shop-chip:hover{transform:translateY(-3px);border-color:var(--primary);background:var(--primary-light);box-shadow:var(--hm2-shadow-hover)}
.cat-chip-icon,.shop-chip-icon{border-radius:14px;background:var(--primary-light);color:var(--primary)}
.cat-chip-name,.shop-chip-text{font-weight:600}

/* Stats */
.stat-item{padding:18px 12px}
.stat-num{font-weight:800;letter-spacing:-.02em;background:var(--hm2-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{color:var(--text-muted);font-weight:600;font-size:.9rem}

/* How it works */
.step-num{background:var(--hm2-grad)!important;color:#fff!important;border-radius:14px;box-shadow:0 8px 20px -8px rgba(15,118,110,.6);font-weight:800}

/* Scrap CTA */
.scrap-cta .container>*{border-radius:var(--radius-xl)}

/* Search */
.search-box{border-radius:20px;box-shadow:0 20px 50px -20px rgba(15,23,42,.25)}
.search-btn{background:var(--hm2-grad)!important;color:#fff!important;border-radius:12px}

/* Forms */
.form-control,.form-select{border-radius:12px;border:1.5px solid var(--border);min-height:46px;transition:border-color .2s,box-shadow .2s;background-color:var(--card-bg);color:var(--text)}
.form-control:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(15,118,110,.15);outline:none}
.form-label{font-weight:600;color:var(--text)}
.lead-card{padding:clamp(20px,4vw,40px);border-radius:var(--radius-xl)}

/* FAQ */
.home-faq-card{overflow:hidden}
.home-faq-card[open]{border-color:var(--primary);box-shadow:var(--hm2-shadow-hover)}
.home-faq-question{font-weight:700;cursor:pointer}
.home-faq-badge{border-radius:999px;background:var(--primary-light);color:var(--primary);font-weight:700}

/* Slider controls + view all */
.slider-btn{border-radius:999px;box-shadow:var(--hm2-shadow);transition:transform .2s,background .2s}
.slider-btn:hover{transform:scale(1.08);background:var(--primary);color:#fff}
.view-all{font-weight:700;color:var(--primary)}
.view-all:hover{text-decoration:underline;text-underline-offset:4px}

/* Floating buttons */
.fab{box-shadow:0 12px 28px -8px rgba(15,23,42,.35);transition:transform .2s var(--hm2-ease)}
.fab:hover{transform:translateY(-3px) scale(1.04)}

/* Footer */
.site-footer{border-top:3px solid transparent;border-image:var(--hm2-grad) 1}

/* Dark theme tuning */
[data-theme="dark"] .card,[data-theme="dark"] .vendor-card,[data-theme="dark"] .ps-card,[data-theme="dark"] .step-item,[data-theme="dark"] .stat-item,[data-theme="dark"] .home-faq-card,[data-theme="dark"] .lead-card{box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 10px 30px -12px rgba(0,0,0,.6)}
[data-theme="dark"] .cat-chip-icon,[data-theme="dark"] .shop-chip-icon,[data-theme="dark"] .home-faq-badge{color:#5eead4}

/* Mobile comfort */
@media (max-width:640px){.btn{min-height:48px}.card:hover,.vendor-card:hover,.ps-card:hover,.step-item:hover,.cat-chip:hover,.shop-chip:hover{transform:none}}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion:reduce){.btn,.card,.vendor-card,.ps-card,.step-item,.cat-chip,.shop-chip,.fab,.slider-btn,.vendor-card-img img,.ps-card img{transition:none!important;transform:none!important}}
/* ===== end HM DESIGN UPGRADE v2 ===== */