/* Phase 28B.5 generated asset: historical style.css suffix.
 * Original cascade position: after the conditional appliance slice and before
 * the Phase 28A navigation/hero stylesheet. Kept sitewide for compatibility.
 */

/* =========================================================
 * FRONT PAGE — #nth-home
 * All front-page specific styles scoped under #nth-home
 * Replaces the inline <style> block in front-page.php
 * ======================================================= */

/* ── Layout wrapper ─────────────────────────────────────── */
/* v4.43: widened 1240px -> 1400px. On a typical 1920px desktop the old
   width left a visibly empty band down both sides while competing Nepali
   tech sites run noticeably wider. Product/listing pages benefit directly
   from this since their grids show more per row; prose-heavy templates
   (single.php articles, page.php) are deliberately NOT widened to match,
   since long lines of body text get harder to read past roughly 1100px. */
#nth-home {
  max-width: 1400px;
  margin: 24px auto;
  padding: 0 18px;
}

/* ── Hero ────────────────────────────────────────────────── */
.nth-hero {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 32px 28px 24px;
  position: relative;
  overflow: hidden;
}

/* v4.31: this used to be display:none — a decoration that was tried and
   switched off, leaving the hero flat. Replaced with something restrained
   rather than re-adding the same kind of thing: one soft radial wash in
   the brand blue, anchored top-right, low enough opacity that it reads as
   atmosphere rather than a shape competing with the text and search form. */
.nth-hero::before {
  content: "";
  display: block;
  position: absolute;
  top: -120px;
  right: -80px;
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, rgba(29,78,216,.07) 0%, rgba(29,78,216,0) 70%);
  pointer-events: none;
}

.nth-hero-text { position: relative; }

.nth-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--brand);
}

.nth-hero h1 {
  margin: 0 0 8px;
  font-size: 32px;
  font-weight: 900;
  color: var(--ink);
  line-height: 1.2;
}

.nth-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.6;
}

/* Search form — override global input styles */
.nth-search-form {
  display: flex;
  gap: 8px;
  margin-top: 20px;
  position: relative;
}

.nth-search-form .nth-search-input {
  flex: 1;
  min-width: 0;
  width: auto;           /* override global input{width:100%} */
  padding: 13px 18px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #fff;
  font-size: 15px;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
  transition: border-color .18s, box-shadow .18s;
}

.nth-search-form .nth-search-input:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(29,78,216,.1);
  outline: none;
}

.nth-search-form .nth-search-btn {
  padding: 13px 22px;
  border-radius: 999px;
  border: none;
  background: var(--brand);
  color: #fff !important;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .18s, transform .12s;
  box-shadow: none;    /* override global button box-shadow */
}

.nth-search-btn:hover { background: var(--brand-dark) !important; transform: none; }

/* "Just updated" live strip — real products, not a decorative claim */
.nth-live-strip {
  position: relative;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.nth-live-strip-label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--muted);
}

.nth-live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #059669;
  animation: nthLivePulse 2.2s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .nth-live-dot { animation: none; }
}
@keyframes nthLivePulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: .35; }
}

.nth-live-strip-items {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}

.nth-live-item {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  max-width: 200px;
  padding: 7px 12px 7px 7px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: #fff;
  text-decoration: none;
  transition: border-color .18s, background .18s;
}
.nth-live-item:hover {
  border-color: var(--brand);
  background: #eff6ff;
}

.nth-live-item img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: contain;
  background: var(--bg);
  flex-shrink: 0;
}

.nth-live-item-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}

.nth-live-item-title {
  font-size: 12.5px;
  font-weight: 700;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.nth-live-item-meta {
  font-size: 11.5px;
  font-weight: 700;
  color: #059669;
  white-space: nowrap;
}

.nth-live-item-ago {
  font-weight: 600;
  color: var(--muted);
}

/* Hero actions row */
.nth-hero-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.nth-sort-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.nth-sort-label {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
  white-space: nowrap;
}

/* Sort select — override global select styles */
.nth-sort-select {
  width: auto;           /* override global select{width:100%} */
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #fff;
  font-weight: 700;
  font-size: 13px;
  color: var(--ink);
  cursor: pointer;
}

.nth-compare-link,
.nth-wl-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #fff;
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
  text-decoration: none;
  transition: border-color .18s, background .18s;
}

.nth-compare-link:hover, .nth-wl-link:hover {
  border-color: var(--brand);
  background: #eff6ff;
  color: var(--brand);
}

/* Price band chips */
.nth-price-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}

.nth-chip {
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: #fff;
  text-decoration: none;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  transition: border-color .18s, background .18s, color .18s;
}

.nth-chip:hover {
  background: #eff6ff;
  border-color: var(--brand);
  color: var(--brand);
}

/* ── Sections ────────────────────────────────────────────── */
.nth-section { margin-top: 48px; }

.nth-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 20px;
}

.nth-section-title {
  margin: 0;
  font-size: 26px;
  font-weight: 900;
  color: var(--ink);
  display: flex;
  align-items: center;
  gap: 10px;
}

.nth-title-badge {
  font-size: 11px;
  font-weight: 800;
  padding: 3px 9px;
  border-radius: 999px;
  background: #dcfce7;
  color: #166534;
  vertical-align: middle;
}

.nth-viewall {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--brand);
  font-weight: 800;
  font-size: 14px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}
.nth-viewall:hover { text-decoration: underline; color: var(--brand-dark); }

/* Phase 9C — category links added by Phase 9B grouped homepage rails. */
.nth-group-archive-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 4px 8px;
  min-width: 0;
}
.nth-group-archive-links > span[aria-hidden="true"] {
  color: var(--muted);
}


/* ── Product card grid ───────────────────────────────────── */
.nth-prod-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 18px;
}

/* ── Product card ─────────────────────────────────────────── */
.nth-prod-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  /* Reset global nth-card margin/padding */
  margin-bottom: 0;
  padding: 0;
}

@media (prefers-reduced-motion: no-preference) {
  .nth-prod-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 28px rgba(0,0,0,.08);
    border-color: var(--brand);
  }
}

.nth-card-img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #f8fafc;
  overflow: hidden;
  position: relative;
}

.nth-card-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  transition: transform .3s ease;
}

.nth-prod-card:hover .nth-card-img img {
  transform: scale(1.04);
}

.nth-card-body {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.nth-card-brand {
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.nth-card-name {
  margin: 0;
  font-size: 16px;
  font-weight: 900;
  line-height: 1.4;
  /* Phase 9C: long SEO-style product titles no longer make one card
     dramatically taller than its neighbors. Full link text remains in DOM. */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  min-height: 4.2em;
}

.nth-card-name a { color: var(--ink); text-decoration: none; }
.nth-card-name a:hover { color: var(--brand); }

.nth-card-sub {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* Star rating */
.nth-card-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
}

.nth-stars {
  display: inline-block;
  position: relative;
  width: 70px;
  height: 13px;
}

.nth-stars::before,
.nth-stars::after {
  content: '★★★★★';
  position: absolute;
  top: 0; left: 0;
  font-size: 13px;
  line-height: 1;
  letter-spacing: 1px;
}

.nth-stars::before { color: #e2e8f0; }
.nth-stars::after  { color: #f59e0b; width: var(--r,0%); overflow: hidden; white-space: nowrap; }

.nth-rating-num { font-weight: 800; color: var(--ink); font-size: 12px; }
.nth-rating-cnt { color: var(--muted); font-size: 11px; }

.nth-card-price {
  margin-top: auto;
  font-weight: 900;
  color: #059669;
  font-size: 16px;
}

/* Card footer — View btn + wishlist */
.nth-card-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
}

.nth-card-btn {
  flex: 1;
  text-align: center;
  padding: 9px 12px;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--ink);
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: background .18s, border-color .18s, color .18s;
}

.nth-card-btn:hover {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff;
}

/* Wishlist icon button — same as archive-phones.php */
.nth-prod-card .nth-iconbtn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid var(--border);
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  flex-shrink: 0;
  transition: border-color .18s, background .18s;
}

.nth-prod-card .nth-iconbtn svg { color: var(--muted); transition: color .18s; }
.nth-prod-card .nth-iconbtn:hover svg,
.nth-prod-card .nth-iconbtn.active svg { color: #ef4444; }
.nth-prod-card .nth-iconbtn.active.w { background: #fee2e2; border-color: #fecaca; }

/* ── Load more ───────────────────────────────────────────── */
.nth-load-wrap { text-align: center; margin-top: 28px; }

/* Override global button styles for load-more */
.nth-load-btn {
  padding: 13px 32px !important;
  border-radius: 999px !important;
  border: none !important;
  background: var(--brand) !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: 15px;
  cursor: pointer;
  box-shadow: none !important;
  transition: background .18s, transform .12s;
  display: inline-block;
  text-transform: none !important;
}

.nth-load-btn:hover  { background: var(--brand-dark) !important; transform: translateY(-1px); }
.nth-load-btn:disabled { opacity: .55; cursor: not-allowed; transform: none; }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); border: 0;
}

/* ── Reviews grid ────────────────────────────────────────── */
.nth-reviews-grid { display: grid; gap: 14px; }

.nth-review-card {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 0;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  transition: transform .22s, box-shadow .22s;
}

@media (prefers-reduced-motion: no-preference) {
  .nth-review-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,.07); }
}

.nth-review-thumb {
  display: block;
  background: #f8fafc;
  min-height: 148px;
  overflow: hidden;
}

.nth-review-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nth-review-body {
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.nth-review-meta {
  display: flex;
  gap: 10px;
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
  flex-wrap: wrap;
}

.nth-review-cat {
  background: #eff6ff;
  color: var(--brand);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
}

.nth-review-title {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.4;
}

.nth-review-title a { color: var(--ink); text-decoration: none; }
.nth-review-title a:hover { color: var(--brand); }

.nth-review-excerpt {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.65;
  margin: 0;
}

/* ── Browse chips (brand + price band) ──────────────────── */
.nth-browse-section { margin-top: 40px; }
.nth-browse-section .nth-section-title { margin-bottom: 14px; }

.nth-browse-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.nth-browse-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--card);
  text-decoration: none;
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  transition: border-color .18s, background .18s, color .18s;
}

.nth-browse-chip:hover {
  background: #eff6ff;
  border-color: var(--brand);
  color: var(--brand);
}

.nth-chip-count {
  font-size: 11px;
  font-weight: 800;
  background: var(--bg);
  color: var(--muted);
  padding: 1px 6px;
  border-radius: 999px;
}

/* ── Empty states ────────────────────────────────────────── */
.nth-empty {
  color: var(--muted);
  text-align: center;
  padding: 24px 0;
  font-size: 14px;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 991px) {
  .nth-prod-grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
  .nth-review-card { grid-template-columns: 170px 1fr; }
  .nth-review-title { font-size: 16px; }
}

