/* =====================================================================
   NEPLIZ DESIGN SYSTEM
   Module 1 — foundation tokens + header/footer/nav.
   Every later module (homepage, directory, business profile, dashboards)
   must reuse these CSS variables and component classes rather than
   introducing new colors/spacing values, to keep the platform visually
   consistent as it grows.
===================================================================== */

:root{
  /* Color tokens — blended palette: the warm marigold/cream identity from
     Module 1, plus a vivid crimson primary accent and deep navy hero/footer
     surfaces (inspired by the community's own Replit prototype) so the
     brand feels both distinctly Nepali (marigold, rhododendron) and
     confidently modern (crimson CTA, navy depth, mountain motif). */
  --nz-ink:      #1C2B4A;
  --nz-dusk:     #1B2A52;
  --nz-dusk-2:   #101B36;
  --nz-crimson:      #D6293C;  /* primary CTA / accent — buttons, badges, links */
  --nz-crimson-dark: #B01D2E;
  --nz-marigold: #E8A33D;      /* secondary warm accent — featured tags, icons */
  --nz-marigold-dark: #C8811F;
  --nz-rhodo:    #C1443C;      /* tertiary — discount ribbons, small accents */
  --nz-cream:    #FBF6EC;
  --nz-cream-2:  #F3ECDC;
  --nz-slate:    #5B6472;
  --nz-line:     #E2D9C6;
  --nz-white:    #FFFFFF;

  /* Layout tokens */
  --nz-radius:    14px;
  --nz-radius-lg: 20px;
  --nz-shadow:    0 8px 24px rgba(28,43,74,0.08);
  --nz-shadow-lg: 0 20px 48px rgba(28,43,74,0.18);
  --nz-maxw:      1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--nz-cream);
  color:var(--nz-ink);
  font-family:'Manrope',sans-serif;
  -webkit-font-smoothing:antialiased;
  padding-bottom:0;
}
body.has-mobile-bottom-nav{padding-bottom:76px;}
h1,h2,h3,h4,.font-display{font-family:'Fraunces',serif;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}
img{max-width:100%;display:block;}
.wrap{max-width:var(--nz-maxw);margin:0 auto;padding:0 20px;}
:focus-visible{outline:3px solid var(--nz-marigold-dark);outline-offset:2px;}

.screen-reader-text{
  position:absolute !important;width:1px;height:1px;overflow:hidden;
  clip:rect(1px,1px,1px,1px);white-space:nowrap;border:0;
}
.skip-link{
  position:fixed;top:-100px;left:10px;background:var(--nz-ink);color:var(--nz-cream);
  padding:12px 20px;border-radius:8px;z-index:9999;transition:top .2s ease;
}
.skip-link:focus{position:fixed;top:10px;width:auto;height:auto;clip:auto;overflow:visible;}

@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important;scroll-behavior:auto !important;}
}

