/* Generated from docs/design-system/bazar-redesign/nz-redesign.css by tests/website-ui/local/sync-design-system.php
   (dark selector mapped to [data-nzc-mode="dark"], inline SVG scenes dropped). Edit nz-shell.css for site-specific changes. */
/* Niazchi — Bazar Classic redesign. RTL first, logical properties only.
   Needs tokens.css (the system's tokens). Class prefix: nz- */

:root {
  --nz-scene: none;
  --nz-ease: cubic-bezier(.22, 1, .36, 1);
  --nz-spring: cubic-bezier(.34, 1.56, .64, 1);
}
[data-nzc-mode="dark"] { --nz-scene: none; }

.nz, .nz * { box-sizing: border-box; }
.nz {
  direction: rtl; font-family: var(--font-body); color: var(--text); background: var(--bg);
  font-size: 15px; line-height: 1.9; -webkit-font-smoothing: antialiased;
}
.nz h1, .nz h2, .nz h3, .nz h4 { font-family: var(--font-display); margin: 0; line-height: 1.35; font-weight: 900; }
.nz p { margin: 0; }
.nz a { color: inherit; text-decoration: none; }
.nz button, .nz input, .nz select, .nz textarea { font: inherit; color: inherit; }
.nz :focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; }
.nz-ic { width: 1.25em; height: 1.25em; flex: none; display: block; }
[data-i] { display: inline-flex; line-height: 0; }
.nz-wrap { max-width: var(--container); margin-inline: auto; padding-inline: var(--space-5); }
.nz-muted { color: var(--text-2); }
.nz-red { color: var(--primary-text); }
.nz-num { font-family: var(--font-display); font-weight: 900; }

/* ---------------- Buttons ---------------- */
.nz-btn {
  --h: 46px;
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: var(--h); padding-inline: 22px; border-radius: var(--r-s); border: 1.5px solid transparent;
  font-family: var(--font-display); font-weight: 800; font-size: 16px; white-space: nowrap; cursor: pointer;
  transition: transform .45s var(--nz-spring), box-shadow .3s var(--nz-ease), background-color .2s, border-color .2s, color .2s;
}
.nz-btn .nz-ic { width: 20px; height: 20px; }
.nz-btn:hover { transform: translateY(-2px); }
.nz-btn:active { transform: translateY(0) scale(.98); }
.nz-btn--primary { background: var(--primary); color: var(--primary-ink); box-shadow: var(--shadow-red); }
.nz-btn--primary:hover { background: var(--primary-hover); }
.nz-btn--outline { background: var(--surface); color: var(--text); border-color: var(--line-strong); }
.nz-btn--outline:hover { border-color: var(--text); box-shadow: var(--shadow-1); }
.nz-btn--ghost { background: transparent; color: var(--text); border-color: var(--line); }
.nz-btn--danger { background: var(--primary-soft); color: var(--danger); border-color: var(--danger); }
.nz-btn--pill { border-radius: var(--r-pill); }
.nz-btn--sm { --h: 36px; padding-inline: 14px; font-size: 14px; }
.nz-btn--lg { --h: 56px; padding-inline: 28px; font-size: 19px; border-radius: 12px; }
.nz-btn--block { width: 100%; }
.nz-iconbtn {
  width: 40px; height: 40px; border-radius: 50%; display: inline-grid; place-items: center; border: 1px solid var(--line);
  background: var(--surface); color: var(--text); box-shadow: var(--shadow-1); cursor: pointer;
  transition: transform .45s var(--nz-spring), color .2s;
}
.nz-iconbtn:hover { transform: scale(1.08); color: var(--primary-text); }
.nz-iconbtn .nz-ic { width: 20px; height: 20px; }

/* "مشاهده همه" pill link */
.nz-more {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: var(--r-pill);
  border: 1px solid var(--line); background: var(--surface); color: var(--primary-text); font-size: 13px; font-weight: 700;
  transition: background-color .2s, gap .3s var(--nz-ease);
}
.nz-more .nz-ic { width: 14px; height: 14px; }
.nz-more:hover { background: var(--primary-soft); gap: 10px; }