@media (max-width: 767px) {
  #nth-home { padding: 0 12px; margin: 14px auto; }

  .nth-hero { padding: 22px 16px 18px; }
  .nth-hero h1 { font-size: 24px; }
  .nth-hero p { font-size: 14px; }
  .nth-hero-eyebrow { font-size: 11px; }
  .nth-hero::before { width: 260px; height: 260px; top: -80px; right: -60px; }

  .nth-live-item { max-width: 168px; }
  .nth-live-item img { width: 32px; height: 32px; }

  .nth-search-form { flex-wrap: wrap; }
  .nth-search-form .nth-search-input { min-width: 0; }

  .nth-hero-actions { gap: 8px; }
  .nth-compare-link, .nth-wl-link { padding: 7px 10px; font-size: 12px; }

  .nth-section { margin-top: 36px; }
  .nth-section-title { font-size: 21px; }
  .nth-section-head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .nth-group-archive-links { justify-content: flex-start; }

  .nth-prod-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .nth-card-img { aspect-ratio: 4 / 3; }
  .nth-card-name { font-size: 14px; }
  .nth-card-price { font-size: 14px; }

  .nth-review-card { grid-template-columns: 1fr; }
  .nth-review-thumb { min-height: 180px; }
  .nth-review-body { padding: 12px 14px; }
}

/* Phase 9C: keep two product columns on common 360–430px phones.
   Fall back to one column only on genuinely narrow screens. */
@media (max-width: 339px) {
  .nth-prod-grid { grid-template-columns: 1fr; }
}

/* =========================================================
 * SINGLE PHONE PAGE — .nth-phone-wrap
 * All styles scoped to avoid conflicts with global styles
 * ======================================================= */

.nth-phone-wrap {
  max-width: 1400px;
  margin: 24px auto;
  padding: 0 18px;
}

/* ── Hero layout ─────────────────────────────────────────── */
.nth-phone-hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 18px;
  padding: 24px;
}
@media (min-width: 860px) {
  .nth-phone-hero { grid-template-columns: 280px 1fr; }
}

/* ── Image column ────────────────────────────────────────── */
.nth-phone-img-col { display: flex; flex-direction: column; gap: 12px; }

.nth-phone-thumb {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: #f8fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  min-height: 260px;
}

.nth-phone-thumb img {
  width: 100%;
  max-height: 320px;
  object-fit: contain;
  display: block;
}

.nth-phone-thumbs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.nth-thumb-btn {
  width: 60px; height: 60px;
  border: 2px solid var(--border);
  border-radius: 10px;
  background: #f8fafc;
  cursor: pointer;
  overflow: hidden;
  padding: 0;
  transition: border-color .18s;
}
.nth-thumb-btn img { width: 100%; height: 100%; object-fit: contain; }
.nth-thumb-btn.active,
.nth-thumb-btn:hover { border-color: var(--brand); }

/* ── Info column ─────────────────────────────────────────── */
.nth-phone-title {
  font-size: 26px;
  font-weight: 900;
  color: var(--ink);
  margin: 0 0 10px;
  line-height: 1.3;
}