/* ---------- BUTTONS (shared across all modules) ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:10px 18px;border-radius:999px;font-weight:700;font-size:.88rem;
  border:none;transition:transform .15s ease, box-shadow .15s ease;
  white-space:nowrap;
}
.btn:hover{transform:translateY(-1px);}
.btn-primary{background:var(--nz-crimson);color:var(--nz-white);box-shadow:0 4px 14px rgba(214,41,60,.35);}
.btn-primary:hover{background:var(--nz-crimson-dark);}
.btn-secondary{background:var(--nz-marigold);color:var(--nz-ink);box-shadow:0 4px 14px rgba(232,163,61,.4);}
.btn-secondary:hover{background:var(--nz-marigold-dark);}
.btn-ghost{background:transparent;color:var(--nz-dusk);border:1.5px solid var(--nz-line);}
.btn-ghost:hover{border-color:var(--nz-dusk);}
.btn-ghost-light{background:transparent;color:var(--nz-white);border:1.5px solid rgba(255,255,255,.35);}
.btn-ghost-light:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn-dark{background:var(--nz-ink);color:var(--nz-cream);}
.btn-dark:hover{background:var(--nz-dusk-2);}
.btn-block{width:100%;}

/* ---------- TOP NAVIGATION ---------- */
#nepliz-topnav{
  position:sticky;top:0;z-index:500;
  background:rgba(251,246,236,0.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--nz-line);
}
#nepliz-topnav .bar{display:flex;align-items:center;gap:18px;height:72px;}
.brand{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-weight:700;font-size:1.4rem;color:var(--nz-ink);flex-shrink:0;}
.brand .mark{
  width:36px;height:36px;border-radius:10px;
  background:linear-gradient(155deg,var(--nz-crimson),var(--nz-marigold));
  display:flex;align-items:center;justify-content:center;color:white;
  font-weight:800;font-size:.95rem;font-family:'Manrope',sans-serif;flex-shrink:0;
}
.nav-links-wrap{display:flex;flex:1;}
.nav-links{list-style:none;display:flex;gap:26px;align-items:center;margin:0 0 0 8px;padding:0;}
.nav-links li a{font-weight:600;font-size:.92rem;color:var(--nz-dusk);padding:6px 2px;border-bottom:2px solid transparent;display:inline-block;}
.nav-links li a:hover{border-color:var(--nz-crimson);}
#nepliz-topnav.is-scrolled{box-shadow:0 4px 20px rgba(28,43,74,.08);}

.nav-search{flex:1;display:flex;justify-content:center;}
.nav-search-inner{
  display:flex;align-items:center;gap:8px;background:var(--nz-white);
  border:1px solid var(--nz-line);border-radius:999px;padding:8px 16px;
  width:100%;max-width:380px;
}
.nav-search-inner input{border:none;outline:none;background:transparent;font-family:inherit;font-size:.9rem;width:100%;color:var(--nz-ink);}

.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.hamburger{display:none;background:none;border:none;padding:6px;}
.hamburger span{display:block;width:24px;height:2.5px;background:var(--nz-ink);margin:5px 0;border-radius:2px;}

.mobile-menu{
  display:none;flex-direction:column;background:var(--nz-white);
  border-top:1px solid var(--nz-line);padding:10px 20px 20px;
}
.mobile-menu.is-open{display:flex;}
.mobile-menu-links{list-style:none;margin:0;padding:0;}
.mobile-menu-links li a,
.mobile-menu-link{
  display:block;padding:14px 0;font-weight:700;color:var(--nz-ink);
  border-bottom:1px solid var(--nz-line);
}
.mobile-menu-link--accent{color:var(--nz-rhodo);}

/* ---------- SHARED SECTION / CARD PRIMITIVES (used from Module 2 on) ---------- */
section{padding:64px 0;}
.eyebrow-sm{color:var(--nz-crimson);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;display:block;}
.eyebrow-light{
  display:inline-flex;align-items:center;gap:8px;background:rgba(232,163,61,.15);
  border:1px solid rgba(232,163,61,.4);color:var(--nz-marigold);padding:6px 16px;
  border-radius:999px;font-size:.78rem;font-weight:700;letter-spacing:.04em;
  text-transform:uppercase;
}
.empty{text-align:center;padding:60px 20px;color:var(--nz-slate);}
.empty .ic{font-size:2.5rem;margin-bottom:12px;}

