/* ==========================================================
   mj-site.css — sitewide readability, consistency and mobile
   Added 1 Nov 2026 (design audit fixes). Linked last in <head>
   on every page. To undo everything: empty this file.
   ========================================================== */

/* ---------- 1. Reading text: 16px, normal weight ---------- */
html body .pp-about-body p,
html body .pp-prose p,
html body .pp-shead p,
html body .wrap > p,
html body .faq-item p,
html body .faq-a p,
html body .pp-faq p,
html body .ep-supply-body p,
html body .ep-step p,
html body .org-body p,
html body .rrx-intro p,
html body .bj-card p,
html body .lv-body p,
html body .belt p,
html body .rv-use p,
html body .cz-card p,
html body .os-prod-body p,
html body .mn-list li,
html body p.t-body,
html body p.lv-ds,
html body p.hero-sub,
html body p.pp-hero-lead{font-size:16px !important;line-height:1.75;font-weight:400 !important;}

/* supporting text: up from 12–13.5px to 14.5px */
html body .pp-app p,
html body .exp-card p,
html body .c > p,
html body p.price-note,
html body p.pp-note,
html body p.cz-note,
html body p.mb-note,
html body p.ct-block-sub,
html body p.ct-form-sub,
html body p.ind-desc,
html body .kg-sizes-note,
html body .br-cmp-note{font-size:14.5px !important;line-height:1.7;font-weight:400 !important;}

/* any other plain paragraph, list item or table cell: normal weight */
html body p:not([class]),
html body li:not([class]),
html body td:not([class]),
html body dd:not([class]){font-weight:400;}
html body table td:not([class]){font-size:14.5px;}

/* ---------- 2. Labels: nothing under 12px ---------- */
html body .t-eyebrow,
html body span.k,
html body div.k,
html body .lbl em,
html body .rg-table-head,
html body .pp-finishes span,
html body span.label,
html body thead th,
html body tbody th[scope="row"],
html body table caption,
html body .fg-item figcaption,
html body .rr-shot figcaption,
html body .is-product figcaption,
html body .pp-split-fig figcaption,
html body figcaption > span,
html body .fg-count,
html body .finish-tag,
html body .spec-key,
html body .mj-field label,
html body .qz-duo-tag,
html body .qz-duo-go,
html body .rr-chip,
html body .bd-n,
html body .bd-cap,
html body .cb-calc-label,
html body .ct-loc-num,
html body .unit,
html body .stat-label,
html body .heritage-label,
html body .trade-stat-key,
html body .ba-label,
html body .care-tag,
html body .ind-tag,
html body .ind-spec,
html body .t-role,
html body .mat-cta,
html body .mat-cta-eyebrow,
html body .see-all,
html body .filter-chip,
html body .finish-chip,
html body .btn-primary,
html body .btn-ghost,
html body .btn-ghost-light,
html body .ind-cta,
html body .ct-wa,
html body .ct-loc-map,
html body .mjj-link,
html body .mjj-cta,
html body .wa-tip,
html body .mjc-tip{font-size:12px !important;}

/* small badges on photos: 8.5px → 11px */
html body .pp-tag{font-size:11px !important;}

/* ---------- 3. Contrast on dark bands and photos ---------- */
html body .trade-stat-key{color:rgba(245,240,232,.72) !important;font-weight:400 !important;}
html body .mat-sub{font-size:13px !important;color:rgba(253,249,244,.92) !important;font-weight:400 !important;}
html body .mat-overlay{background:linear-gradient(to top,rgba(20,17,13,.82) 0%,rgba(20,17,13,.28) 50%,transparent 75%) !important;}
html body .mjj-link{color:rgba(253,249,244,.8) !important;}

/* homepage slide counters ("2 / 3") — the dots already show position */
html body .slider-count{display:none !important;}

/* ---------- 4. One jump-nav style: the dark bar, everywhere ---------- */
html body #fmJump,
html body #jumpNav,
html body #pp-jump,
html body #ppJump{
  background:rgba(30,26,20,.97) !important;
  border-bottom:1px solid rgba(184,154,98,.28) !important;
  border-top:0 !important;
  -webkit-backdrop-filter:saturate(150%) blur(8px);backdrop-filter:saturate(150%) blur(8px);
}
html body #fmJump a,
html body #jumpNav a,
html body #pp-jump a,
html body #ppJump a{color:rgba(253,249,244,.8) !important;font-size:12px !important;}
html body #fmJump a:hover,html body #fmJump a:focus-visible,html body #fmJump a.is-active,html body #fmJump a.active,html body #fmJump a[aria-current],
html body #jumpNav a:hover,html body #jumpNav a:focus-visible,html body #jumpNav a.is-active,html body #jumpNav a.active,html body #jumpNav a[aria-current],
html body #pp-jump a:hover,html body #pp-jump a:focus-visible,html body #pp-jump a.is-active,html body #pp-jump a.active,html body #pp-jump a[aria-current],
html body #ppJump a:hover,html body #ppJump a:focus-visible,html body #ppJump a.is-active,html body #ppJump a.active,html body #ppJump a[aria-current]{color:#fdf9f4 !important;}
html body #fmJump a.fmj-cta,
html body #jumpNav .mj-jump-cta a,
html body #pp-jump a[href="#pp-quote"]{
  background:#8a6830 !important;color:#fdf9f4 !important;padding:9px 18px !important;border:0 !important;border-radius:0;
}
html body #fmJump a.fmj-cta:hover,
html body #jumpNav .mj-jump-cta a:hover,
html body #pp-jump a[href="#pp-quote"]:hover{background:#6a4e1e !important;}

/* ---------- 5. Phones ---------- */
@media (max-width:700px){
  /* one floating button: keep WhatsApp, hide the chat launcher */
  html body #mjc-btn,
  html body .mjc-tip{display:none !important;}

  /* 44px tap targets */
  html body .mat-cta,
  html body .see-all,
  html body .btn-ghost-light,
  html body .btn-ghost,
  html body .ind-cta,
  html body .ct-loc-map,
  html body .ct-wa,
  html body .mjj-link{display:inline-flex !important;align-items:center;min-height:44px;}
  html body .filter-chip,
  html body .finish-chip{min-height:44px;}
  html body footer li a{padding:7px 0;}

  /* homepage hero stats: keep the bigger labels inside three columns */
  html body .hero-stats .stat-label{font-size:11px !important;letter-spacing:.06em !important;white-space:normal !important;line-height:1.3;}

  /* Basalt: each finish's photos become a swipe row, like Kota Stone */
  html body #sec-gallery .fg-grid{
    display:flex !important;grid-template-columns:none !important;grid-auto-rows:auto !important;
    overflow-x:auto;scroll-snap-type:x mandatory;gap:8px;padding-bottom:6px;
    -webkit-overflow-scrolling:touch;
  }
  html body #sec-gallery .fg-grid > .fg-item{
    flex:0 0 78% !important;height:230px !important;grid-column:auto !important;grid-row:auto !important;scroll-snap-align:start;
  }
  html body #sec-gallery .fg-grid > .fg-item img{width:100%;height:100%;object-fit:cover;}
}