.nth-phone-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--muted);
  margin-bottom: 12px;
}
.nth-meta-sep { color: #cbd5e1; }
.nth-meta-link { color: var(--brand); text-decoration: none; font-weight: 700; }
.nth-meta-link:hover { text-decoration: underline; }

/* Status badges */
.nth-status-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px;
  font-size: 12px; font-weight: 700;
  border: 1px solid var(--border); background: #fff;
}
.nth-status-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.nth-status-listed .nth-status-dot  { background: #16a34a; }
.nth-status-soon .nth-status-dot    { background: #f59e0b; }
.nth-status-not .nth-status-dot     { background: #ef4444; }

/* ── Rating display ──────────────────────────────────────── */
.nth-phone-rating {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
}

.nth-rating-stars {
  display: inline-block;
  position: relative;
  width: 80px; height: 16px;
}
.nth-rating-stars::before,
.nth-rating-stars::after {
  content: '★★★★★';
  position: absolute; top: 0; left: 0;
  font-size: 15px; line-height: 1; letter-spacing: 2px;
}
.nth-rating-stars::before { color: #e2e8f0; }
.nth-rating-stars::after  { color: #f59e0b; width: var(--fill, 0%); overflow: hidden; white-space: nowrap; }

.nth-rating-score { font-size: 18px; font-weight: 900; color: var(--ink); }
.nth-rating-count { font-size: 13px; color: var(--muted); }

/* ── Price block ─────────────────────────────────────────── */
.nth-price-block {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 14px;
}

.nth-best-price {
  display: flex; align-items: baseline; gap: 8px;
  margin-bottom: 4px;
}
.nth-price-label { font-size: 12px; color: var(--muted); font-weight: 700; text-transform: uppercase; }
.nth-price-value { font-size: 28px; font-weight: 900; color: #059669; }

.nth-mrp-price {
  display: flex; align-items: baseline; gap: 8px;
}
.nth-price-mrp { font-size: 15px; color: var(--muted); text-decoration: line-through; }

.nth-price-updated {
  display: flex; align-items: center; gap: 5px;
  margin-top: 8px;
  font-size: 11px; color: var(--muted);
}

/* ── Action buttons ──────────────────────────────────────── */
.nth-phone-actions {
  display: flex; gap: 8px; flex-wrap: wrap;
  align-items: center; margin-bottom: 10px;
}

.nth-action-btn {
  padding: 11px 18px !important;
  border-radius: 999px !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  color: var(--ink) !important;
  font-size: 14px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  transition: background .18s, border-color .18s, color .18s;
  display: inline-flex !important;
  align-items: center;
  box-shadow: none !important;
}
.nth-action-btn.primary {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff !important;
}
.nth-action-btn:hover { background: var(--brand); border-color: var(--brand); color: #fff !important; }

/* Wishlist btn in hero */
.nth-wl-hero {
  width: 42px !important; height: 42px !important;
  border-radius: 50% !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; flex-shrink: 0;
  transition: border-color .18s, background .18s;
}
.nth-wl-hero svg { color: var(--muted); transition: color .18s; }
.nth-wl-hero:hover svg,
.nth-wl-hero.active svg { color: #ef4444; }
.nth-wl-hero.active.w  { background: #fee2e2 !important; border-color: #fecaca !important; }

/* More stores dropdown */
.nth-more-stores {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin-top: 8px; padding: 10px 0;
  border-top: 1px solid var(--border);
}
.nth-more-stores[hidden] { display: none !important; }
.nth-store-link {
  font-size: 12px; font-weight: 700;
  color: var(--brand) !important; text-decoration: none;
  padding: 5px 12px;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  background: #eff6ff;
}
.nth-store-link:hover { background: #dbeafe; }

/* ── Highlights grid ─────────────────────────────────────── */
.nth-highlights-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin: 14px 0;
}
/* v4.31 FIX: renamed from .nth-highlight-box, which collided with a later,
   different .nth-highlight-box definition built for single-phones.php's
   icon+label layout (search "single-phones.php" further down this file).
   Same selector, two incompatible designs — this file's simple label/value
   box was silently inheriting the phones version's display:flex, which
   isn't what single-laptops.php's plain 2-child markup expects. Renamed
   rather than scoped, since this is the only template that used this
   specific (non-icon) layout. */
.nth-stat-box {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 10px 12px;
}
.nth-highlight-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 3px;
}
.nth-highlight-val { font-size: 13px; font-weight: 700; color: var(--ink); }

/* ── TOC links ───────────────────────────────────────────── */
.nth-toc {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 12px 0;
}
.nth-toc a {
  font-size: 12px; font-weight: 700;
  color: var(--brand) !important;
  border: 1px solid #bfdbfe;
  background: #eff6ff;
  padding: 5px 11px;
  border-radius: 999px;
  text-decoration: none;
}
.nth-toc a:hover { background: #dbeafe; }

/* ── Social share ────────────────────────────────────────── */
.nth-share {
  display: flex; align-items: center; gap: 8px;
  flex-wrap: wrap; margin-top: 10px;
}
.nth-share-label { font-size: 12px; color: var(--muted); font-weight: 700; }

.nth-share-btn {
  width: 36px; height: 36px;
  border-radius: 50% !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  cursor: pointer;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background .18s, border-color .18s;
  padding: 0 !important;
  color: var(--ink) !important;
  box-shadow: none !important;
  font-weight: normal;
}
.nth-share-btn svg { display: block; flex-shrink: 0; }
.nth-share-wa  { color: #25d366 !important; }
.nth-share-fb  { color: #1877f2 !important; }
.nth-share-tw  { color: #000 !important; }
.nth-share-copy { color: var(--ink) !important; }
.nth-share-btn:hover { background: #f8fafc !important; border-color: var(--brand) !important; transform: none !important; }

/* ── Sections ────────────────────────────────────────────── */
.nth-phone-sec { margin-top: 36px; }
.nth-phone-sec > h2 {
  font-size: 22px; font-weight: 900;
  color: var(--ink);
  margin: 0 0 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--border);
}
.nth-sec-card {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 16px;
}

/* ── Pros / Cons ─────────────────────────────────────────── */
.nth-pros-cons-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 640px) {
  .nth-pros-cons-grid { grid-template-columns: 1fr; }
}
.nth-pros, .nth-cons {
  border-radius: 14px;
  padding: 14px 16px;
}
.nth-pros { background: #f0fdf4; border: 1px solid #bbf7d0; }
.nth-cons { background: #fef2f2; border: 1px solid #fecaca; }

.nth-pros-head, .nth-cons-head {
  display: flex; align-items: center; gap: 7px;
  font-size: 15px; font-weight: 900; margin: 0 0 10px;
}
.nth-pros-head { color: #16a34a; }
.nth-cons-head { color: #dc2626; }
.nth-pros ul, .nth-cons ul { margin: 0; padding-left: 20px; }
.nth-pros li, .nth-cons li { font-size: 14px; margin-bottom: 5px; line-height: 1.5; }
.nth-pros li { color: #166534; }
.nth-cons li { color: #991b1b; }

/* ── Gallery ─────────────────────────────────────────────── */
.nth-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 10px;
}
.nth-gallery-item {
  display: block;
  border-radius: 10px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: #f8fafc;
  aspect-ratio: 1;
}
.nth-gallery-item img {
  width: 100%; height: 100%;
  object-fit: contain; display: block;
  transition: transform .25s;
}
.nth-gallery-item:hover img { transform: scale(1.06); }

/* ── Lightbox ────────────────────────────────────────────── */
.nth-lightbox {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.88);
  display: flex; align-items: center; justify-content: center;
  z-index: 99999;
}
.nth-lightbox[hidden] { display: none; }
.nth-lightbox img {
  max-width: 90vw; max-height: 90vh;
  border-radius: 10px; display: block;
}
.nth-lightbox-close {
  position: absolute; top: 16px; right: 20px;
  background: transparent !important;
  border: none !important;
  color: #fff !important;
  font-size: 36px !important;
  cursor: pointer; line-height: 1;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  font-weight: 300 !important;
}

/* ── FAQ ─────────────────────────────────────────────────── */
.nth-faq-list { display: grid; gap: 8px; }
.nth-faq-item {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  transition: border-color .18s;
}
.nth-faq-item[open], .nth-faq-item:hover { border-color: var(--brand); }
.nth-faq-q {
  font-size: 15px; font-weight: 800;
  color: var(--ink);
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px;
}
.nth-faq-q::-webkit-details-marker { display: none; }
.nth-faq-q::after {
  content: '+';
  font-size: 20px; font-weight: 400;
  color: var(--brand); flex-shrink: 0;
}
details[open] .nth-faq-q::after { content: '−'; }
.nth-faq-a {
  font-size: 14px; color: var(--muted); line-height: 1.7;
  padding: 0 16px 14px;
}

/* ── Related phones ──────────────────────────────────────── */
.nth-related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 12px;
}
.nth-related-card {
  display: flex; flex-direction: column;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s, border-color .2s;
}
.nth-related-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(0,0,0,.07);
  border-color: var(--brand);
}
.nth-related-img {
  background: #f8fafc; height: 130px; overflow: hidden;
}
.nth-related-img img {
  width: 100%; height: 100%;
  object-fit: contain; display: block;
}
.nth-related-body { padding: 10px 12px; }
.nth-related-name {
  font-size: 13px; font-weight: 700;
  color: var(--ink); margin: 0 0 4px;
  line-height: 1.4;
}
.nth-related-price { font-size: 13px; font-weight: 900; color: #059669; }

/* ── Variant table buy options ───────────────────────────── */
.nth-buy-options { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.nth-label-sm { font-size: 12px; color: var(--muted); font-weight: 700; margin: 0 0 8px; }
.nth-buy-row { display: flex; flex-wrap: wrap; gap: 8px; }
.nth-buy-chip {
  font-size: 12px; font-weight: 700;
  color: var(--brand) !important; text-decoration: none;
  padding: 5px 12px;
  border: 1px solid #bfdbfe; border-radius: 999px; background: #eff6ff;
}
.nth-buy-chip:hover { background: #dbeafe; }

/* ── Sticky bar ──────────────────────────────────────────── */
.nth-sticky {
  position: fixed; left: 0; right: 0; bottom: 0;
  z-index: 9998;
  background: #fff;
  border-top: 1px solid var(--border);
  padding: 10px 14px;
  display: flex; gap: 8px; align-items: center;
}
.nth-sticky-btn {
  flex: 1; text-align: center;
  padding: 11px 14px !important;
  border-radius: 999px !important;
  border: 1px solid var(--border) !important;
  background: #fff !important;
  color: var(--ink) !important;
  font-size: 14px; font-weight: 800;
  text-decoration: none;
  transition: background .18s, border-color .18s;
  box-shadow: none !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}
.nth-sticky-btn.primary {
  background: var(--brand);
  border-color: var(--brand);
  color: #fff !important;
}
.nth-sticky-btn:hover { background: var(--brand); border-color: var(--brand); color: #fff !important; }
.nth-sticky .nth-iconbtn {
  width: 42px; height: 42px; flex-shrink: 0;
  border-radius: 50%; border: 1px solid var(--border) !important;
  background: #fff !important;
  color:var(--ink) !important;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  box-shadow:none;
}
.nth-sticky .nth-sticky-save{
  width:auto;min-width:72px;padding:0 12px;gap:6px;border-radius:999px;
  font-size:13px;font-weight:800;line-height:1;
}
.nth-sticky .nth-sticky-save .nth-wishlist-label{color:inherit;white-space:nowrap}
.nth-sticky .nth-iconbtn svg { color: var(--muted); transition: color .18s; }
.nth-sticky .nth-iconbtn.active svg { color: #ef4444; }
.nth-sticky .nth-iconbtn.active.w { background: #fee2e2 !important; border-color: #fecaca !important; color:#991b1b !important; }

@media (min-width: 860px) { .nth-sticky { display: none; } }

/* ── Spec table (reuse global .nth-spec-table) ───────────── */
.nth-phone-wrap .nth-spec-table th {
  width: 36%; background: #f8fafc;
}

/* ── Spec group headings ─────────────────────────────────── */
.nth-spec-group { margin-bottom: 20px; }
.nth-spec-heading {
  font-size: 16px; font-weight: 800;
  color: var(--ink); margin: 0 0 8px;
}

/* ── Rating input widget ─────────────────────────────────── */
.nth-rating-widget {
  text-align: center;
  padding: 14px 18px;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 14px;
  margin-top: 20px;
}
.stars-input-container {
  display: inline-flex; gap: 6px;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 767px) {
  .nth-phone-wrap { padding: 0 12px; }
  .nth-phone-hero { padding: 16px; gap: 16px; }
  .nth-phone-title { font-size: 20px; }
  .nth-price-value { font-size: 22px; }
  .nth-highlights-grid { grid-template-columns: repeat(2, 1fr); }
  .nth-related-grid { grid-template-columns: repeat(2, 1fr); }
  .nth-gallery-grid { grid-template-columns: repeat(3, 1fr); }
}

/* =========================================================
 * SINGLE LAPTOP PAGE — .nth-laptop-wrap
 * ======================================================= */

.nth-laptop-wrap {
  max-width: 1400px; margin: 24px auto; padding: 0 18px;
}

.nth-laptop-hero {
  display: grid; grid-template-columns: 1fr; gap: 24px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 18px; padding: 24px;
}
@media (min-width: 900px) {
  .nth-laptop-hero { grid-template-columns: 300px 1fr; }
}

/* Image col */
.nth-laptop-img-col { display: flex; flex-direction: column; gap: 12px; }
.nth-laptop-thumb {
  border: 1px solid var(--border); border-radius: 14px;
  background: #f8fafc; overflow: hidden; min-height: 280px;
  display: flex; align-items: center; justify-content: center;
}
.nth-laptop-thumb img { width: 100%; height: 100%; max-height: 300px; object-fit: contain; display: block; padding: 12px; box-sizing: border-box; }
.nth-laptop-thumbs { display: flex; gap: 8px; flex-wrap: wrap; }
.nth-laptop-thumbs .nth-thumb-btn {
  width: 64px; height: 64px; border: 2px solid var(--border);
  border-radius: 10px; background: #f8fafc; cursor: pointer; overflow: hidden; padding: 0;
  transition: border-color .18s;
}
.nth-laptop-thumbs .nth-thumb-btn img { width: 100%; height: 100%; object-fit: contain; padding: 4px; box-sizing: border-box; }
.nth-laptop-thumbs .nth-thumb-btn.active,
.nth-laptop-thumbs .nth-thumb-btn:hover { border-color: var(--brand); }

/* Info col */
.nth-laptop-info { min-width: 0; }
.nth-laptop-title {
  font-size: 28px; font-weight: 900; color: var(--ink);
  margin: 0 0 10px; line-height: 1.25;
}
.nth-laptop-meta {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 8px; font-size: 13px; color: var(--muted); margin-bottom: 12px;
}
.nth-laptop-type-tag {
  display: inline-block; padding: 3px 10px; border-radius: 999px;
  background: #eff6ff; color: var(--brand); font-size: 12px; font-weight: 700;
  border: 1px solid #bfdbfe;
}

/* Rating */
.nth-laptop-rating {
  display: flex; align-items: center; gap: 8px; margin-bottom: 12px;
}

/* Price block */
.nth-laptop-price-block {
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 14px; padding: 14px 16px; margin-bottom: 14px;
}
.nth-laptop-best-price { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.nth-laptop-mrp { display: flex; align-items: baseline; gap: 8px; }

/* Action buttons */
.nth-laptop-actions {
  display: flex; gap: 8px; flex-wrap: wrap;
  align-items: center; margin-bottom: 10px;
}

/* Sections */
.nth-laptop-sec { margin-top: 36px; }
.nth-laptop-sec > h2 {
  font-size: 22px; font-weight: 900; color: var(--ink);
  margin: 0 0 14px; padding-bottom: 10px;
  border-bottom: 2px solid var(--border);
}

/* Spec group heading override for laptops */
.nth-laptop-wrap .nth-spec-group { margin-bottom: 20px; }
.nth-laptop-wrap .nth-spec-heading { font-size: 16px; font-weight: 800; color: var(--ink); margin: 0 0 8px; }
.nth-laptop-wrap .nth-spec-table th { width: 36%; }

/* Related laptops */
.nth-laptop-wrap .nth-related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 14px;
}

@media (max-width: 767px) {
  .nth-laptop-wrap { padding: 0 12px; }
  .nth-laptop-hero { padding: 16px; gap: 14px; }
  .nth-laptop-title { font-size: 22px; }
  .nth-laptop-wrap .nth-related-grid { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================
 * BEST PHONES BY BUDGET PAGE — .nth-bp-wrap
 * ======================================================= */

.nth-bp-wrap { max-width: 1400px; margin: 24px auto; padding: 0 18px; }

.nth-bp-hero {
  background: #fff; border: 1px solid var(--border);
  border-radius: 18px; padding: 28px 24px; text-align: center;
  margin-bottom: 32px;
}
.nth-bp-hero h1 { font-size: 28px; font-weight: 900; color: var(--ink); margin: 0 0 8px; }
.nth-bp-hero p  { color: var(--muted); font-size: 15px; margin: 0 0 18px; }

.nth-bp-jump { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.nth-bp-jump a {
  padding: 8px 16px; border-radius: 999px; border: 1px solid var(--border);
  background: #fff; color: var(--ink) !important; text-decoration: none;
  font-size: 13px; font-weight: 700; transition: .18s;
}
.nth-bp-jump a:hover { background: var(--brand); border-color: var(--brand); color: #fff !important; }

.nth-bp-tier { margin-top: 44px; scroll-margin-top: 20px; }
.nth-bp-tier-head { margin-bottom: 18px; }
.nth-bp-tier-head h2 { font-size: 24px; font-weight: 900; color: var(--ink); margin: 0 0 6px; }
.nth-bp-blurb { color: var(--muted); font-size: 14px; margin: 0; max-width: 640px; }

.nth-bp-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px; margin-bottom: 16px;
}

.nth-bp-card {
  background: var(--card); border: 1px solid var(--border); border-radius: 14px;
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}
.nth-bp-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0,0,0,.07); }

.nth-bp-img { display: block; height: 170px; background: #f8fafc; }
.nth-bp-img img { width: 100%; height: 100%; object-fit: contain; display: block; }

.nth-bp-body { padding: 12px; display: flex; flex-direction: column; gap: 5px; flex: 1; }
.nth-bp-brand { font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; }
.nth-bp-name { font-size: 14px; font-weight: 800; margin: 0; line-height: 1.35; }
.nth-bp-name a { color: var(--ink) !important; text-decoration: none; }
.nth-bp-name a:hover { color: var(--brand) !important; }

.nth-bp-rating { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); }
.nth-bp-stars { position: relative; width: 60px; height: 12px; display: inline-block; }
.nth-bp-stars::before, .nth-bp-stars::after {
  content: '★★★★★'; position: absolute; top: 0; left: 0; font-size: 12px; letter-spacing: 1px;
}
.nth-bp-stars::before { color: #e2e8f0; }
.nth-bp-stars::after  { color: #f59e0b; width: var(--fill, 0%); overflow: hidden; white-space: nowrap; }

.nth-bp-price { font-size: 16px; font-weight: 900; color: #059669; margin-top: auto; }

.nth-bp-foot { display: flex; gap: 6px; margin-top: 6px; }
.nth-bp-btn, .nth-bp-cmp {
  flex: 1; text-align: center; padding: 7px 8px !important; border-radius: 8px !important;
  font-size: 12px; font-weight: 700; text-decoration: none; box-shadow: none !important;
}
.nth-bp-btn { background: var(--brand) !important; color: #fff !important; }
.nth-bp-btn:hover { background: var(--brand-dark) !important; }
.nth-bp-cmp { background: #fff !important; border: 1px solid var(--border) !important; color: var(--ink) !important; }
.nth-bp-cmp:hover { border-color: var(--brand) !important; color: var(--brand) !important; }

.nth-bp-viewall {
  display: inline-block; color: var(--brand) !important; font-weight: 700;
  font-size: 14px; text-decoration: none;
}
.nth-bp-viewall:hover { text-decoration: underline; }

.nth-bp-faq-list { display: grid; gap: 8px; }
.nth-bp-faq-item {
  border: 1px solid var(--border); border-radius: 12px; background: #fff; padding: 0;
}
.nth-bp-faq-item summary {
  padding: 14px 16px; font-weight: 800; font-size: 15px; color: var(--ink);
  cursor: pointer; list-style: none;
}
.nth-bp-faq-item summary::-webkit-details-marker { display: none; }
.nth-bp-faq-item div { padding: 0 16px 14px; color: var(--muted); font-size: 14px; line-height: 1.6; }

@media (max-width: 767px) {
  .nth-bp-wrap { padding: 0 12px; }
  .nth-bp-hero { padding: 20px 16px; }
  .nth-bp-hero h1 { font-size: 22px; }
  .nth-bp-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .nth-bp-img { height: 130px; }
}

/* =========================================================
 * UNIVERSAL SEARCH DROPDOWN — homepage hero
 * ======================================================= */

.nth-search-wrap-home { position: relative; flex: 1; min-width: 0; }

/* .nth-search-input previously relied on being a direct flex child
   for its sizing (flex:1). Now that it's nested one level deeper
   inside .nth-search-wrap-home, it needs an explicit width so it
   fills the wrapper instead of shrinking to content width. */
.nth-search-form .nth-search-wrap-home .nth-search-input {
  width: 100%;
}

.nth-search-dropdown {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0;
  background: #fff; border: 1px solid var(--border); border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0,0,0,.12); max-height: 360px; overflow-y: auto;
  z-index: 999;
}

.nth-search-result {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  text-decoration: none; border-bottom: 1px solid #f1f5f9; transition: background .15s;
}
.nth-search-result:last-child { border-bottom: none; }
.nth-search-result:hover { background: #f8fafc; }

.nth-search-result img,
.nth-search-noimg {
  width: 40px; height: 40px; object-fit: contain; border-radius: 8px;
  border: 1px solid var(--border); background: #f8fafc; flex-shrink: 0;
}

.nth-search-result-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.nth-search-result-type {
  font-size: 10px; font-weight: 800; color: var(--brand); text-transform: uppercase;
  letter-spacing: .04em;
}
.nth-search-result-name {
  font-size: 14px; font-weight: 700; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.nth-search-result-price { font-size: 12px; font-weight: 800; color: #059669; }

.nth-search-empty { padding: 16px; text-align: center; color: var(--muted); font-size: 13px; }

@media (max-width: 640px) {
  .nth-search-dropdown { max-height: 300px; }
}

/* Phase 10C: removed orphan .nth-pf-* Phone Finder CSS.
 * No matching Phone Finder template/markup exists in the supplied current theme.
 */

/* =========================================================
 * ICON-BASED HIGHLIGHT CARDS + EXPERT SCORE BREAKDOWN
 * single-phones.php
 * ======================================================= */

.nth-highlight-box {
  display: flex; align-items: flex-start; gap: 10px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; padding: 12px;
}
.nth-highlight-icon {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 9px;
  background: #eff6ff; color: var(--brand);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.nth-highlight-icon svg { width: 18px !important; height: 18px !important; max-width: 18px; max-height: 18px; }
.nth-highlight-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.nth-expert-scores {
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  padding: 18px; margin: 16px 0;
}
.nth-expert-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 16px;
}
.nth-expert-title { font-size: 17px; font-weight: 900; color: var(--ink); margin: 0; }
.nth-expert-overall {
  font-size: 20px; font-weight: 900; color: var(--brand);
}
.nth-expert-overall span { font-size: 12px; font-weight: 700; color: var(--muted); }

.nth-expert-row { margin-bottom: 14px; }
.nth-expert-row:last-child { margin-bottom: 0; }
.nth-expert-row-top {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 5px; font-size: 13px;
}
.nth-expert-label { font-weight: 700; color: var(--ink); }
.nth-expert-num { font-weight: 800; color: var(--muted); }

.nth-expert-bar {
  height: 7px; border-radius: 999px; background: var(--bg); overflow: hidden;
}
.nth-expert-fill {
  height: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #22c55e, #2563eb);
  transition: width .4s ease;
}

@media (max-width: 767px) {
  .nth-highlight-box { padding: 10px; }
  .nth-highlight-icon { width: 30px; height: 30px; }
  .nth-expert-scores { padding: 14px; }
}

/* =========================================================
 * BENCHMARK SCORES — single-phones.php
 * ======================================================= */

.nth-bench-scores {
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  padding: 18px; margin: 16px 0;
}
.nth-bench-title { font-size: 17px; font-weight: 900; color: var(--ink); margin: 0 0 14px; }

.nth-bench-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px;
}

.nth-bench-card {
  display: flex; align-items: flex-start; gap: 10px;
  background: var(--bg); border: 1px solid var(--border);
  border-radius: 12px; padding: 12px;
}
.nth-bench-icon {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 9px;
  background: #f0fdf4; color: #16a34a;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.nth-bench-icon svg { width: 18px !important; height: 18px !important; max-width: 18px; max-height: 18px; }

.nth-bench-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nth-bench-label { font-size: 12px; font-weight: 700; color: var(--muted); }
.nth-bench-value { font-size: 19px; font-weight: 900; color: var(--ink); line-height: 1.2; }
.nth-bench-desc { font-size: 11px; color: var(--muted); line-height: 1.4; }

@media (max-width: 767px) {
  .nth-bench-scores { padding: 14px; }
  .nth-bench-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .nth-bench-card { padding: 10px; }
  .nth-bench-value { font-size: 16px; }
}

/* =========================================================
 * HOMEPAGE ADVANCED UPGRADE — front-page.php
 * ======================================================= */

/* ── Category quick-nav ──────────────────────────────────── */
.nth-cat-nav {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 10px; margin: 20px 0;
}
.nth-cat-item {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 14px 6px; background: #fff; border: 1px solid var(--border);
  border-radius: 14px; text-decoration: none; transition: .18s;
}
.nth-cat-item:hover { border-color: var(--brand); transform: translateY(-2px); }
.nth-cat-icon {
  width: 38px; height: 38px; border-radius: 10px;
  background: #eff6ff; color: var(--brand);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.nth-cat-icon svg { width: 20px !important; height: 20px !important; max-width: 20px; max-height: 20px; }
.nth-cat-label {
  font-size: 11px; font-weight: 700; color: var(--ink);
  text-align: center; line-height: 1.3;
}

/* ── Trust / stats bar ───────────────────────────────────── */
.nth-stats-bar {
  display: flex; justify-content: center; gap: 32px;
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  padding: 18px; margin-bottom: 20px; flex-wrap: wrap;
}
.nth-stat-item { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.nth-stat-num { font-size: 22px; font-weight: 900; color: var(--brand); }
.nth-stat-label { font-size: 11px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .03em; }

/* ── NEW badge on product cards ──────────────────────────── */
.nth-new-badge {
  position: absolute; top: 8px; left: 8px; z-index: 2;
  background: #ef4444; color: #fff; font-size: 10px; font-weight: 900;
  padding: 3px 8px; border-radius: 999px; letter-spacing: .03em;
}
.nth-card-img { position: relative; }

/* ── Feature discovery teaser cards ──────────────────────── */
.nth-feature-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
.nth-feature-card {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1px solid var(--border); border-radius: 16px;
  padding: 18px; text-decoration: none; transition: .2s;
}
.nth-feature-card:hover { border-color: var(--brand); box-shadow: 0 8px 20px rgba(0,0,0,.06); }
.nth-feature-icon { font-size: 30px; flex-shrink: 0; }
.nth-feature-text { flex: 1; min-width: 0; }
.nth-feature-text h3 { font-size: 15px; font-weight: 900; color: var(--ink); margin: 0 0 3px; }
.nth-feature-text p { font-size: 12px; color: var(--muted); margin: 0; line-height: 1.4; }
.nth-feature-arrow { font-size: 18px; color: var(--brand); flex-shrink: 0; }

/* ── Responsive ───────────────────────────────────────────── */
@media (max-width: 767px) {
  .nth-cat-nav { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .nth-cat-item { padding: 10px 4px; }
  .nth-cat-icon { width: 32px; height: 32px; }
  .nth-cat-label { font-size: 10px; }

  .nth-stats-bar { gap: 20px; padding: 14px; }
  .nth-stat-num { font-size: 18px; }

  .nth-feature-grid { grid-template-columns: 1fr; }
}

/* =========================================================
 * SHOP BY BRAND + ABOUT SECTION + ICON UPDATES
 * front-page.php — kept plain/professional, no bright accents
 * ======================================================= */

/* Trending Now icon (replaces emoji) */
.nth-trend-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 8px;
  background: var(--bg); color: var(--muted);
  vertical-align: middle; margin-right: 4px;
}

/* Feature card icon — now SVG, not emoji font-size */
.nth-feature-icon {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 12px;
  background: var(--bg); color: var(--brand);
  display: flex; align-items: center; justify-content: center;
}

/* Shop by Brand (logos) */
.nth-brand-shop-section { text-align: center; }
.nth-brand-shop-sub { color: var(--muted); font-size: 14px; margin: 4px 0 20px; }

.nth-brand-shop-grid {
  display: grid; grid-template-columns: repeat(6, 1fr);
  gap: 12px; text-align: left;
}
.nth-brand-shop-item {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 16px 8px; background: #fff; border: 1px solid var(--border);
  border-radius: 14px; text-decoration: none; transition: .18s;
}
.nth-brand-shop-item:hover { border-color: var(--brand); box-shadow: 0 6px 16px rgba(0,0,0,.05); }

.nth-brand-shop-logo {
  width: 52px; height: 52px; border-radius: 10px;
  background: var(--bg); display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.nth-brand-shop-logo img { max-width: 36px; max-height: 36px; object-fit: contain; }
.nth-brand-shop-logo-text {
  font-size: 18px; font-weight: 900; color: var(--muted);
}
.nth-brand-shop-name {
  font-size: 12px; font-weight: 700; color: var(--ink); text-align: center;
}

/* About / SEO section — plain, readable, no decoration */
.nth-about-section { max-width: 820px; margin-left: auto; margin-right: auto; }
.nth-about-body p {
  font-size: 14px; line-height: 1.75; color: var(--muted); margin: 0 0 14px;
}
.nth-about-body p:last-child { margin-bottom: 0; }

/* Responsive */
@media (max-width: 767px) {
  .nth-brand-shop-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .nth-brand-shop-item { padding: 12px 6px; }
  .nth-brand-shop-logo { width: 44px; height: 44px; }
  .nth-brand-shop-logo img { max-width: 28px; max-height: 28px; }
  .nth-about-body p { font-size: 13.5px; }
}
/* =========================================================
   v4.9 — Single phone page: EMI calculator, verdict box,
   sticky section nav. Scoped under .nth-phone-wrap /
   component classes so nothing else is affected.
   ========================================================= */

/* ---------- EMI calculator ---------- */
.nth-emi{
  border:1px solid #bfdbfe;
  background:linear-gradient(135deg,#eff6ff,#fff);
  border-radius:14px;
  padding:16px 18px;
  margin:14px 0 4px;
}
.nth-emi-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:8px}
.nth-emi-title{font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#1d4ed8}
.nth-emi-sub{font-size:12.5px;color:#64748b;font-weight:600}
.nth-emi-main{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:12px}
.nth-emi-amount{font-size:27px;font-weight:900;color:#0f172a;line-height:1.1;font-variant-numeric:tabular-nums}
.nth-emi-per{font-size:13.5px;color:#64748b;font-weight:600}
.nth-emi-terms{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:11px}
.nth-emi-term{
  padding:7px 15px;border-radius:999px;border:1px solid #cbd5e1;background:#fff !important;
  font-size:13.5px;font-weight:800;color:#334155 !important;cursor:pointer;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
  font-variant-numeric:tabular-nums;line-height:1.2;
  box-shadow:none;
}
.nth-emi-term:hover{border-color:#1d4ed8;color:#1d4ed8 !important;background:#eff6ff !important;transform:none}
.nth-emi-term.active{background:#1d4ed8 !important;border-color:#1d4ed8;color:#fff !important}
.nth-emi-term:focus-visible{outline:2px solid #1d4ed8;outline-offset:2px}
.nth-emi-note{margin:0;font-size:12.5px;line-height:1.55;color:#64748b}

/* ---------- Verdict box ---------- */
.nth-verdict{
  border:1px solid #e2e8f0;border-left:4px solid #1d4ed8;
  background:#fff;border-radius:0 14px 14px 0;
  padding:20px 22px;margin:26px 0;
}
.nth-verdict-title{margin:0 0 9px;font-size:20px;font-weight:800;color:#0f172a;line-height:1.3}
.nth-verdict-text{margin:0;font-size:16px;line-height:1.68;color:#334155}
.nth-verdict-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;
  margin-top:17px;padding-top:16px;border-top:1px solid #f1f5f9;
}
.nth-verdict-label{
  display:block;font-size:11.5px;font-weight:800;letter-spacing:.07em;
  text-transform:uppercase;margin-bottom:7px;
}
.nth-verdict-pro .nth-verdict-label{color:#16a34a}
.nth-verdict-con .nth-verdict-label{color:#dc2626}
.nth-verdict-col ul{margin:0;padding-left:19px}
.nth-verdict-col li{margin-bottom:5px;font-size:14.5px;line-height:1.55;color:#475569}
.nth-verdict-pro li::marker{color:#16a34a}
.nth-verdict-con li::marker{color:#dc2626}
@media (max-width:640px){
  .nth-verdict{padding:17px 18px}
  .nth-verdict-grid{grid-template-columns:1fr;gap:14px}
}

/* ---------- Sticky section nav ---------- */
.nth-toc-sticky{
  position:sticky;top:0;z-index:30;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(8px);
  -webkit-backdrop-filter:saturate(180%) blur(8px);
  border-bottom:1px solid #e2e8f0;
  padding:9px 0;margin-bottom:6px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;
}
.nth-toc-sticky::-webkit-scrollbar{display:none}
.nth-toc-sticky a{white-space:nowrap;transition:color .15s ease,border-color .15s ease}
.nth-toc-sticky a.active{color:#1d4ed8;border-color:#1d4ed8;font-weight:800}
@media (prefers-reduced-motion:reduce){
  .nth-emi-term,.nth-toc-sticky a{transition:none}
}

/* =========================================================
   v4.11 — Sitewide trust layer: breadcrumb fallback,
   verified-line (product pages), author box (articles).
   ========================================================= */

/* ---------- Breadcrumb (shared: Yoast output or fallback) ---------- */
.nth-bc{font-size:13px;color:#64748b;margin:10px 0 14px;line-height:1.6}
.nth-bc a{color:#64748b;text-decoration:none;border-bottom:1px solid transparent}
.nth-bc a:hover{color:#1d4ed8;border-bottom-color:#1d4ed8}
.nth-bc .sep{color:#cbd5e1;margin:0 2px}
.nth-bc [aria-current="page"]{color:#0f172a;font-weight:600}

/* ---------- Verified line (product pages) ---------- */
.nth-verified-line{
  display:flex;align-items:center;gap:7px;
  font-size:13.5px;color:#475569;margin:6px 0 14px;
}
.nth-verified-line svg{flex-shrink:0;color:#16a34a}
.nth-verified-line strong{color:#0f172a;font-weight:700}

/* ---------- Author box (articles/reviews) ---------- */
.nth-author-box{
  display:flex;gap:14px;align-items:flex-start;
  border:1px solid #e2e8f0;border-radius:14px;
  background:#f8fafc;padding:18px 20px;margin:24px 0;
}
.nth-author-avatar{border-radius:50%;flex-shrink:0;width:56px;height:56px}
.nth-author-info{min-width:0}
.nth-author-label{display:block;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#94a3b8;margin-bottom:2px}
.nth-author-name{display:inline-block;font-size:16.5px;font-weight:800;color:#0f172a;text-decoration:none;border-bottom:none;margin-bottom:5px}
.nth-author-name:hover{color:#1d4ed8}
.nth-author-bio{margin:0 0 6px;font-size:14px;line-height:1.55;color:#475569}
.nth-author-count{font-size:12.5px;color:#94a3b8;font-weight:600}

@media (max-width:640px){
  .nth-author-box{padding:15px 16px;gap:12px}
  .nth-author-avatar{width:46px;height:46px}
}

/* =========================================================
   v4.12 — Mega footer, HTML sitemap, and mega-menu dropdown
   polish (D1/D2/D3). Design tokens consolidated separately
   (see the top of this file) — no new tokens introduced here,
   these reuse the existing --brand/--ink/--muted/--border set.
   ========================================================= */

/* ---------- v5.08 Professional site footer ---------- */
.site-footer{background:#0b1220;color:#cbd5e1;width:100%;max-width:none}
.site-footer .site-info,
.site-footer .inside-site-info,
.site-footer .grid-container{width:100%;max-width:none;box-sizing:border-box}
.site-footer .grid-container{padding:0}
.site-footer .inside-site-info{display:block;padding:0 !important;margin:0 !important}
.nth-site-footer{width:100%;max-width:100%;box-sizing:border-box;background:#0b1220;color:#cbd5e1;border-top:1px solid rgba(148,163,184,.16)}
.nth-footer-inner{width:min(1400px,calc(100% - 40px));margin:0 auto}

.nth-footer-trust{background:#101a2e;border-bottom:1px solid rgba(148,163,184,.14)}
.nth-footer-trust-inner{min-height:54px;display:flex;align-items:center;justify-content:center;gap:34px;flex-wrap:wrap;padding:11px 0;color:#aebdd0;font-size:13.5px}
.nth-footer-trust-inner span{display:flex;align-items:center;gap:5px;white-space:nowrap}
.nth-footer-trust-inner span+span:before{content:"";width:4px;height:4px;border-radius:50%;background:#3b82f6;margin-right:28px}
.nth-footer-trust-inner strong{color:#f8fafc;font-weight:750}

.nth-footer-main{padding:46px 0 28px}
.nth-footer-grid{display:grid;grid-template-columns:minmax(280px,1.5fr) minmax(250px,1.25fr) minmax(170px,.78fr) minmax(170px,.78fr);gap:42px}
.nth-footer-brand{min-width:0}
.nth-footer-wordmark{display:inline-flex;align-items:center;gap:11px;color:#fff!important;font-weight:850;font-size:19px;letter-spacing:-.02em;text-decoration:none!important}
.nth-footer-wordmark-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 10px 26px rgba(37,99,235,.24);font-size:11px;letter-spacing:.06em;color:#fff}
.nth-footer-about{max-width:430px;margin:16px 0 14px;color:#a8b5c8;font-size:14px;line-height:1.72}
.nth-footer-contact{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:13.5px;color:#8fa0b6}
.nth-footer-contact a{color:#d8e2ef!important;text-decoration:none!important}
.nth-footer-contact a:hover{text-decoration:underline!important;color:#fff!important}

.nth-footer-socials{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.nth-footer-socials a{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(148,163,184,.18);border-radius:999px;background:rgba(255,255,255,.025);color:#d5dfeb!important;font-size:12.5px;text-decoration:none!important;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.nth-footer-socials a>span{display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:rgba(59,130,246,.13);color:#bfdbfe;font-size:11px;font-weight:850}
.nth-footer-socials a b{font-weight:650}
.nth-footer-socials a:hover,.nth-footer-socials a:focus-visible{background:rgba(59,130,246,.10);border-color:rgba(96,165,250,.48);transform:translateY(-1px);color:#fff!important}

.nth-footer-advertise{margin-top:22px;max-width:430px;padding:16px 17px;border:1px solid rgba(96,165,250,.24);border-radius:14px;background:linear-gradient(135deg,rgba(37,99,235,.13),rgba(15,23,42,.2))}
.nth-footer-advertise>span{display:block;margin-bottom:3px;color:#93c5fd;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em}
.nth-footer-advertise strong{display:block;color:#f8fafc;font-size:14px;line-height:1.45}
.nth-footer-advertise a{display:inline-flex;margin-top:9px;color:#bfdbfe!important;font-size:13px;font-weight:750;text-decoration:none!important}
.nth-footer-advertise a:hover{color:#fff!important;text-decoration:underline!important}

.nth-footer-nav h2{margin:0 0 15px;color:#fff;font-size:13px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.nth-footer-nav h3{margin:15px 0 7px;color:#8fa0b6;font-size:11.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.nth-footer-nav .nth-footer-link-group:first-of-type h3{margin-top:0}
.nth-footer-nav ul{list-style:none;margin:0;padding:0}
.nth-footer-nav li{margin:0 0 8px;line-height:1.45}
.nth-footer-nav a{color:#c9d4e2!important;font-size:13.7px;text-decoration:none!important}
.nth-footer-nav a:hover,.nth-footer-nav a:focus-visible{color:#fff!important;text-decoration:underline!important;text-underline-offset:3px}

.nth-footer-brands{display:flex;align-items:flex-start;gap:18px;margin-top:30px;padding-top:23px;border-top:1px solid rgba(148,163,184,.14)}
.nth-footer-brands-label{flex:0 0 auto;padding-top:5px;color:#7f91a9;font-size:11px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.nth-footer-brand-links{display:flex;gap:7px;flex-wrap:wrap}
.nth-footer-brand-links a{padding:5px 10px;border:1px solid rgba(148,163,184,.14);border-radius:999px;background:rgba(255,255,255,.02);color:#aebdd0!important;font-size:12.5px;text-decoration:none!important}
.nth-footer-brand-links a:hover{border-color:rgba(96,165,250,.42);color:#fff!important;background:rgba(59,130,246,.08)}

.nth-footer-bottom{margin-top:1px;border-top:1px solid rgba(148,163,184,.15);background:#080e19}
.nth-footer-bottom-inner{min-height:74px;padding:14px 0;display:flex;justify-content:space-between;align-items:center;gap:24px}
.nth-footer-bottom-inner>div{display:flex;flex-direction:column;gap:3px;min-width:0}
.nth-footer-bottom-inner strong{color:#cbd5e1;font-size:12.7px;font-weight:700}
.nth-footer-bottom-inner span{max-width:790px;color:#718198;font-size:11.8px;line-height:1.5}
.nth-footer-bottom nav{display:flex;gap:15px;flex-wrap:wrap;justify-content:flex-end}
.nth-footer-bottom a{color:#91a2b8!important;font-size:12px;text-decoration:none!important}
.nth-footer-bottom a:hover{color:#fff!important;text-decoration:underline!important}

@media (max-width:1080px){
  .nth-footer-grid{grid-template-columns:minmax(280px,1.35fr) repeat(3,minmax(150px,1fr));gap:28px}
}
@media (max-width:900px){
  .nth-footer-grid{grid-template-columns:1.35fr 1fr 1fr;gap:30px 26px}
  .nth-footer-brand{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;gap:0 28px;align-items:start}
  .nth-footer-brand .nth-footer-wordmark,.nth-footer-brand .nth-footer-about,.nth-footer-brand .nth-footer-contact,.nth-footer-brand .nth-footer-socials{grid-column:1}
  .nth-footer-brand .nth-footer-advertise{grid-column:2;grid-row:1/5;margin-top:0}
}
@media (max-width:680px){
  .nth-footer-inner{width:min(100% - 30px,1400px)}
  .nth-footer-trust-inner{justify-content:flex-start;gap:8px 18px;padding:12px 0;font-size:12.5px}
  .nth-footer-trust-inner span+span:before{display:none}
  .nth-footer-main{padding:34px 0 22px}
  .nth-footer-grid{grid-template-columns:1fr 1fr;gap:30px 22px}
  .nth-footer-brand{grid-column:1/-1;display:block}
  .nth-footer-brand .nth-footer-advertise{margin-top:20px}
  .nth-footer-nav:first-of-type{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:0 22px}
  .nth-footer-nav:first-of-type>h2{grid-column:1/-1}
  .nth-footer-nav:first-of-type .nth-footer-link-group:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:22px}
  .nth-footer-nav:first-of-type .nth-footer-link-group:last-child h3{grid-column:1/-1}
  .nth-footer-brands{display:block;margin-top:26px;padding-top:20px}
  .nth-footer-brands-label{display:block;margin-bottom:10px;padding:0}
  .nth-footer-bottom-inner{display:block;padding:18px 0}
  .nth-footer-bottom nav{justify-content:flex-start;margin-top:12px}
}
@media (max-width:430px){
  .nth-footer-grid{gap:27px 18px}
  .nth-footer-about{font-size:13.5px}
  .nth-footer-socials a{padding:6px 9px}
  .nth-footer-socials a b{display:none}
  .nth-footer-socials a>span{width:24px;height:24px}
  .nth-footer-nav a{font-size:13.2px}
}

/* ---------- HTML Sitemap page ([nth_sitemap]) ---------- */
.nth-sitemap{max-width:1000px;margin:0 auto}
.nth-sitemap-sec{margin-bottom:32px}
.nth-sitemap-sec h2{
  font-size:19px;font-weight:800;color:var(--ink,#0f172a);
  margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--border,#e2e8f0);
}
.nth-sitemap-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px 18px;
}
.nth-sitemap-grid li a{
  color:var(--brand,#1d4ed8);text-decoration:none;font-size:14.5px;line-height:1.7;
}
.nth-sitemap-grid li a:hover{text-decoration:underline}

/* ---------- Mega-menu dropdown polish (auto-generated brand lists) ---------- */
.menu-item-has-children .sub-menu{min-width:200px}
.nth-menu-viewall > a{
  font-weight:700 !important;color:var(--brand,#1d4ed8) !important;
  border-top:1px solid var(--border,#e2e8f0);margin-top:4px;padding-top:10px !important;
}

/* =========================================================
   v4.13 — Header & Navigation (professional polish)
   ---------------------------------------------------------
   style.css had ZERO header/nav-specific rules before this —
   the header was 100% unstyled GeneratePress defaults. This
   uses GeneratePress's standard, stable class names
   (.site-header, .main-navigation, .sub-menu, .menu-toggle,
   .dropdown-menu-toggle) and the site's existing design tokens
   (--brand/--ink/--muted/--border/--radius/--shadow), so it
   restyles what's there rather than overriding GP's JS-driven
   show/hide behaviour for the mobile menu.
   ========================================================= */

/* ---------- Sticky header ---------- */
.site-header{
  position:sticky;top:0;z-index:200;
  background:#fff;
  border-bottom:1px solid var(--border,#e2e8f0);
  box-shadow:0 1px 0 rgba(15,23,42,.03);
}
.admin-bar .site-header{top:32px}
@media (max-width:782px){ .admin-bar .site-header{top:46px} }

/* Phase 16J-5 — Mobile visual-regression hotfix
 * The global desktop sticky header made the separate GeneratePress logo row
 * float over product/spec content on phones and compact tablets. Keep the
 * professional sticky behaviour on desktop, but let the logo row scroll in
 * normal document flow below 901px. Navigation/menu behaviour is untouched.
 */
@media (max-width:900px){
  .site-header,
  .admin-bar .site-header{
    position:relative !important;
    top:auto !important;
  }
}

/* ---------- Logo ---------- */
.site-header .site-logo img,
.site-header .custom-logo{
  max-height:44px;width:auto;
}

/* ---------- Primary nav bar ---------- */
.main-navigation{background:transparent}
.main-navigation .main-nav > ul > li > a,
.main-navigation ul#primary-menu > li > a{
  color:var(--ink,#0f172a);
  font-weight:600;
  font-size:14.5px;
  padding:14px 14px !important;
  transition:color .15s ease;
}
.main-navigation .main-nav > ul > li > a:hover,
.main-navigation ul#primary-menu > li > a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a{
  color:var(--brand,#1d4ed8) !important;
}

/* Dropdown arrow on items that have children — pure CSS, no markup change */
.main-navigation .menu-item-has-children > a::after{
  content:"";
  display:inline-block;
  width:6px;height:6px;
  margin-left:6px;margin-bottom:2px;
  border-right:1.5px solid currentColor;
  border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);
  opacity:.55;
}

/* ---------- Dropdown / mega panels (2nd and 3rd level flyouts) ---------- */
.main-navigation ul ul,
.main-navigation .sub-menu{
  background:#fff;
  border:1px solid var(--border,#e2e8f0);
  border-radius:12px;
  box-shadow:0 12px 28px -8px rgba(15,23,42,.14), 0 4px 10px -6px rgba(15,23,42,.08);
  padding:8px;
  min-width:210px;
}
.main-navigation ul ul li a,
.main-navigation .sub-menu li a{
  color:var(--ink,#0f172a) !important;
  font-weight:500;
  font-size:14px;
  padding:9px 12px !important;
  border-radius:8px;
}
.main-navigation ul ul li a:hover,
.main-navigation .sub-menu li a:hover{
  background:var(--nth-accent-soft,#eff6ff);
  color:var(--brand,#1d4ed8) !important;
}
/* 3rd-level flyout (brand dropdowns nested under Audio/Smart Devices/
   Home Appliances) opens to the right of its parent, not stacked below. */
.main-navigation ul ul ul,
.main-navigation .sub-menu .sub-menu{
  top:-8px;
}
@media (min-width:769px){
  .main-navigation ul ul ul,
  .main-navigation .sub-menu .sub-menu{
    left:100%;
    margin-left:4px;
  }
}

/* "View all X" link at the bottom of an auto-generated brand dropdown */
.main-navigation .nth-menu-viewall > a{
  font-weight:700 !important;
  color:var(--brand,#1d4ed8) !important;
  border-top:1px solid var(--border,#e2e8f0);
  margin-top:4px;padding-top:10px !important;
}

/* ---------- Login / My Account / Logout (auto-injected items) ---------- */
.main-navigation .menu-item-nth-login > a,
.main-navigation .menu-item-nth-account > a{
  display:inline-flex;align-items:center;gap:6px;
  color:#fff !important;
  background:var(--brand,#1d4ed8);
  border-radius:999px;
  padding:8px 16px !important;
  font-weight:700;
}
.main-navigation .menu-item-nth-login > a:hover,
.main-navigation .menu-item-nth-account > a:hover{
  background:var(--brand-dark,#1e40af);
  color:#fff !important;
}
.main-navigation .menu-item-nth-logout > a{
  color:var(--muted,#64748b) !important;
  font-weight:600;
}
.main-navigation .menu-item-nth-logout > a:hover{color:#dc2626 !important}

/* ---------- Mobile menu toggle + panel ---------- */
.menu-toggle{
  border-radius:10px !important;
  color:var(--ink,#0f172a) !important;
}
.menu-toggle:hover{background:var(--nth-accent-soft,#eff6ff) !important}

@media (max-width:768px){
  .main-navigation ul ul,
  .main-navigation .sub-menu{
    box-shadow:none;
    border:none;
    border-radius:0;
    background:#f8fafc;
    padding:2px 0 2px 14px;
  }
  .main-navigation .menu-item-has-children > a::after{display:none} /* GP's own toggle arrow handles this on mobile */
  .main-navigation .menu-item-nth-login > a,
  .main-navigation .menu-item-nth-account > a{
    border-radius:10px;
    justify-content:center;
    margin:8px 14px;
  }
}

/* ---------- Focus visibility (accessibility) ---------- */
.main-navigation a:focus-visible{
  outline:2px solid var(--brand,#1d4ed8);
  outline-offset:-2px;
  border-radius:6px;
}

/* =========================================================
 * HEADER POLISH (v4.54)
 * ---------------------------------------------------------
 * The existing header rules above restyled individual pieces (logo, links,
 * the Login pill) but never made an explicit statement about how the ROW
 * containing them lines up. That worked by relying on GeneratePress's
 * default flex behaviour for the menu list -- fine until the mega-menu
 * trigger and header search (added separately, appended into that same row)
 * needed to be guaranteed to sit on one clean baseline rather than "probably
 * fine because GP usually does this."
 *
 * This section makes that alignment explicit and adds the finishing touches
 * a comparison-site header needs to read as deliberate rather than default:
 * the category trigger looks like a control that opens something, not a
 * plain link; the search box matches the nav bar's own height instead of
 * looking pasted on; and there is a visible break between "navigate the
 * site" (the links) and "find a specific thing" (the search).
 * ========================================================= */

/* Force the menu row itself to be a flex line, with wrapping allowed so
   narrower desktop widths reflow instead of clipping content off-screen. */
.main-navigation .main-nav > ul,
.main-navigation ul#primary-menu{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  row-gap:4px;
}

/* The "All Categories" trigger reads as a plain text link by default, no
   different from "Reviews" or "Compare" next to it -- but it opens a large
   panel, not a page, and deserves to look like it. A soft filled pill (not
   the solid brand-blue used for Login, which should stay visually reserved
   for "your account") signals "control" without competing with it. */
.main-navigation .nth-mega-trigger{
  padding:8px 14px !important;
  border-radius:999px;
  background:var(--nth-accent-soft,#eff6ff);
  transition:background .15s ease, color .15s ease;
}
.main-navigation .nth-mega-trigger:hover,
.main-navigation .nth-mega-item:focus-within .nth-mega-trigger{
  background:#dbeafe;
  color:var(--brand,#1d4ed8) !important;
}
.main-navigation .nth-mega-burger span{background:currentColor}

/* A quiet vertical rule between the nav links and the search box marks the
   handoff from "browse" to "look something specific up" -- small, but it is
   the difference between a header that reads as assembled from parts and
   one that reads as a single, considered layout. Hidden on the mobile stack,
   where the search sits on its own full-width row and a divider would just
   be a stray line. */
.nth-header-search-li{
  padding-left:18px;
  border-left:1px solid var(--border,#e2e8f0);
  /* margin-left is intentionally NOT set here -- header-nav.php's own rule
     already sets margin-left:auto on this element, which is what pushes the
     search box to the right edge of the row. Setting a fixed value here
     would silently cancel that push and leave the box stranded right after
     the last nav item instead of at the row's edge. */
}
@media (max-width:768px){
  .nth-header-search-li{border-left:none;padding-left:0}
}

/* Match the search input's vertical rhythm to the nav links beside it
   (14px vertical padding on the links, per the rule earlier in this file) so
   the box reads as the same height as the row it sits in, not a slightly
   smaller element floating in a taller one. */
.nth-hsearch-input{
  padding-top:11px !important;
  padding-bottom:11px !important;
}
.nth-hsearch-input:focus-visible{
  outline:2px solid var(--brand,#1d4ed8);
  outline-offset:1px;
}

/* =========================================================
 * KEY SPECS ICON GRID -- all 12 single templates (v4.32)
 * Same visual design as single-phones.php's .nth-highlight-box
 * (see "ICON-BASED HIGHLIGHT CARDS" above), reproduced here under
 * prefixed class names per category so no two templates ever share
 * the same selector -- that collision is exactly what broke
 * single-laptops.php's old highlight box before v4.31 fixed it.
 * One shared rule block below (not 11 separate ones) since the
 * visual design is intentionally identical; only the class name
 * differs per template. ======================================= */

.nth-kspec-tablet-grid,
.nth-kspec-tv-grid,
.nth-kspec-sw-grid,
.nth-kspec-camera-grid,
.nth-kspec-earbud-grid,
.nth-kspec-headphone-grid,
.nth-kspec-speaker-grid,
.nth-kspec-fridge-grid,
.nth-kspec-wm-grid,
.nth-kspec-ac-grid,
.nth-kspec-laptop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin: 18px 0;
}

.nth-kspec-tablet-box,
.nth-kspec-tv-box,
.nth-kspec-sw-box,
.nth-kspec-camera-box,
.nth-kspec-earbud-box,
.nth-kspec-headphone-box,
.nth-kspec-speaker-box,
.nth-kspec-fridge-box,
.nth-kspec-wm-box,
.nth-kspec-ac-box,
.nth-kspec-laptop-box {
  display: flex; align-items: flex-start; gap: 10px;
  background: #fff; border: 1px solid var(--border);
  border-radius: 12px; padding: 12px;
}

.nth-kspec-tablet-icon,
.nth-kspec-tv-icon,
.nth-kspec-sw-icon,
.nth-kspec-camera-icon,
.nth-kspec-earbud-icon,
.nth-kspec-headphone-icon,
.nth-kspec-speaker-icon,
.nth-kspec-fridge-icon,
.nth-kspec-wm-icon,
.nth-kspec-ac-icon,
.nth-kspec-laptop-icon {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 9px;
  background: #eff6ff; color: var(--brand);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}

.nth-kspec-tablet-icon,
.nth-kspec-tv-icon,
.nth-kspec-sw-icon,
.nth-kspec-camera-icon,
.nth-kspec-earbud-icon,
.nth-kspec-headphone-icon,
.nth-kspec-speaker-icon,
.nth-kspec-fridge-icon,
.nth-kspec-wm-icon,
.nth-kspec-ac-icon,
.nth-kspec-laptop-icon svg { width: 18px !important; height: 18px !important; max-width: 18px; max-height: 18px; }

.nth-kspec-tablet-text,
.nth-kspec-tv-text,
.nth-kspec-sw-text,
.nth-kspec-camera-text,
.nth-kspec-earbud-text,
.nth-kspec-headphone-text,
.nth-kspec-speaker-text,
.nth-kspec-fridge-text,
.nth-kspec-wm-text,
.nth-kspec-ac-text,
.nth-kspec-laptop-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.nth-kspec-tablet-label,
.nth-kspec-tv-label,
.nth-kspec-sw-label,
.nth-kspec-camera-label,
.nth-kspec-earbud-label,
.nth-kspec-headphone-label,
.nth-kspec-speaker-label,
.nth-kspec-fridge-label,
.nth-kspec-wm-label,
.nth-kspec-ac-label,
.nth-kspec-laptop-label {
  display: block;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}

.nth-kspec-tablet-val,
.nth-kspec-tv-val,
.nth-kspec-sw-val,
.nth-kspec-camera-val,
.nth-kspec-earbud-val,
.nth-kspec-headphone-val,
.nth-kspec-speaker-val,
.nth-kspec-fridge-val,
.nth-kspec-wm-val,
.nth-kspec-ac-val,
.nth-kspec-laptop-val { font-size: 13px; font-weight: 700; color: var(--ink); word-break: break-word; }

@media (max-width: 480px) {
.nth-kspec-tablet-grid,
.nth-kspec-tv-grid,
.nth-kspec-sw-grid,
.nth-kspec-camera-grid,
.nth-kspec-earbud-grid,
.nth-kspec-headphone-grid,
.nth-kspec-speaker-grid,
.nth-kspec-fridge-grid,
.nth-kspec-wm-grid,
.nth-kspec-ac-grid,
.nth-kspec-laptop-grid { grid-template-columns: repeat(2, 1fr); }
}

/* =========================================================
   Phase 15B — Internal Linking / Research Pathways
   ========================================================= */
.nth-research-pathways,
.nth-reviews-research{
  margin:22px 0;
  padding:18px;
  background:#fff;
  border:1px solid var(--border,#e2e8f0);
  border-radius:16px;
}
.nth-research-pathways__head h2,
.nth-reviews-research__head h2{
  margin:3px 0 5px;
  font-size:21px;
  line-height:1.3;
  color:var(--ink,#0f172a);
}
.nth-research-pathways__head p,
.nth-reviews-research__head p{
  margin:0;
  color:var(--muted,#64748b);
  line-height:1.65;
  font-size:14px;
}
.nth-research-pathways__eyebrow{
  display:block;
  color:var(--brand,#1d4ed8);
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:11px;
  font-weight:900;
}
.nth-research-pathways__links,
.nth-reviews-research__grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-top:14px;
}
.nth-research-pathways__link,
.nth-reviews-research__grid>a{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 13px;
  border:1px solid var(--border,#e2e8f0);
  border-radius:12px;
  background:#f8fafc;
  text-decoration:none;
  min-width:0;
}
.nth-research-pathways__link strong,
.nth-reviews-research__grid>a strong{
  color:var(--ink,#0f172a);
  font-size:14px;
  line-height:1.4;
}
.nth-research-pathways__link span,
.nth-reviews-research__grid>a span{
  color:var(--muted,#64748b);
  font-size:12px;
  line-height:1.45;
}
.nth-research-pathways__link:hover,
.nth-reviews-research__grid>a:hover{
  border-color:var(--brand,#1d4ed8);
  background:#eff6ff;
}
@media(max-width:640px){
  .nth-research-pathways,
  .nth-reviews-research{padding:15px;margin:18px 0}
  .nth-research-pathways__links,
  .nth-reviews-research__grid{grid-template-columns:1fr}
}

/* v5.01: Brand-filter query-var collision hotfix; archive UI now uses ?f_brand=. */


/* =========================================================
   v5.02 — Navigation State Hotfix
   ---------------------------------------------------------
   The functional mobile state rules live in inc/frontend/header-nav.php so
   they are emitted in <head> before the header paints. This marker records
   the release in the child-theme stylesheet without duplicating selectors.
   ========================================================= */

/* v5.09 Phase 16J — lifecycle/content confidence note */
.nth-product-confidence-note{
  margin:12px 0 2px;
  padding:11px 13px;
  border:1px solid #fde68a;
  border-left:4px solid #f59e0b;
  border-radius:10px;
  background:#fffbeb;
  color:#78350f;
  font-size:13px;
  line-height:1.55;
}
.nth-product-confidence-note strong{color:#92400e}

/* ==========================================================
 * v5.12 — Universal Product Color Management
 * ----------------------------------------------------------
 * Compact official-name swatches under key specs.  Swatches are
 * indicative visual aids; the text label is the catalogue truth.
 * ======================================================== */
.nth-product-colors{
  margin-top:14px;
  padding:14px;
  background:#fff;
  border:1px solid var(--border,#e2e8f0);
  border-radius:14px;
}
.nth-product-colors-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  color:var(--muted,#64748b);
}
.nth-product-colors-icon{
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 30px;
  color:var(--brand,#1d4ed8);
  background:#eff6ff;
  border-radius:9px;
}
.nth-product-colors-title{
  color:var(--ink,#0f172a);
  font-size:14px;
  line-height:1.2;
  font-weight:800;
}
.nth-product-color-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.nth-product-color-chip{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  background:#f8fafc;
  border:1px solid #e2e8f0;
  border-radius:999px;
  color:var(--ink,#0f172a);
  font-size:13px;
  line-height:1.25;
  font-weight:700;
}
.nth-product-color-swatch{
  width:17px;
  height:17px;
  flex:0 0 17px;
  border-radius:50%;
  border:1px solid rgba(15,23,42,.18);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);
}
.nth-product-color-name{
  overflow-wrap:anywhere;
}
@media (max-width:480px){
  .nth-product-colors{padding:12px;margin-top:12px}
  .nth-product-color-list{gap:7px}
  .nth-product-color-chip{padding:6px 9px;font-size:12px}
}

/* =========================================================
   v5.32.2 — Product correction / update workflow
   Low-prominence by design: provenance remains the trust signal; the
   correction action is a secondary text affordance, never a warning CTA.
   ========================================================= */
.nth-correction-inline{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px;
  margin:-4px 0 12px;
  color:#64748b;
  font-size:12px;
  line-height:1.45;
}
.nth-correction-link{
  color:#475569;
  font-weight:700;
  text-decoration:underline;
  text-decoration-color:#cbd5e1;
  text-underline-offset:2px;
}
.nth-correction-link:hover{
  color:#1d4ed8;
  text-decoration-color:#93c5fd;
}
.nth-correction-link:focus-visible{
  outline:2px solid #2563eb;
  outline-offset:3px;
  border-radius:3px;
}
.nth-spec-correction{
  margin:20px 0 0;
  padding:12px 14px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#f8fafc;
  color:#64748b;
  font-size:13px;
  line-height:1.5;
}
.nth-correction-context{
  margin:0 0 22px;
  padding:15px 17px;
  border:1px solid #bfdbfe;
  border-radius:12px;
  background:#eff6ff;
  color:#334155;
}
.nth-correction-context strong{
  display:block;
  margin-bottom:4px;
  color:#0f172a;
  font-size:15px;
}
.nth-correction-context p{
  margin:0;
  font-size:14px;
  line-height:1.55;
}

/* =========================================================
 * Phase 21A-8 — Footer Contrast + Final Responsive QA
 * 2026-08-28
 *
 * Final site-footer hardening for 360/390/768/980/full-desktop widths.
 * This block deliberately does not change footer content, destinations,
 * catalogue data, auth logic, ads, or JavaScript. It raises visual hierarchy,
 * prevents narrow-grid overflow, and gives very small phones a safer stack.
 * ========================================================= */
.nth-site-footer,
.nth-site-footer *{
  box-sizing:border-box;
}
.nth-footer-grid > *,
.nth-footer-nav,
.nth-footer-link-group,
.nth-footer-brand,
.nth-footer-brand-links,
.nth-footer-bottom-inner > *{
  min-width:0;
}

/* Footer hierarchy: the original colours technically clear normal-text
 * contrast, but the section labels looked visually recessed on real devices.
 * Raise them one step while preserving the navy footer hierarchy. */
.nth-footer-nav h2{
  color:#f8fafc;
}
.nth-footer-nav h3{
  color:#b6c4d6;
}
.nth-footer-brands-label{
  color:#a9b8cb;
}
.nth-footer-about{
  color:#b3bfd0;
}
.nth-footer-contact{
  color:#9fb0c4;
}
.nth-footer-bottom-inner span{
  color:#91a2b8;
}
.nth-footer-bottom a{
  color:#a9b8cb!important;
}

/* Long labels/addresses may wrap, but must never create horizontal overflow. */
.nth-footer-nav a,
.nth-footer-contact a,
.nth-footer-contact span,
.nth-footer-about,
.nth-footer-bottom-inner span{
  overflow-wrap:anywhere;
  word-break:normal;
}
.nth-footer-brand-links a{
  max-width:100%;
}

/* Visible keyboard focus for the final accessibility pass. */
.nth-site-footer a:focus-visible{
  outline:3px solid rgba(96,165,250,.48);
  outline-offset:3px;
  border-radius:6px;
}
.nth-footer-brand-links a:focus-visible,
.nth-footer-socials a:focus-visible{
  border-radius:999px;
}

/* 980-ish requested-desktop/tablet safety: keep the existing four-column
 * footer, but allow every column and nested label to shrink safely. */
@media (min-width:901px) and (max-width:1100px){
  .nth-footer-inner{
    width:min(1400px,calc(100% - 30px));
  }
  .nth-footer-grid{
    grid-template-columns:minmax(245px,1.28fr) repeat(3,minmax(0,1fr));
    gap:28px 24px;
  }
  .nth-footer-nav a{
    font-size:13.2px;
  }
  .nth-footer-nav h3{
    font-size:11.25px;
  }
}

/* 768-class tablets: retain the proven brand-first layout while increasing
 * breathing room and preventing the three navigation columns from clipping. */
@media (min-width:681px) and (max-width:900px){
  .nth-footer-grid{
    grid-template-columns:minmax(0,1.15fr) repeat(2,minmax(0,1fr));
    gap:30px 24px;
  }
  .nth-footer-brand{
    grid-template-columns:minmax(0,1.3fr) minmax(220px,.9fr);
  }
}

/* 360/390 phones: avoid the historical "narrow left column" failure.
 * Product-category groups can remain a compact two-column sub-grid, while
 * Research and Company receive the full content width. */
@media (max-width:390px){
  .nth-footer-inner{
    width:calc(100% - 24px);
  }
  .nth-footer-main{
    padding:30px 0 20px;
  }
  .nth-footer-grid{
    grid-template-columns:minmax(0,1fr);
    gap:26px;
  }
  .nth-footer-brand,
  .nth-footer-nav,
  .nth-footer-nav:first-of-type{
    grid-column:1/-1;
  }
  .nth-footer-nav:first-of-type{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:0 18px;
  }
  .nth-footer-nav:first-of-type > h2{
    grid-column:1/-1;
  }
  .nth-footer-nav:first-of-type .nth-footer-link-group:last-child{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:18px;
  }
  .nth-footer-nav h2{
    margin-bottom:12px;
  }
  .nth-footer-nav h3{
    margin-top:12px;
    color:#c0ccda;
  }
  .nth-footer-nav a{
    font-size:13.4px;
    line-height:1.5;
  }
  .nth-footer-brands{
    margin-top:24px;
    padding-top:18px;
  }
  .nth-footer-brand-links{
    gap:6px;
  }
  .nth-footer-brand-links a{
    padding:5px 9px;
    font-size:12px;
  }
  .nth-footer-bottom-inner{
    min-height:0;
    padding:17px 0 calc(17px + env(safe-area-inset-bottom,0px));
  }
  .nth-footer-bottom nav{
    gap:10px 14px;
  }
}

@media (max-width:360px){
  .nth-footer-nav:first-of-type,
  .nth-footer-nav:first-of-type .nth-footer-link-group:last-child{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:14px;
  }
  .nth-footer-trust-inner{
    font-size:12px;
    gap:7px 14px;
  }
  .nth-footer-wordmark{
    font-size:18px;
  }
  .nth-footer-about{
    line-height:1.65;
  }
}

@media (prefers-reduced-motion:reduce){
  .nth-footer-socials a{
    transition:none;
  }
}

/* =========================================================
 * v5.38.6 — Responsive shell / laptop width normalization
 * 2026-09-04
 *
 * Why this exists:
 * - NepalTechHub catalogue templates already own a 1400px content ceiling.
 * - GeneratePress can still cap #page/.grid-container to the Customizer
 *   container width before those wrappers get a chance to expand.
 * - The result is a tablet-like/narrow desktop shell on common 1366px and
 *   1440px laptop screens even though the child template itself says 1400px.
 *
 * Scope is intentionally limited to catalogue/search/compare/budget surfaces.
 * Editorial/legal prose pages keep GeneratePress's normal readable measure.
 * ========================================================= */
:root{
  --nth-shell-max:1400px;
}

/* Header + primary navigation use the same desktop grid as the catalogue.
 * GeneratePress may provide its own .grid-container max-width; reset that
 * ceiling explicitly while retaining a bounded 1400px shell on large screens. */
@media (min-width:769px){
  .site-header .inside-header,
  .main-navigation .inside-navigation{
    width:min(100%,var(--nth-shell-max));
    max-width:var(--nth-shell-max)!important;
    margin-inline:auto;
    box-sizing:border-box;
  }
}

/* Product/discovery surfaces are intentionally wide. Their own templates
 * already provide the actual 1260/1400px inner limit and horizontal gutters,
 * so the GeneratePress parent must not impose a second, smaller ceiling. */
:is(
  body.home,
  body.search,
  body.post-type-archive-phones,
  body.post-type-archive-laptops,
  body.post-type-archive-tablets,
  body.post-type-archive-tvs,
  body.post-type-archive-earbuds,
  body.post-type-archive-headphones,
  body.post-type-archive-speakers,
  body.post-type-archive-smartwatches,
  body.post-type-archive-cameras,
  body.post-type-archive-refrigerators,
  body.post-type-archive-washing_machines,
  body.post-type-archive-air_conditioners,
  body.single-phones,
  body.single-laptops,
  body.single-tablets,
  body.single-tvs,
  body.single-earbuds,
  body.single-headphones,
  body.single-speakers,
  body.single-smartwatches,
  body.single-cameras,
  body.single-refrigerators,
  body.single-washing_machines,
  body.single-air_conditioners,
  body.tax-brand,
  body.tax-chipset,
  body.tax-price_band,
  body[class*="page-template-page-compare-all"],
  body[class*="price-in-nepal-by-budget"]
) #page.grid-container{
  width:100%!important;
  max-width:none!important;
  margin-inline:auto;
}

/* GeneratePress's contained content padding is useful for prose, but these
 * custom templates already own their padding. Remove only the duplicate outer
 * inset on the same wide surfaces so 1366px laptops can use the available
 * width without changing the templates' internal rhythm. */
:is(
  body.home,
  body.search,
  body.post-type-archive-phones,
  body.post-type-archive-laptops,
  body.post-type-archive-tablets,
  body.post-type-archive-tvs,
  body.post-type-archive-earbuds,
  body.post-type-archive-headphones,
  body.post-type-archive-speakers,
  body.post-type-archive-smartwatches,
  body.post-type-archive-cameras,
  body.post-type-archive-refrigerators,
  body.post-type-archive-washing_machines,
  body.post-type-archive-air_conditioners,
  body.single-phones,
  body.single-laptops,
  body.single-tablets,
  body.single-tvs,
  body.single-earbuds,
  body.single-headphones,
  body.single-speakers,
  body.single-smartwatches,
  body.single-cameras,
  body.single-refrigerators,
  body.single-washing_machines,
  body.single-air_conditioners,
  body.tax-brand,
  body.tax-chipset,
  body.tax-price_band,
  body[class*="page-template-page-compare-all"],
  body[class*="price-in-nepal-by-budget"]
) #content.site-content{
  width:100%;
  max-width:none;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box;
}

:is(
  body.home,
  body.search,
  body.post-type-archive-phones,
  body.post-type-archive-laptops,
  body.post-type-archive-tablets,
  body.post-type-archive-tvs,
  body.post-type-archive-earbuds,
  body.post-type-archive-headphones,
  body.post-type-archive-speakers,
  body.post-type-archive-smartwatches,
  body.post-type-archive-cameras,
  body.post-type-archive-refrigerators,
  body.post-type-archive-washing_machines,
  body.post-type-archive-air_conditioners,
  body.single-phones,
  body.single-laptops,
  body.single-tablets,
  body.single-tvs,
  body.single-earbuds,
  body.single-headphones,
  body.single-speakers,
  body.single-smartwatches,
  body.single-cameras,
  body.single-refrigerators,
  body.single-washing_machines,
  body.single-air_conditioners,
  body.tax-brand,
  body.tax-chipset,
  body.tax-price_band,
  body[class*="page-template-page-compare-all"],
  body[class*="price-in-nepal-by-budget"]
) #primary.content-area{
  width:100%!important;
  max-width:none!important;
  min-width:0;
  float:none!important;
}

/* Reassert the child-theme shell as border-box so its padding is included in
 * the declared width instead of increasing the rendered box. */
#nth-home,
.nth-container,
.nth-wrap,
#nth-archive,
.nth-archive-page,
.nth-phone-wrap,
.nth-laptop-wrap,
.nth-bp-wrap,
.nth-cmp{
  box-sizing:border-box;
  min-width:0;
}



/* v5.38.8: visible, adjacent affiliate disclosure for active monetised product CTAs. */
.nth-affiliate-inline-disclosure{
  margin:10px 0 0;
  padding:9px 12px;
  border:1px solid var(--border,#e2e8f0);
  border-radius:10px;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  line-height:1.5;
}
.nth-affiliate-inline-disclosure a{font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* Phase 29A-8: protect the dark footer from global catalogue heading colors. */
body .nth-site-footer .nth-footer-nav > h2 { color:#f8fafc!important; }
body .nth-site-footer .nth-footer-nav .nth-footer-link-group > h3 { color:#cbd5e1!important; }