/* ---------- FOOTER ---------- */
#nepliz-footer{background:var(--nz-dusk-2);color:#C9D2E4;padding:50px 0 40px;margin-top:40px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;}
.footer-col h4{color:white;font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;margin:0 0 14px;}
.footer-col a{display:block;color:#AAB6CC;font-size:.85rem;margin-bottom:9px;}
.footer-col a:hover{color:var(--nz-marigold);}
.brand--footer{color:white;margin-bottom:12px;}
.footer-col--brand p{color:#AAB6CC;font-size:.85rem;max-width:280px;line-height:1.6;margin:0;}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.1);margin-top:36px;padding-top:20px;
  font-size:.78rem;color:#8593AD;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:10px;
}

/* ---------- MOBILE BOTTOM NAV ---------- */
.mobile-bottom-nav{
  display:none;position:fixed;bottom:0;left:0;right:0;background:var(--nz-white);
  border-top:1px solid var(--nz-line);z-index:500;padding:8px 0;
  box-shadow:0 -4px 16px rgba(0,0,0,.06);
}
.mobile-bottom-nav .wrap{display:flex;justify-content:space-around;padding:0 10px;}
.mnav-item{
  background:none;border:none;display:flex;flex-direction:column;align-items:center;
  gap:3px;font-size:.65rem;font-weight:700;color:var(--nz-slate);padding:4px 8px;
}
.mnav-item--active{color:var(--nz-crimson);}
.mnav-item .ic{font-size:1.2rem;}

/* =====================================================================
   MODULE 2 — HOMEPAGE
===================================================================== */

/* ---------- HERO ---------- */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(180deg,var(--nz-dusk) 0%,var(--nz-dusk-2) 100%);
  color:var(--nz-cream);padding:64px 0 0;
}
.hero-mountains{
  position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;
  opacity:.9;pointer-events:none;
}
.hero .wrap{position:relative;z-index:2;text-align:center;padding-bottom:56px;}
.hero h1{
  font-size:clamp(2.1rem,5vw,3.6rem);line-height:1.08;font-weight:600;
  margin:22px auto 18px;max-width:760px;
}
.hero h1 em{font-style:italic;color:var(--nz-marigold);}
.hero p.sub{color:#C9D2E4;font-size:1.08rem;max-width:520px;margin:0 auto 34px;}

.hero-search{
  max-width:680px;margin:0 auto;background:var(--nz-white);border-radius:16px;
  padding:10px;display:flex;gap:8px;box-shadow:var(--nz-shadow-lg);flex-wrap:wrap;
}
.hero-search .field{
  flex:1;min-width:180px;display:flex;align-items:center;gap:10px;padding:8px 14px;
}
.hero-search .field + .field{border-left:1px solid var(--nz-line);}
.hero-search input{border:none;outline:none;font-family:inherit;font-size:.95rem;color:var(--nz-ink);background:transparent;width:100%;}
.hero-search .field span.ic{opacity:.5;flex-shrink:0;}
.hero-search button{flex-shrink:0;}

.hero-quicklinks{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px;flex-wrap:wrap;font-size:.85rem;}
.hero-quicklinks span.label{color:#9FACC7;}
.hero-quicklinks a{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
  padding:6px 14px;border-radius:999px;color:var(--nz-cream);font-weight:600;
}
.hero-quicklinks a:hover{background:rgba(255,255,255,.16);}

.hero-stats{display:flex;justify-content:center;gap:44px;margin-top:44px;flex-wrap:wrap;position:relative;z-index:2;}
.hero-stats div{text-align:center;}
.hero-stats b{display:block;font-family:'Fraunces',serif;font-size:1.7rem;color:var(--nz-marigold);}
.hero-stats span{font-size:.8rem;color:#B7C1D6;text-transform:uppercase;letter-spacing:.04em;}

/* ---------- SECTION HEADERS ---------- */
.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:32px;gap:20px;flex-wrap:wrap;}
.section-head h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:600;margin:0 0 6px;}
.section-head p{color:var(--nz-slate);margin:0;max-width:520px;}

/* ---------- CATEGORY GRID ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;}
.cat-card{
  background:var(--nz-white);border:1px solid var(--nz-line);border-radius:var(--nz-radius);
  padding:20px 16px;text-align:left;transition:transform .15s ease, box-shadow .15s ease, border-color .15s;
  display:block;
}
.cat-card:hover{transform:translateY(-3px);box-shadow:var(--nz-shadow);border-color:var(--nz-crimson);}
.cat-card .ic{
  width:40px;height:40px;border-radius:10px;display:flex;align-items:center;
  justify-content:center;font-size:1.3rem;margin-bottom:14px;background:var(--nz-cream-2);
}
.cat-card b{display:block;font-size:.95rem;margin-bottom:3px;color:var(--nz-ink);}
.cat-card span{font-size:.78rem;color:var(--nz-slate);}

/* ---------- BUSINESS CARDS ---------- */
.biz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px;}
.biz-card{
  background:var(--nz-white);border:1px solid var(--nz-line);border-radius:var(--nz-radius);
  overflow:hidden;display:flex;flex-direction:column;transition:transform .15s ease,box-shadow .15s ease;
}
.biz-card:hover{transform:translateY(-4px);box-shadow:var(--nz-shadow-lg);}
.biz-cover{
  height:130px;background:linear-gradient(135deg,var(--nz-dusk),var(--nz-dusk-2));
  position:relative;display:flex;align-items:center;justify-content:center;font-size:2.2rem;
  background-size:cover;background-position:center;
}
.biz-badge-featured{
  position:absolute;top:10px;left:10px;background:var(--nz-marigold);color:var(--nz-ink);
  font-size:.68rem;font-weight:800;padding:4px 10px;border-radius:999px;text-transform:uppercase;
}
.biz-badge-deal{
  position:absolute;top:10px;right:10px;background:var(--nz-crimson);color:white;
  font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:999px;
}
.biz-body{padding:16px 18px 18px;flex:1;display:flex;flex-direction:column;gap:6px;}
.biz-cat{font-size:.72rem;font-weight:700;color:var(--nz-marigold-dark);text-transform:uppercase;letter-spacing:.03em;}
.biz-name{font-family:'Fraunces',serif;font-size:1.12rem;font-weight:600;margin:0;color:var(--nz-ink);}
.biz-loc{font-size:.82rem;color:var(--nz-slate);display:flex;align-items:center;gap:5px;}
.biz-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;}
.biz-offer{font-size:.78rem;font-weight:700;color:var(--nz-crimson);}