/* ---------------- Badges ---------------- */
.nz-badge {
  display: inline-flex; align-items: center; gap: 6px; height: 30px; padding-inline: 12px; border-radius: var(--r-s);
  border: 1.5px solid currentColor; font-size: 14px; font-weight: 800; font-family: var(--font-display); white-space: nowrap;
}
.nz-badge .nz-ic { width: 17px; height: 17px; }
.nz-badge--pending { color: var(--warn); background: var(--warn-soft); }
.nz-badge--rejected { color: var(--danger); background: var(--primary-soft); }
.nz-badge--approved { color: var(--success); background: var(--success-soft); }
.nz-badge--verified { color: var(--success); background: var(--success-soft); border-radius: var(--r-pill); }
.nz-badge--sm { height: 22px; padding-inline: 8px; font-size: 11.5px; border-width: 1px; gap: 4px; }
.nz-badge--sm .nz-ic { width: 13px; height: 13px; }
.nz-chip {
  position: absolute; display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: var(--r-xs);
  font-size: 12px; font-weight: 700; line-height: 1.7; background: rgba(255,255,255,.92); color: #2b1d16;
}
.nz-chip--vip { background: var(--primary); color: #fff; inset-block-start: 10px; inset-inline-start: 10px; }
.nz-chip--vip .nz-crown { color: var(--gold); width: 15px; height: 15px; }
.nz-chip--cat { inset-block-end: 10px; inset-inline-end: 10px; }
.nz-chip--count { inset-block-end: 10px; inset-inline-end: 10px; background: rgba(20,12,8,.72); color: #fff; border: 1px solid rgba(255,255,255,.7); }
.nz-cat-a { background: #e7f6ec; color: #17602f; }
.nz-cat-b { background: #fbe7d6; color: #8a3b06; }
.nz-cat-c { background: #ece6fb; color: #4b2a9c; }
.nz-cat-d { background: #fde5e8; color: #9c1026; }

/* ---------------- Header ---------------- */
.nz-top { font-size: 13px; color: var(--text-2); }
.nz-top__row { display: flex; align-items: center; justify-content: space-between; height: 36px; }
.nz-top__links { display: flex; gap: 0; }
.nz-top__links a { padding-inline: 12px; }
.nz-top__links a + a { border-inline-start: 1px solid var(--line); }
.nz-top__links a:hover { color: var(--primary-text); }
.nz-weather { display: inline-flex; align-items: center; gap: 8px; }
.nz-weather .nz-sun { color: var(--gold); width: 22px; height: 22px; }
.nz-weather b { font-family: var(--font-display); color: var(--text); font-size: 14px; }

.nz-head { position: relative; }
.nz-head--scene { background: var(--nz-scene) center bottom / cover no-repeat, var(--bg); }
.nz-head--scene::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, var(--bg) 0%, color-mix(in srgb, var(--bg) 82%, transparent) 55%, color-mix(in srgb, var(--bg) 35%, transparent) 100%); pointer-events: none; }
.nz-head > * { position: relative; }
.nz-head__main { display: flex; align-items: center; gap: 22px; padding-block: 14px; }
.nz-brand { white-space: nowrap; display: flex; align-items: center; gap: 12px; margin-inline-end: auto; }
.nz-brand__mark { width: 52px; height: 60px; object-fit: contain; }
[data-nzc-mode="dark"] .nz-brand__mark, [data-nzc-mode="dark"] .nz-inkmark { filter: invert(.92) sepia(.3); }
.nz-brand__name { font-family: var(--font-display); font-weight: 900; font-size: 30px; line-height: 1.1; color: var(--primary-text); display: block; }
.nz-brand__tag { font-size: 12.5px; color: var(--text-2); display: block; margin-top: 4px; }
.nz-head__tools { display: flex; align-items: center; gap: 12px; }
.nz-date { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-2); }
.nz-date .nz-ic { width: 18px; height: 18px; }
.nz-select {
  display: inline-flex; align-items: center; gap: 10px; height: 44px; padding-inline: 14px; border-radius: var(--r-s);
  border: 1.5px solid var(--line-strong); background: var(--surface); font-weight: 800; font-family: var(--font-display); font-size: 15px; cursor: pointer;
}
.nz-select .nz-ic { width: 18px; height: 18px; }
.nz-nav { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0; padding-block: 8px; border-block-start: 1px solid var(--line); font-weight: 700; font-size: 15px; }
.nz-nav a { display: inline-flex; align-items: center; gap: 8px; padding: 4px 16px; position: relative; transition: color .2s; }
.nz-nav a + a::before { content: ''; position: absolute; inset-inline-start: 0; top: 28%; height: 44%; border-inline-start: 1px solid var(--line-strong); }
.nz-nav a:hover { color: var(--primary-text); }
.nz-nav__all { color: var(--primary-text); font-family: var(--font-display); font-weight: 900; }
.nz-nav__all .nz-ic { width: 20px; height: 20px; }
.nz-nav--main { flex-wrap: nowrap; }
.nz-nav--main a { white-space: nowrap; font-family: var(--font-display); font-weight: 800; padding-block: 10px; }
.nz-nav--main a.is-active { color: var(--primary-text); }
.nz-nav--main a.is-active::after { content: ''; position: absolute; inset-inline: 16px; bottom: 0; height: 3px; border-radius: 3px; background: var(--primary); }
.nz-nav--main a + a::before { display: none; }
.nz-headsearch { display: flex; justify-content: center; gap: 10px; padding-block: 4px 18px; }
.nz-headsearch .nz-input { max-width: 480px; height: 46px; box-shadow: var(--shadow-1); }
.nz-divider { height: 3px; border-block: 1px solid var(--line-strong); }

/* ---------------- Inputs ---------------- */
.nz-field { display: flex; flex-direction: column; gap: 8px; }
.nz-label { font-weight: 800; font-family: var(--font-display); font-size: 15px; }
.nz-input {
  display: flex; align-items: center; gap: 10px; width: 100%; height: 56px; padding-inline: 16px; border-radius: 12px;
  border: 1.5px solid var(--line-strong); background: var(--surface); transition: border-color .2s, box-shadow .2s;
}
.nz-input:focus-within { border-color: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.nz-input input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 16px; }
.nz-input input::placeholder { color: var(--text-2); }
.nz-input .nz-ic { width: 20px; height: 20px; color: var(--text-2); }
.nz-input__prefix { align-self: stretch; display: flex; align-items: center; padding-inline-start: 16px; margin-inline-start: auto; border-inline-start: 1.5px solid var(--line); font-family: var(--font-latin); font-weight: 700; direction: ltr; }
.nz-check { display: inline-flex; align-items: center; gap: 12px; font-size: 15px; cursor: pointer; }
.nz-check__box { width: 26px; height: 26px; border-radius: var(--r-xs); display: grid; place-items: center; border: 1.5px solid var(--line-strong); background: var(--surface); color: #fff; }
.nz-check__box.is-on { background: var(--primary); border-color: var(--primary); }
.nz-check__box .nz-ic { width: 18px; height: 18px; stroke-width: 2.6; }
.nz-check a { color: var(--primary-text); font-weight: 700; }

/* ---------------- Hero + search ---------------- */
.nz-hero { position: relative; background: var(--nz-scene) center bottom / cover no-repeat, var(--bg); padding-block-end: 36px; overflow: hidden; }
.nz-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(to left, color-mix(in srgb, var(--bg) 88%, transparent) 0%, color-mix(in srgb, var(--bg) 55%, transparent) 42%, transparent 70%), linear-gradient(to bottom, var(--bg) 0%, transparent 22%, transparent 78%, var(--bg) 100%); }
.nz-hero > * { position: relative; }
.nz-hero__copy { padding-block: 34px 26px; max-width: 620px; }
.nz-kicker { font-family: var(--font-display); font-weight: 800; color: var(--primary-text); font-size: 18px; }
.nz-hero h1 { font-size: 56px; line-height: 1.25; margin-block: 6px 12px; }
.nz-hero h1 em { font-style: normal; color: var(--primary-text); }
.nz-hero__lead { font-size: 17px; color: var(--text); opacity: .85; }
.nz-search {
  display: grid; grid-template-columns: 1.1fr 2.4fr 1.4fr auto; gap: 12px; align-items: stretch; padding: 14px;
  border-radius: var(--r-l); background: color-mix(in srgb, var(--surface) 92%, transparent); box-shadow: var(--shadow-2); backdrop-filter: blur(8px);
}
.nz-search__f { display: flex; flex-direction: column; justify-content: center; gap: 0; padding: 6px 14px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--surface); }
.nz-search__f small { font-size: 12px; color: var(--text-2); display: flex; align-items: center; gap: 5px; }
.nz-search__f small .nz-ic { width: 14px; height: 14px; color: var(--primary-text); }
.nz-search__f b { display: flex; align-items: center; justify-content: space-between; font-family: var(--font-display); font-size: 16px; }
.nz-search__f b .nz-ic { width: 18px; height: 18px; color: var(--text-2); }
.nz-search__q { display: flex; align-items: center; gap: 10px; padding-inline: 16px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--surface); color: var(--text-2); }
.nz-search__q .nz-ic { width: 22px; height: 22px; }
.nz-search .nz-btn { height: auto; min-height: 58px; padding-inline: 34px; font-size: 18px; }

/* ---------------- Channels ---------------- */
.nz-channels { display: grid; grid-template-columns: 1.3fr repeat(4, 1fr); gap: 12px; align-items: center; margin-top: 18px; padding: 12px; border-radius: var(--r-l); background: color-mix(in srgb, var(--surface) 88%, transparent); box-shadow: var(--shadow-1); }
.nz-channels__intro b { display: block; font-family: var(--font-display); color: var(--primary-text); font-size: 17px; }
.nz-channels__intro span { font-size: 12.5px; color: var(--text-2); }
.nz-channel { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: var(--r-m); border: 1px solid var(--line); background: var(--surface); transition: transform .45s var(--nz-spring), box-shadow .3s; }
.nz-channel:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
.nz-channel__ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; color: #fff; flex: none; }
.nz-channel__ic .nz-ic { width: 24px; height: 24px; }
.nz-channel b { display: block; font-family: var(--font-display); font-size: 18px; line-height: 1.2; }
.nz-channel span { font-size: 12.5px; color: var(--text-2); }
.nz-ch-telegram .nz-channel__ic { background: var(--telegram); } .nz-ch-telegram b { color: #1476a8; }
.nz-ch-eitaa .nz-channel__ic { background: var(--eitaa); } .nz-ch-eitaa b { color: #b8470c; }
.nz-ch-bale .nz-channel__ic { background: var(--bale); } .nz-ch-bale b { color: #0e7a52; }
.nz-ch-rubika .nz-channel__ic { background: var(--rubika); } .nz-ch-rubika b { color: #5b2fb0; }
[data-nzc-mode="dark"] .nz-channel b { color: var(--text); }

/* ---------------- Category tiles ---------------- */
.nz-cats { display: grid; grid-template-columns: repeat(14, 1fr); gap: 10px; padding: 14px; border-radius: var(--r-l); background: var(--surface); box-shadow: var(--shadow-1); border: 1px solid var(--line); }
.nz-cat { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 12px 4px; border-radius: var(--r-m); text-align: center; font-size: 12.5px; font-weight: 700; line-height: 1.5; transition: background-color .2s, transform .45s var(--nz-spring); cursor: pointer; }
.nz-cat .nz-ic { width: 30px; height: 30px; stroke-width: 1.6; }
.nz-cat:hover { background: var(--primary-soft); transform: translateY(-3px); }
.nz-c1 { color: #c8102e; } .nz-c2 { color: #1d6fd1; } .nz-c3 { color: #b85c00; } .nz-c4 { color: #6b3fc9; }
.nz-c5 { color: #0f8a61; } .nz-c6 { color: #d1335a; } .nz-c7 { color: #0a7fa6; } .nz-c8 { color: #3f8a1d; }
[data-nzc-mode="dark"] .nz-c1 { color: #ff7d88; } [data-nzc-mode="dark"] .nz-c2 { color: #7fb4ff; } [data-nzc-mode="dark"] .nz-c3 { color: #f5a54d; } [data-nzc-mode="dark"] .nz-c4 { color: #b99bff; }
[data-nzc-mode="dark"] .nz-c5 { color: #5dd0a4; } [data-nzc-mode="dark"] .nz-c6 { color: #ff8fab; } [data-nzc-mode="dark"] .nz-c7 { color: #6fd0f0; } [data-nzc-mode="dark"] .nz-c8 { color: #9bd46f; }
.nz-cat span:last-child { color: var(--text); }

/* Big tile (post-ad step 1) */
.nz-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; position: relative; min-height: 88px; padding: 12px;
  border-radius: var(--r-m); border: 1.5px solid var(--line); background: var(--surface); font-family: var(--font-display); font-weight: 800; font-size: 16px; cursor: pointer;
  transition: border-color .2s, box-shadow .3s, transform .45s var(--nz-spring);
}
.nz-tile:hover { border-color: var(--primary); box-shadow: var(--shadow-2); transform: translateY(-2px); }
.nz-tile.is-on { border-color: var(--primary); background: var(--primary-soft); }
.nz-tile__ic { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: currentColor; }
.nz-tile__ic .nz-ic { width: 22px; height: 22px; color: #fff; }
.nz-tile__ic.nz-soft { background: color-mix(in srgb, currentColor 13%, transparent); }
.nz-tile__ic.nz-soft .nz-ic { color: inherit; }
.nz-tile__go { position: absolute; inset-inline-end: 12px; top: 50%; translate: 0 -50%; width: 16px; height: 16px; color: var(--text-2); }
.nz-tile__label { color: var(--text); }

/* ---------------- Section frame ---------------- */
.nz-panel { position: relative; border-radius: var(--r-l); background: var(--surface-3); border: 1px solid var(--line); padding: 18px; box-shadow: var(--shadow-1); }
.nz-panel--orn::before, .nz-panel--orn::after { content: ''; position: absolute; top: 0; width: 120px; height: 120px; background: var(--nz-orn, none) center / 220px; opacity: .1; pointer-events: none; mask: radial-gradient(circle at var(--o, 100%) 0, #000 20%, transparent 70%); }
.nz-panel--orn::before { inset-inline-start: 0; --o: 100%; }
.nz-panel--orn::after { inset-inline-end: 0; --o: 0%; }
.nz-sechead { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; margin-bottom: 16px; }
.nz-sechead__t { text-align: center; }
.nz-sechead__t h2 { display: inline-flex; align-items: center; gap: 10px; font-size: 28px; }
.nz-sechead__t h2 .nz-ic { width: 36px; height: 36px; }
.nz-sechead__t p { font-size: 13px; color: var(--text-2); }
.nz-sechead__rule { display: flex; align-items: center; gap: 10px; }
.nz-sechead__rule::before { content: ''; flex: 1; max-width: 70px; height: 2px; border-radius: 2px; background: var(--gold); margin-inline-start: auto; }
.nz-sechead__rule--end { justify-content: flex-end; }
.nz-sechead__rule--end::before { display: none; }
.nz-sechead__rule--end::after { content: ''; width: 70px; height: 2px; border-radius: 2px; background: var(--gold); }
.nz-sechead__side { display: flex; }
.nz-sechead__side--end { justify-content: flex-end; }
.nz-crown-ic { color: var(--gold); }
.nz-send-ic { color: var(--primary-text); }

/* ---------------- Ad card ---------------- */
.nz-ad { display: flex; flex-direction: column; border-radius: var(--r-m); background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-1); overflow: hidden; transition: transform .5s var(--nz-spring), box-shadow .35s var(--nz-ease); }
.nz-ad:hover { transform: translateY(-5px); box-shadow: var(--shadow-2); }
.nz-ad__media { position: relative; margin: 8px 8px 0; border-radius: var(--r-s); overflow: hidden; aspect-ratio: 16 / 10; }
.nz-ad__fav { position: absolute; inset-block-start: 10px; inset-inline-end: 10px; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.92); color: #2b1d16; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.nz-ad__fav .nz-ic { width: 17px; height: 17px; }
.nz-ad__body { padding: 10px 12px 12px; display: flex; flex-direction: column; gap: 2px; }
.nz-ad__title { font-family: var(--font-display); font-weight: 800; font-size: 16px; line-height: 1.6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nz-ad__loc { display: flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--text-2); }
.nz-ad__loc .nz-ic { width: 14px; height: 14px; }
.nz-ad__price { margin-top: 6px; font-family: var(--font-display); font-weight: 900; font-size: 18px; color: var(--primary-text); }
.nz-ad__price small { font-size: 13px; font-weight: 800; }
.nz-ad--sm .nz-ad__title { font-size: 14.5px; }
.nz-ad--sm .nz-ad__price { font-size: 16px; }

/* Thumbnail art: stands in for the seller's photo (real listings show their own image with object-fit: cover). */
.nz-thumb { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; }
.nz-thumb img { width: 100%; height: 100%; object-fit: cover; }
.nz-thumb .nz-ic { width: 44%; height: 70%; stroke-width: 1.1; color: rgba(255,255,255,.95); filter: drop-shadow(0 6px 10px rgba(0,0,0,.18)); position: relative; }
.nz-thumb::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 70% 25%, rgba(255,255,255,.35), transparent 55%); }
.nz-t-home { background: linear-gradient(145deg, #e7b88a, #b0643a); }
.nz-t-car { background: linear-gradient(145deg, #b9c6d3, #56697d); }
.nz-t-phone { background: linear-gradient(145deg, #9db5dc, #3a5a8f); }
.nz-t-farm { background: linear-gradient(145deg, #e59c7f, #b33a24); }
.nz-t-sofa { background: linear-gradient(145deg, #d1b08f, #7d5436); }
.nz-t-laptop { background: linear-gradient(145deg, #a8a2d6, #4c4390); }
.nz-t-town { background: linear-gradient(145deg, #f0cf9f, #c1864f); }
.nz-t-town .nz-ic { color: #6b3f1c; }

/* ---------------- Carousel ---------------- */
.nz-carousel { position: relative; }
.nz-carousel__track { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.nz-carousel__nav { position: absolute; top: 50%; translate: 0 -50%; z-index: 2; color: var(--primary-text); }
.nz-carousel__nav--prev { inset-inline-start: -20px; }
.nz-carousel__nav--next { inset-inline-end: -20px; }

/* ---------------- Promo banner ---------------- */
.nz-promo { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 120px; padding: 22px 40px; border-radius: var(--r-l); overflow: hidden; color: #fff; background: var(--deep); }
.nz-promo::before { content: ''; position: absolute; inset: 0; background: var(--nz-scene) left bottom / auto 150% no-repeat; opacity: .55; mix-blend-mode: luminosity; }
.nz-promo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to left, var(--deep) 30%, color-mix(in srgb, var(--deep) 40%, transparent) 75%); }
.nz-promo > * { position: relative; z-index: 1; }
.nz-promo h3 { font-size: 30px; color: #fff; }
.nz-promo p { color: #f6dfe0; font-size: 16px; }
.nz-promo .nz-btn { background: transparent; color: #fff; border-color: rgba(255,255,255,.85); }
.nz-promo .nz-btn:hover { background: rgba(255,255,255,.12); }

/* ---------------- Side boxes ---------------- */
.nz-biz { border-radius: var(--r-l); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-1); overflow: hidden; }
.nz-biz__head { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.nz-biz__tab { display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px; border-radius: 10px; background: var(--primary); color: #fff; font-family: var(--font-display); font-weight: 800; font-size: 15px; }
.nz-biz__tab .nz-ic { width: 17px; height: 17px; }
.nz-biz__row { display: grid; grid-template-columns: 1fr 72px; gap: 12px; align-items: center; padding: 12px; }
.nz-biz__row + .nz-biz__row { border-top: 1px solid var(--line); }
.nz-biz__row b { display: block; font-family: var(--font-display); font-size: 15.5px; line-height: 1.5; }
.nz-biz__row > div > span { font-size: 12px; color: var(--text-2); display: block; }
.nz-biz__meta { display: flex; align-items: center; gap: 10px; margin-top: 4px; font-size: 12px; color: var(--text-2); }
.nz-biz__img { position: relative; width: 72px; height: 58px; border-radius: 10px; overflow: hidden; }
.nz-ai { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px; border-radius: var(--r-l); overflow: hidden; color: #fff; background: linear-gradient(120deg, #b3102b, #7d1420); box-shadow: var(--shadow-2); }
.nz-ai img { width: 78px; height: auto; flex: none; }
.nz-ai b { display: block; font-family: var(--font-display); font-size: 18px; }
.nz-ai p { font-size: 12.5px; opacity: .9; margin-bottom: 8px; }
.nz-ai .nz-btn { background: #fff; color: var(--deep); }

/* ---------------- Stats strip ---------------- */
.nz-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-radius: var(--r-l); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-1); }
.nz-stat { display: flex; align-items: center; justify-content: center; gap: 14px; padding: 14px; }
.nz-stat + .nz-stat { border-inline-start: 1px solid var(--line); }
.nz-stat__ic { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary-text); }
.nz-stat__ic .nz-ic { width: 24px; height: 24px; }
.nz-stat b { display: block; font-family: var(--font-display); font-weight: 900; font-size: 22px; color: var(--primary-text); line-height: 1.2; }
.nz-stat span { font-size: 12.5px; color: var(--text-2); }

/* ---------------- Chips row / popular searches ---------------- */
.nz-popular { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 16px; border-radius: var(--r-l); border: 1px solid var(--line); background: var(--surface); }
.nz-popular__t { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); font-weight: 900; font-size: 16px; color: var(--primary-text); margin-inline-end: 10px; }
.nz-popular__t .nz-ic { width: 20px; height: 20px; color: #e8621a; }
.nz-pill { padding: 5px 16px; border-radius: var(--r-pill); border: 1px solid var(--line); background: var(--surface-3); font-size: 13px; font-weight: 600; transition: background-color .2s, color .2s, border-color .2s; }
.nz-pill:hover { background: var(--primary-soft); color: var(--primary-text); border-color: var(--primary); }

/* Areas strip */
.nz-areas { display: grid; grid-template-columns: repeat(8, 1fr); gap: 12px; }
.nz-area { border-radius: var(--r-m); border: 1px solid var(--line); background: var(--surface); overflow: hidden; text-align: center; font-size: 12.5px; font-weight: 700; box-shadow: var(--shadow-1); }
.nz-area__img { position: relative; height: 58px; }
.nz-area span { display: block; padding: 4px; }

/* Steps (how it works) */
.nz-how { display: grid; grid-template-columns: auto repeat(3, 1fr) auto; gap: 0; align-items: center; padding: 16px 20px; border-radius: var(--r-l); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-1); }
.nz-how__step { display: flex; align-items: center; gap: 12px; padding-inline: 16px; margin-inline-start: 16px; border-inline-start: 1px dashed var(--line-strong); }
.nz-how__ic { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--primary); color: #fff; box-shadow: var(--shadow-red); flex: none; }
.nz-how__ic .nz-ic { width: 24px; height: 24px; }
.nz-how b { white-space: nowrap; display: block; font-family: var(--font-display); font-size: 16px; }
.nz-how__step span span, .nz-how > div span { white-space: nowrap; }
.nz-how span { font-size: 12.5px; color: var(--text-2); }

/* ---------------- Stepper ---------------- */
.nz-steps { display: flex; justify-content: space-between; position: relative; padding-inline: 40px; }
.nz-steps::before { content: ''; position: absolute; top: 20px; inset-inline: 90px; border-top: 2px dotted var(--line-strong); }
.nz-step { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 15px; color: var(--text-2); font-weight: 600; background: transparent; }
.nz-step__dot { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--bg); border: 2px solid var(--line-strong); font-family: var(--font-display); font-weight: 900; font-size: 17px; color: var(--text); }
.nz-step.is-on { color: var(--primary-text); font-weight: 800; font-family: var(--font-display); }
.nz-step.is-on .nz-step__dot { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 0 0 5px var(--primary-soft); }
.nz-step.is-done .nz-step__dot { background: var(--success); border-color: var(--success); color: #fff; }

/* ---------------- Cards / panels (forms) ---------------- */
.nz-card { position: relative; border-radius: var(--r-l); border: 1px solid var(--line); background: var(--surface); box-shadow: var(--shadow-1); padding: var(--space-5); overflow: hidden; }
.nz-card--orn::before { content: ''; position: absolute; inset-block-start: 0; inset-inline-start: 0; width: 170px; height: 150px; background: var(--nz-orn, none) 0 0 / 360px; opacity: .12; pointer-events: none; -webkit-mask: radial-gradient(circle at 0 0, #000 10%, transparent 70%); mask: radial-gradient(circle at 0 0, #000 10%, transparent 70%); }
[dir="rtl"] .nz-card--orn::before, .nz .nz-card--orn::before { -webkit-mask: radial-gradient(circle at 100% 0, #000 10%, transparent 70%); mask: radial-gradient(circle at 100% 0, #000 10%, transparent 70%); }
[data-nzc-mode="dark"] .nz-card--orn::before, [data-nzc-mode="dark"] .nz-panel--orn::before, [data-nzc-mode="dark"] .nz-panel--orn::after { filter: invert(1); }
.nz-card__tab { position: absolute; inset-block-start: 0; inset-inline-start: 50%; display: inline-flex; align-items: center; gap: 8px; }
.nz-card h2 { font-size: 22px; }
.nz-card h2 + p { font-size: 13px; color: var(--text-2); }

/* Login */
.nz-login { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.nz-login__card { padding: 40px 32px 22px; border-radius: var(--r-l); }
.nz-login__tag { position: absolute; top: -1px; inset-inline-start: 50%; translate: 50% 0; }
.nz-login__tagwrap { display: flex; justify-content: center; margin-top: -40px; margin-bottom: 14px; }
.nz-login__tagwrap span { display: inline-flex; align-items: center; gap: 8px; padding: 8px 22px; border-radius: 0 0 14px 14px; border: 1px solid var(--line); border-top: 0; background: var(--surface-3); font-weight: 800; font-family: var(--font-display); }
.nz-login__tagwrap .nz-ic { width: 18px; height: 18px; }
.nz-login h1 { text-align: center; font-size: 40px; }
.nz-login__lead { text-align: center; color: var(--text-2); margin-block: 6px 22px; }
.nz-login__note { text-align: center; font-size: 13px; color: var(--text-2); margin-top: 14px; }
.nz-login__safe { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); font-size: 13px; color: var(--text-2); }
.nz-login__safe .nz-ic { width: 18px; height: 18px; color: var(--gold); }
.nz-why { text-align: center; }
.nz-why__art { position: relative; height: 230px; margin-bottom: 8px; }
.nz-why h2 { font-size: 34px; }
.nz-why__rule { display: flex; align-items: center; gap: 10px; margin: 10px auto 12px; max-width: 380px; }
.nz-why__rule::before, .nz-why__rule::after { content: ''; flex: 1; height: 1px; background: var(--line-strong); }
.nz-why__rule i { width: 10px; height: 10px; rotate: 45deg; background: var(--text); }
.nz-why__item { display: flex; align-items: center; gap: 18px; padding-block: 14px; text-align: start; }
.nz-why__item + .nz-why__item { border-top: 1px solid var(--line); }
.nz-why__item > div { flex: 1; }
.nz-why__item b { display: block; font-family: var(--font-display); font-size: 20px; }
.nz-why__item span { font-size: 13.5px; color: var(--text-2); }
.nz-why__ic { width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); color: var(--primary-text); box-shadow: var(--shadow-2); flex: none; }
.nz-why__ic .nz-ic { width: 26px; height: 26px; }

/* Post ad */
.nz-pagehead { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.nz-pagehead small { color: var(--text-2); font-size: 14px; }
.nz-pagehead h1 { font-size: 36px; display: flex; align-items: center; gap: 12px; }
.nz-pagehead h1::before { content: ''; width: 5px; height: 38px; border-radius: 4px; background: var(--primary); }
.nz-crumbs { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-2); }
.nz-crumbs .nz-ic { width: 14px; height: 14px; }
.nz-autosave { display: inline-flex; align-items: center; gap: 8px; color: var(--success); font-size: 14px; font-weight: 700; }
.nz-autosave .nz-ic { width: 20px; height: 20px; }
.nz-post { display: grid; grid-template-columns: 1fr 320px; gap: 22px; align-items: start; }
.nz-post__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-top: 16px; }
.nz-post__foot { display: flex; align-items: center; justify-content: space-between; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
.nz-preview__box { border: 1.5px dashed var(--line-strong); border-radius: var(--r-m); padding: 16px; display: grid; grid-template-columns: 1fr 120px; gap: 14px; }
.nz-preview__img { height: 140px; border-radius: 10px; background: var(--surface-2); display: grid; place-items: center; color: var(--text-2); }
.nz-preview__img .nz-ic { width: 34px; height: 34px; }
.nz-preview__t { font-family: var(--font-display); font-weight: 900; font-size: 19px; line-height: 1.5; }
.nz-preview__meta { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; font-size: 13px; color: var(--text-2); }
.nz-preview__meta span { display: flex; align-items: center; gap: 8px; }
.nz-preview__meta .nz-ic { width: 16px; height: 16px; }
.nz-quality { display: flex; align-items: center; gap: 12px; margin-top: 16px; font-family: var(--font-display); font-weight: 800; }
.nz-quality__bar { flex: 1; height: 10px; border-radius: 10px; background: var(--surface-2); border: 1px solid var(--line); overflow: hidden; }
.nz-quality__bar i { display: block; height: 100%; width: var(--q, 4%); background: var(--primary); border-radius: inherit; }
.nz-trust { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: var(--r-l); border: 1px solid var(--line); background: var(--gold-soft); }
.nz-trust b { display: block; font-family: var(--font-display); font-size: 18px; }
.nz-trust p { font-size: 13.5px; color: var(--text-2); }
.nz-trust__ic { width: 62px; height: 62px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); color: var(--gold); box-shadow: var(--shadow-1); flex: none; }
.nz-trust__ic .nz-ic { width: 32px; height: 32px; }

/* My ads */
.nz-acct { display: grid; grid-template-columns: 1fr 270px; gap: 24px; align-items: start; }
.nz-profile { text-align: center; padding: 22px 18px 14px; }
.nz-avatar { width: 100px; height: 100px; margin-inline: auto; border-radius: 50%; border: 3px solid var(--text); overflow: hidden; position: relative; background: #f2c78f; }
.nz-profile h3 { font-size: 22px; margin-top: 8px; }
.nz-profile__phone { font-family: var(--font-display); font-weight: 800; font-size: 18px; letter-spacing: .08em; }
.nz-profile__stats { display: grid; grid-template-columns: 1fr 1fr; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); }
.nz-profile__stats div { display: flex; flex-direction: column; align-items: center; gap: 2px; font-size: 13px; color: var(--text-2); }
.nz-profile__stats div + div { border-inline-start: 1px solid var(--line); }
.nz-profile__stats b { font-family: var(--font-display); font-size: 18px; color: var(--text); }
.nz-profile__stats .nz-ic { width: 20px; height: 20px; color: var(--text); }
.nz-profile__stats .nz-heart { color: var(--primary-text); }
.nz-menu { padding: 6px; }
.nz-menu a { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 10px; font-family: var(--font-display); font-weight: 800; font-size: 16px; }
.nz-menu a + a { border-top: 1px solid var(--line); border-radius: 0; }
.nz-menu a .nz-go { margin-inline-start: auto; width: 16px; height: 16px; color: var(--text-2); }
.nz-menu a.is-on { background: var(--text); color: var(--bg); border-radius: 10px; }
.nz-menu .nz-ic { width: 22px; height: 22px; }
.nz-myhead { display: flex; align-items: center; justify-content: space-between; padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--line-strong); }
.nz-myhead h1 { font-size: 30px; display: flex; align-items: center; gap: 10px; }
.nz-myhead h1 .nz-ic { color: var(--primary-text); width: 24px; height: 24px; }
.nz-myad { display: grid; grid-template-columns: 200px 1fr 170px; gap: 22px; align-items: center; padding: 14px; }
.nz-myad__img { position: relative; height: 150px; border-radius: 12px; overflow: hidden; }
.nz-myad__body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.nz-myad__body h3 { font-size: 19px; }
.nz-myad__meta { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text-2); flex-wrap: wrap; }
.nz-myad__meta .nz-ic { width: 16px; height: 16px; }
.nz-myad__meta i { font-style: normal; opacity: .5; }
.nz-myad__actions { display: flex; flex-direction: column; gap: 12px; padding-inline-start: 22px; border-inline-start: 1px solid var(--line); }

/* ---------------- Footer ---------------- */
.nz-foot { position: relative; color: var(--footer-ink); background: var(--footer); overflow: hidden; }
.nz-foot::before { content: ''; position: absolute; inset: 0; background: none center bottom / cover no-repeat; opacity: .9; }
.nz-foot::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, color-mix(in srgb, var(--footer) 55%, transparent), var(--footer) 92%); }
.nz-foot > * { position: relative; z-index: 1; }
.nz-foot__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1.4fr; gap: 28px; padding-block: 30px 22px; }
.nz-foot h4 { font-size: 16px; color: #fff; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.nz-foot h4 .nz-ic { color: var(--primary-hover); background: #fff; border-radius: 4px; padding: 1px; width: 22px; height: 22px; }
.nz-foot__links a { display: block; font-size: 14px; color: var(--footer-ink-2); padding-block: 2px; transition: color .2s; }
.nz-foot__links a:hover { color: #fff; }
.nz-foot__col + .nz-foot__col { border-inline-start: 1px solid rgba(255,255,255,.1); padding-inline-start: 22px; }
.nz-foot__brand { display: flex; align-items: center; gap: 10px; }
.nz-foot__brand img { width: 46px; height: 54px; object-fit: contain; filter: invert(1) sepia(.6) saturate(2) hue-rotate(-15deg) brightness(.95); }
.nz-foot__brand b { white-space: nowrap; font-family: var(--font-display); font-size: 28px; font-weight: 900; color: #fff; display: block; line-height: 1.15; }
.nz-foot__brand span { font-size: 12px; color: var(--footer-ink-2); }
.nz-social { display: flex; gap: 10px; margin-top: 16px; }
.nz-social a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid rgba(255,255,255,.7); color: #fff; transition: background-color .2s, transform .45s var(--nz-spring); }
.nz-social a:hover { background: var(--primary); border-color: var(--primary); transform: translateY(-3px); }
.nz-social .nz-ic { width: 19px; height: 19px; }
.nz-sub { display: flex; height: 50px; border-radius: 12px; overflow: hidden; background: #fff; border: 2px solid var(--primary); }
.nz-sub input { flex: 1; min-width: 0; border: 0; outline: 0; padding-inline: 14px; font-size: 14px; color: #2b1d16; background: #fff; }
.nz-sub button { border: 0; padding-inline: 20px; background: var(--primary); color: #fff; font-family: var(--font-display); font-weight: 800; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.nz-sub button .nz-ic { width: 18px; height: 18px; }
.nz-foot__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; border-top: 1px solid rgba(255,255,255,.12); font-size: 13px; color: var(--footer-ink-2); }
.nz-foot__bar nav { display: flex; gap: 14px; }
.nz-foot__bar nav a + a { border-inline-start: 1px solid rgba(255,255,255,.2); padding-inline-start: 14px; }
.nz-foot__bar .nz-love { color: var(--primary); width: 15px; height: 15px; display: inline-block; vertical-align: -2px; fill: currentColor; }

/* ---------------- Page shell ---------------- */
.nz-page { position: relative; isolation: isolate; background: var(--bg); }
.nz-page::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--nz-lattice, none) 0 0 / 280px; opacity: .05; pointer-events: none; }
[data-nzc-mode="dark"] .nz-page::before { filter: invert(1); opacity: .04; }
.nz-stack { display: flex; flex-direction: column; gap: 22px; }
.nz-home-split { display: grid; grid-template-columns: 300px 1fr; gap: 22px; align-items: start; }
.nz-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }

/* ---------------- Mobile ---------------- */
@media (max-width: 720px) {
  .nz-wrap { padding-inline: 16px; }
  .nz-hero h1 { font-size: 34px; }
  .nz-search, .nz-channels { grid-template-columns: 1fr; }
  .nz-cats { grid-template-columns: repeat(4, 1fr); }
  .nz-carousel__track, .nz-grid-3, .nz-areas { grid-template-columns: repeat(2, 1fr); }
  .nz-home-split, .nz-login, .nz-post, .nz-acct, .nz-foot__grid, .nz-how, .nz-stats { grid-template-columns: 1fr; }
  .nz-myad { grid-template-columns: 1fr; }
  .nz-post__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .nz * { transition: none !important; animation: none !important; }
}

/* ================= Mockup fidelity pass ================= */
.nz-only-dark { display: none !important; }
[data-nzc-mode="dark"] .nz-only-dark { display: block !important; }
[data-nzc-mode="dark"] .nz-only-light { display: none !important; }
.nz-brand__mark { width: 60px; height: 70px; object-fit: contain; filter: none !important; mix-blend-mode: multiply; }
[data-nzc-mode="dark"] .nz-brand__mark { mix-blend-mode: normal; border-radius: 10px; }
.nz-brand__name { font-size: 34px; }
.nz-red { color: var(--primary-text); }

/* Header on photo edges (inner pages) */
.nz-head--photo {
  background:
    linear-gradient(to right, transparent 0, var(--bg) 330px, var(--bg) calc(100% - 330px), transparent 100%),
    var(--nz-head-l, none) left top / auto 100% no-repeat,
    var(--nz-head-r, none) right top / auto 100% no-repeat,
    var(--bg);
  border-bottom: 1px solid var(--line);
}
.nz-head--photo::before { display: none; }
.nz-head--photo .nz-top, .nz-head--plain .nz-top { background: color-mix(in srgb, var(--surface) 55%, transparent); }
.nz-head--plain { background: var(--bg); border-bottom: 3px double var(--line-strong); }
.nz-head .nz-nav { border-top: 1px solid var(--line-strong); }
.nz-head--photo .nz-nav { border-top: 0; }
.nz-head__main { gap: 18px; }
.nz-head__tools { margin-inline-end: 10px; }
.nz-headsearch { padding-block: 2px 16px; }
.nz-headsearch .nz-input { max-width: 480px; border-color: var(--line-strong); }
.nz-headsearch .nz-btn { height: 46px; padding-inline: 26px; }

/* Home hero */
.nz-hero {
  background:
    linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 92%, transparent) 30%, color-mix(in srgb, var(--bg) 20%, transparent) 52%, transparent 70%),
    linear-gradient(to bottom, transparent 55%, var(--bg) 100%),
    var(--nz-hero, none) left top / 66% auto no-repeat,
    var(--bg);
  padding-block-end: 24px;
}
.nz-hero::before { display: none; }
.nz-hero::after { content: ''; position: absolute; top: 90px; right: 0; width: 360px; height: 260px; background: var(--nz-orn, none) right top / 520px; opacity: .08; pointer-events: none; }
[data-nzc-mode="dark"] .nz-hero::after { filter: invert(1); }
[data-nzc-mode="dark"] .nz-hero { background: linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 90%, transparent) 35%, color-mix(in srgb, var(--bg) 55%, transparent) 70%), linear-gradient(to bottom, transparent 55%, var(--bg) 100%), var(--nz-hero, none) left top / 66% auto no-repeat, var(--bg); }
.nz-herohead .nz-top { background: color-mix(in srgb, var(--surface) 80%, transparent); }
.nz-herohead__bar { background: color-mix(in srgb, var(--surface) 78%, transparent); backdrop-filter: blur(6px); box-shadow: 0 6px 24px rgba(74,44,24,.08); }
.nz-herohead .nz-head__main { padding-block: 10px; }
.nz-nav--main { border: 0 !important; padding: 0; gap: 4px; margin-inline: auto; }
.nz-nav--main a { font-size: 15px; }
.nz-hero__copy { margin-inline-start: 0; padding-block: 44px 28px; max-width: 560px; }
.nz-kicker { color: #c0561c; font-size: 19px; }
[data-nzc-mode="dark"] .nz-kicker { color: #f0a24f; }
.nz-hero h1 { font-size: 60px; line-height: 1.22; }
.nz-hero__lead { font-size: 16px; opacity: 1; color: var(--text); }
.nz-search { background: color-mix(in srgb, var(--surface) 90%, transparent); border: 1px solid rgba(255,255,255,.7); }
.nz-search .nz-btn { border-radius: 12px; }

/* Channels */
.nz-channels { grid-template-columns: 1.25fr repeat(4, 1fr); background: color-mix(in srgb, var(--surface) 88%, transparent); border: 1px solid rgba(255,255,255,.7); }
.nz-channel { border: 0; padding: 8px 10px; gap: 12px; }
.nz-channel__img { width: 50px; height: 48px; border-radius: 12px; object-fit: cover; flex: none; }
.nz-ch-telegram { background: #e9f4fd; } .nz-ch-eitaa { background: #fff0e6; } .nz-ch-bale { background: #e6f6f0; } .nz-ch-rubika { background: #f1ebfc; }
[data-nzc-mode="dark"] .nz-ch-telegram, [data-nzc-mode="dark"] .nz-ch-eitaa, [data-nzc-mode="dark"] .nz-ch-bale, [data-nzc-mode="dark"] .nz-ch-rubika { background: var(--surface-2); }
.nz-channel b { font-size: 19px; }

/* Category strip: separate tiles with coloured glyph icons */
.nz-cats { grid-template-columns: repeat(13, 1fr); gap: 10px; padding: 12px; background: color-mix(in srgb, var(--surface) 70%, transparent); }
.nz-cat { background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow-1); padding: 12px 4px 10px; gap: 6px; color: var(--text); }
.nz-cat img { width: 38px; height: 38px; object-fit: contain; mix-blend-mode: multiply; }
[data-nzc-mode="dark"] .nz-cat img { mix-blend-mode: normal; border-radius: 8px; }
.nz-cat span { font-size: 12px; line-height: 1.5; }

/* Warm section panels */
.nz-panel--warm { background: linear-gradient(180deg, #fdf1e4 0%, #fdf6ee 100%); border-color: #f3e3cf; }
.nz-panel--soft { background: color-mix(in srgb, var(--surface) 60%, var(--bg)); }
[data-nzc-mode="dark"] .nz-panel--warm { background: var(--surface-3); border-color: var(--line); }

/* Section head: title centred, two-tone, gold rules, "see all" pill on the left */
.nz-sechead { grid-template-columns: 1fr auto 1fr; }
.nz-sechead__t h2 { font-size: 30px; gap: 12px; }
.nz-sechead__t h2 em { font-style: normal; color: var(--primary-text); }
.nz-sechead__line { width: 70px; height: 2px; border-radius: 2px; background: var(--gold); opacity: .75; }
.nz-sechead__t p { margin-top: -2px; }
.nz-crown-ic .nz-ic { width: 44px; height: 44px; fill: var(--gold); stroke: #c98a1c; stroke-width: 1.2; }
.nz-crown-ic { color: var(--gold); }
.nz-send-ic .nz-ic { width: 38px; height: 38px; fill: var(--primary); stroke: var(--primary-hover); stroke-width: 1.2; }
.nz-more { box-shadow: var(--shadow-1); border-color: var(--line); font-weight: 800; padding: 6px 16px; }

/* Ad card chips as in the mockup: VIP top-left, heart top-right, category bottom-right */
.nz-chip--vip { inset-inline-start: auto; inset-inline-end: 10px; border-radius: 8px; padding: 3px 10px; font-family: var(--font-display); font-weight: 800; box-shadow: 0 3px 10px rgba(200,16,46,.35); }
.nz-chip--vip .nz-crown { color: var(--gold); }
.nz-chip--vip .nz-crown .nz-ic { fill: var(--gold); stroke: #c98a1c; }
.nz-ad__fav { inset-inline-end: auto; inset-inline-start: 10px; background: rgba(20,12,8,.35); color: #fff; box-shadow: none; backdrop-filter: blur(4px); }
.nz-chip--cat { inset-inline-end: auto; inset-inline-start: 10px; border-radius: 999px; padding: 2px 12px; font-weight: 800; box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.nz-cat-b { background: #fff1e4; color: #8a3b06; }
.nz-chip--count { inset-inline-end: 10px; inset-inline-start: auto; }
.nz-ad { box-shadow: 0 2px 10px rgba(74,44,24,.08); border-color: #f1e6d8; }
.nz-ad__media { aspect-ratio: 16 / 9.4; margin: 7px 7px 0; }
.nz-ad__title { font-size: 16.5px; font-weight: 900; }
.nz-ad__price { font-size: 19px; }
.nz-carousel__nav { background: var(--surface); color: var(--primary-text); width: 44px; height: 44px; box-shadow: var(--shadow-2); }
.nz-carousel__nav--prev { inset-inline-start: -34px; } .nz-carousel__nav--next { inset-inline-end: -34px; }
.nz-carousel__nav--prev { inset-inline-start: auto; inset-inline-end: auto; left: -34px; }
.nz-carousel__nav--next { inset-inline-start: auto; inset-inline-end: auto; right: -34px; }

/* Promo banner: photo on the left, wine red on the right */
.nz-promo { background: linear-gradient(to left, #9b1224 0%, #a3162a 40%, rgba(163,22,42,.6) 58%, rgba(163,22,42,0) 75%), var(--nz-hero, none) left 40% / 60% auto no-repeat, #9b1224; min-height: 128px; padding: 22px 48px; }
.nz-promo::before, .nz-promo::after { display: none; }
.nz-promo h3 { font-size: 32px; }
.nz-btn--promo { background: var(--primary); color: #fff; border: 2px solid #fff; border-radius: 12px; box-shadow: 0 6px 18px rgba(0,0,0,.2); }
.nz-btn--promo:hover { background: var(--primary-hover); }

/* Businesses + AI box */
.nz-biz { background: transparent; border: 0; box-shadow: none; overflow: visible; }
.nz-biz__head { border: 0; padding: 0 0 10px; }
.nz-biz__tab { padding: 8px 16px; border-radius: 10px; box-shadow: var(--shadow-red); }
.nz-biz__tab .nz-ic { fill: #fff; }
.nz-biz__row { grid-template-columns: 76px 1fr; background: var(--surface); border-radius: var(--r-m); border: 1px solid #f1e6d8; box-shadow: 0 2px 8px rgba(74,44,24,.06); padding: 10px; }
.nz-biz__row + .nz-biz__row { border-top: 1px solid #f1e6d8; margin-top: 10px; }
.nz-biz__img { width: 76px; height: 62px; border-radius: 10px; overflow: hidden; }
.nz-biz__img img { width: 100%; height: 100%; object-fit: cover; }
.nz-badge--sm.nz-badge--verified { border: 0; background: #e3f5ea; }
.nz-ai { background: linear-gradient(115deg, #d23c7a 0%, #9b3fc4 55%, #6d3fd0 100%); border-radius: var(--r-l); padding: 14px 14px 14px 10px; }
.nz-ai img { width: 70px; border-radius: 12px; }
.nz-ai b { font-size: 18px; display: flex; align-items: center; gap: 6px; }
.nz-ai__spark .nz-ic { width: 18px; height: 18px; fill: #ffb547; stroke: #ffb547; }
.nz-ai .nz-btn { background: #fff; color: #5b2fb0; box-shadow: none; }

/* Stats: soft red discs with filled glyphs */
.nz-stats { border-color: #f1e6d8; }
.nz-stat__ic { width: 54px; height: 54px; background: #fdecee; }
.nz-stat__ic .nz-ic { width: 28px; height: 28px; fill: var(--primary); stroke: var(--primary); stroke-width: 1.2; }
.nz-stat b { font-size: 24px; }
.nz-stat + .nz-stat { border-inline-start: 0; }
.nz-stat + .nz-stat::before { content: ''; width: 1px; height: 44px; background: var(--line); margin-inline-end: 40px; }

/* Popular */
.nz-popular { border-color: #f1e6d8; }
.nz-popular__t .nz-ic { fill: #f28a1c; stroke: #e2561a; }
.nz-pill { background: var(--surface); border-color: var(--line-strong); padding: 5px 18px; }

/* Areas */
.nz-rowhead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.nz-rowhead h3 { display: flex; align-items: center; gap: 8px; font-size: 19px; }
.nz-rowhead h3 .nz-ic { width: 24px; height: 24px; fill: var(--primary); stroke: #fff; }
.nz-area { padding: 6px; }
.nz-area__img { height: 64px; border-radius: 8px; overflow: hidden; }
.nz-area__img img { width: 100%; height: 100%; object-fit: cover; }
.nz-area span { font-size: 13px; font-weight: 800; padding-top: 6px; }

/* Three steps */
.nz-howwrap { display: grid; grid-template-columns: 220px 1fr 220px; align-items: center; gap: 20px; }
.nz-how__intro h3 { display: flex; align-items: center; gap: 8px; font-size: 20px; white-space: nowrap; }
.nz-how__intro span { font-size: 12.5px; color: var(--text-2); }
.nz-fire .nz-ic { width: 24px; height: 24px; fill: #f28a1c; stroke: #e2561a; }
.nz-how { grid-template-columns: repeat(3, 1fr); padding: 14px 8px; }
.nz-how__step { margin: 0; justify-content: center; padding-inline: 12px; }
.nz-how__step + .nz-how__step { border-inline-start: 2px dashed #f2c7cc; }
.nz-how__step:first-child { border: 0; }
.nz-how__ic { width: 58px; height: 58px; background: linear-gradient(145deg, #f0444f, #c8102e); }
.nz-how__ic .nz-ic { width: 26px; height: 26px; fill: #fff; stroke: #fff; stroke-width: 1; }
.nz-how__ic [data-i="rocket"] .nz-ic, .nz-how__ic [data-i="file"] .nz-ic { fill: none; stroke-width: 2; }
.nz-how__cta { text-align: center; }
.nz-how__cta span { display: block; margin-top: 8px; font-size: 12.5px; color: var(--text-2); }

/* Footer with photo edges */
.nz-foot { background: var(--nz-foot-l, none) left bottom / auto 100% no-repeat, var(--nz-foot-r, none) right bottom / auto 100% no-repeat, #2a1c15; }
.nz-foot::before { background: none center bottom / auto 100% repeat-x; opacity: .7; }
.nz-foot::after { background: linear-gradient(to bottom, rgba(42,28,21,.55), rgba(42,28,21,.2) 60%, rgba(42,28,21,.5)), linear-gradient(to right, transparent 0, rgba(42,28,21,.75) 220px, rgba(42,28,21,.75) calc(100% - 220px), transparent 100%); }
.nz-foot__brand img { width: 58px; height: 58px; object-fit: contain; filter: none; mix-blend-mode: screen; }
.nz-foot__bar { background: rgba(0,0,0,.25); margin-inline: calc(var(--space-5) * -1); padding-inline: var(--space-5); }
.nz-sub { border-color: #fff; }

/* Login */
.nz-login { grid-template-columns: 500px 1fr; gap: 90px; }
.nz-login__card { overflow: visible; padding-top: 34px; }
.nz-login__tab { position: absolute; top: -26px; inset-inline-start: 26px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 22px; border-radius: 14px 14px 0 0; border: 1px solid var(--line); border-bottom: 0; background: var(--surface); font-family: var(--font-display); font-weight: 800; font-size: 15px; }
.nz-login__tab .nz-ic { width: 18px; height: 18px; fill: var(--text-2); stroke: var(--text-2); }
.nz-login h1 { font-size: 42px; }
.nz-login .nz-input { height: 58px; }
.nz-input__prefix { font-family: var(--font-display); font-size: 17px; direction: rtl; }
.nz-login__safe .nz-ic { fill: #f6d58c; stroke: #c98a1c; }
.nz-why { text-align: center; }
.nz-why__art { display: block; width: 100%; max-width: 560px; margin: 0 auto -8px; mix-blend-mode: multiply; }
[data-nzc-mode="dark"] .nz-why__art { mix-blend-mode: normal; border-radius: 20px; opacity: .9; }
.nz-why__item { gap: 22px; }
.nz-why__ic { width: 60px; height: 60px; }
.nz-why__ic .nz-ic { width: 28px; height: 28px; }
.nz-card--orn2::after { content: ''; position: absolute; inset-block-start: 0; inset-inline-end: 0; width: 170px; height: 150px; background: var(--nz-orn, none) 100% 0 / 360px; opacity: .12; pointer-events: none; -webkit-mask: radial-gradient(circle at 0 0, #000 10%, transparent 70%); mask: radial-gradient(circle at 0 0, #000 10%, transparent 70%); }
[data-nzc-mode="dark"] .nz-card--orn2::after { filter: invert(1); }

/* Post ad */
.nz-pagehead small { display: block; font-size: 14px; color: var(--text-2); margin-bottom: 2px; }
.nz-pagehead h1 { font-size: 38px; }
.nz-crumbs a { color: var(--text-2); }
.nz-tile { flex-direction: column; min-height: 84px; }
.nz-tile__ic { width: 40px; height: 40px; }
.nz-trust__ic .nz-ic { fill: #fbe3a6; stroke: #c98a1c; }
.nz-preview__img { background: #e9e6e3; }
.nz-quality__bar { height: 12px; }
.nz-quality__bar i { min-width: 12px; }

/* My ads */
.nz-acct { grid-template-columns: 270px 1fr; }
.nz-avatar { border: 3px solid #2b1d16; }
.nz-avatar img { width: 100%; height: 100%; object-fit: cover; }
.nz-myhead { border-bottom: 2px solid var(--line-strong); }
.nz-myhead h1 { font-size: 32px; }
.nz-flower .nz-ic { width: 26px; height: 26px; fill: var(--primary); stroke: var(--primary); }
.nz-myad { grid-template-columns: 210px 1fr 180px; }
.nz-myad__img { height: 156px; }
.nz-myad__body h3 { font-size: 20px; }
.nz-myad__actions .nz-btn { height: 48px; }
.nz-menu a.is-on { background: #2b1d16; color: #fff; }
[data-nzc-mode="dark"] .nz-menu a.is-on { background: var(--text); color: var(--bg); }
.nz-badge--verified .nz-ic { fill: var(--success); stroke: #fff; }
.nz-badge--pending, .nz-badge--rejected { height: 34px; padding-inline: 14px; border-radius: 10px; }

@media (max-width: 720px) {
  .nz-cats { grid-template-columns: repeat(4, 1fr); }
  .nz-howwrap, .nz-login, .nz-acct { grid-template-columns: 1fr; }
  .nz-hero { background-size: auto, auto, cover; }
}

/* ---- fidelity pass 2 ---- */
.nz-hero {
  background:
    linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 90%, transparent) 24%, color-mix(in srgb, var(--bg) 35%, transparent) 45%, transparent 62%),
    linear-gradient(to bottom, transparent 70%, var(--bg) 100%),
    var(--nz-hero-full, none) center top / cover no-repeat,
    var(--bg);
}
[data-nzc-mode="dark"] .nz-hero { background: linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 88%, transparent) 30%, color-mix(in srgb, var(--bg) 60%, transparent) 70%), linear-gradient(to bottom, transparent 70%, var(--bg) 100%), var(--nz-hero-full, none) center top / cover no-repeat, var(--bg); }
.nz-search, .nz-channels { background: color-mix(in srgb, var(--surface) 96%, transparent); }
.nz-head--photo { background: linear-gradient(to right, transparent 0, transparent 70px, var(--bg) 240px, var(--bg) calc(100% - 240px), transparent calc(100% - 70px), transparent 100%), var(--nz-head-l, none) left top / auto 100% no-repeat, var(--nz-head-r, none) right top / auto 100% no-repeat, var(--bg); }
.nz-head--photo .nz-top { background: transparent; }
.nz-promo .nz-btn--promo { background: var(--primary); color: #fff; border: 2px solid #fff; }
.nz-promo .nz-btn--promo:hover { background: var(--primary-hover); }
.nz-promo { background: linear-gradient(to left, #9b1224 0%, #a3162a 45%, rgba(163,22,42,.55) 62%, rgba(163,22,42,0) 80%), var(--nz-hero, none) left 35% / 48% auto no-repeat, #9b1224; }
.nz-biz__tab, .nz-biz .nz-more { white-space: nowrap; }
.nz-biz__tab { font-size: 14px; padding: 7px 12px; }
.nz-biz .nz-more { padding: 5px 10px; font-size: 12px; }
.nz-home-split { grid-template-columns: 320px 1fr; }
.nz-popular { flex-wrap: nowrap; gap: 8px; }
.nz-pill { padding: 5px 13px; font-size: 12.5px; white-space: nowrap; }
.nz-howwrap { grid-template-columns: 250px 1fr 210px; }
.nz-how__intro h3 { font-size: 18px; }
.nz-why__art { -webkit-mask: radial-gradient(ellipse 70% 75% at 50% 45%, #000 60%, transparent 100%); mask: radial-gradient(ellipse 70% 75% at 50% 45%, #000 60%, transparent 100%); }
.nz-foot__brand span span { white-space: nowrap; }
.nz-foot__grid { grid-template-columns: 1.4fr 1fr 1fr 1fr 1.6fr; }
.nz-channels__intro span { display: block; }
.nz-hero {
  background:
    linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 90%, transparent) 24%, color-mix(in srgb, var(--bg) 35%, transparent) 45%, transparent 62%),
    linear-gradient(to bottom, transparent 250px, var(--bg) 470px),
    var(--nz-hero-full, none) center top / 100% auto no-repeat,
    var(--bg);
}
[data-nzc-mode="dark"] .nz-hero { background: linear-gradient(to left, var(--bg) 0%, color-mix(in srgb, var(--bg) 88%, transparent) 30%, color-mix(in srgb, var(--bg) 60%, transparent) 70%), linear-gradient(to bottom, transparent 250px, var(--bg) 470px), var(--nz-hero-full, none) center top / 100% auto no-repeat, var(--bg); }
.nz-cat { background: #fcf9f3; }
[data-nzc-mode="dark"] .nz-cat { background: var(--surface); }
.nz-hero {
  background:
    linear-gradient(to left, var(--bg) 0%, var(--bg) 36%, color-mix(in srgb, var(--bg) 70%, transparent) 44%, color-mix(in srgb, var(--bg) 25%, transparent) 54%, transparent 64%),
    linear-gradient(to bottom, transparent 190px, var(--bg) 398px),
    var(--nz-hero-full, none) center top / 100% auto no-repeat,
    var(--bg);
}
[data-nzc-mode="dark"] .nz-hero { background: linear-gradient(to left, var(--bg) 0%, var(--bg) 30%, color-mix(in srgb, var(--bg) 70%, transparent) 60%, color-mix(in srgb, var(--bg) 45%, transparent) 100%), linear-gradient(to bottom, transparent 190px, var(--bg) 398px), var(--nz-hero-full, none) center top / 100% auto no-repeat, var(--bg); }
.nz-foot h4 { white-space: nowrap; }
.nz-ai b { font-size: 16px; }
.nz-ai p { font-size: 12px; }