/* ---------- DEALS / COUPON STRIP ---------- */
.deal-card{
  display:flex;align-items:center;gap:16px;background:var(--nz-white);
  border:1px solid var(--nz-line);border-left:4px solid var(--nz-crimson);
  border-radius:var(--nz-radius);padding:16px 18px;
}
.deal-card .deal-icon{
  width:52px;height:52px;border-radius:12px;background:var(--nz-cream-2);
  display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex-shrink:0;
}
.deal-card .deal-title{font-weight:700;font-size:.95rem;color:var(--nz-ink);margin:0 0 2px;}
.deal-card .deal-sub{font-size:.8rem;color:var(--nz-slate);margin:0;}
.deal-card .deal-tag{
  margin-left:auto;background:var(--nz-cream-2);color:var(--nz-crimson);font-weight:800;
  font-size:.75rem;padding:5px 10px;border-radius:8px;flex-shrink:0;
}

/* ---------- CTA BAND ---------- */
.cta-band{
  background:linear-gradient(120deg,var(--nz-crimson) 0%,var(--nz-crimson-dark) 100%);
  border-radius:24px;padding:48px;color:white;display:flex;align-items:center;
  justify-content:space-between;gap:24px;flex-wrap:wrap;
}
.cta-band h2{margin:0 0 10px;color:white;}
.cta-band p{color:rgba(255,255,255,.85);margin:0;max-width:480px;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
  .nav-links-wrap, .nav-search{display:none;}
  .hamburger{display:block;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:640px){
  body{padding-bottom:78px;}
  .mobile-bottom-nav{display:block;}
  .footer-grid{grid-template-columns:1fr;}
  .nav-actions .btn span.txt{display:none;}
  #nepliz-topnav .bar{gap:10px;}
  .hero-search{flex-direction:column;}
  .hero-search .field + .field{border-left:none;border-top:1px solid var(--nz-line);}
  .hero-stats{gap:26px;}
  .cta-band{padding:32px 24px;text-align:center;justify-content:center;}
  .deal-card{flex-wrap:wrap;}
}
