/* =========================================================
   KAARIGAR · Dark mode
   Activated by <html data-theme="dark"> (toggled in main.js).
   Cinnamon becomes the page surface; cream carries all text.
   ========================================================= */

html[data-theme="dark"] {
  --paper: #693f25;
  --sec-alt: color-mix(in srgb, var(--cinnamon) 100%, var(--cream));
  --ink: var(--cream);
  --line: rgba(246, 239, 228, .2);
  --shadow: 0 18px 40px -22px rgba(0, 0, 0, .6);
}

/* Header & footer share identical logo colours in both modes */
html[data-theme="dark"] .site-header,
html[data-theme="dark"] .site-footer {
  background: var(--cinnamon);
  color: var(--cream);
  border-color: var(--line);
}

html[data-theme="dark"] .logo-mark {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .logo-text small {
  color: var(--cream);
  opacity: .8;
}

html[data-theme="dark"] .logo-text {
  color: var(--cream);
}

html[data-theme="dark"] .main-nav {
  background: var(--cinnamon);
}

html[data-theme="dark"] .main-nav a {
  color: var(--cream);
}

/* Icon & outline buttons */
html[data-theme="dark"] .icon-btn {
  border-color: var(--cream);
  color: var(--cream);
}

html[data-theme="dark"] .icon-btn:hover {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .btn-clay:hover {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .btn-ghost {
  border-color: var(--cream);
  color: var(--cream);
}

html[data-theme="dark"] .btn-ghost:hover {
  background: var(--cream);
  color: var(--cinnamon);
}

/* Text accents: terracotta is too low-contrast on cinnamon, so use cream */
html[data-theme="dark"] .eyebrow {
  color: var(--cream);
}

html[data-theme="dark"] .eyebrow i {
  color: var(--peach);
}

html[data-theme="dark"] em {
  color: var(--cream);
}

html[data-theme="dark"] .text-link {
  color: var(--cream);
}

html[data-theme="dark"] .footer-col li>i {
  color: var(--peach);
}

html[data-theme="dark"] .footer-col a:hover {
  color: var(--peach);
}

html[data-theme="dark"] .quote-slide cite {
  color: var(--cream);
}

html[data-theme="dark"] .hero-stats strong {
  color: var(--cream);
}

html[data-theme="dark"] .hero-stats span {
  color: var(--cream);
}

html[data-theme="dark"] .hero::before {
  opacity: .14;
}

/* Bands need a surface different from the page */
html[data-theme="dark"] .band {
  background: rgba(246, 239, 228, .06);
}

/* Collections */
html[data-theme="dark"] .coll-num {
  opacity: .6;
}

html[data-theme="dark"] .vis-cinnamon {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .vis-cream {
  border-color: var(--cream);
}

html[data-theme="dark"] .tags li {
  border-color: var(--cream);
  color: var(--cream);
}

/* Filters & tiles */
html[data-theme="dark"] .filter-btn {
  border-color: var(--cream);
  color: var(--cream);
}

html[data-theme="dark"] .filter-btn.active,
html[data-theme="dark"] .filter-btn:hover {
  background: var(--clay-deep);
  border-color: var(--terracotta);
  color: var(--cream);
}

html[data-theme="dark"] .tile {
  background: rgba(246, 239, 228, .08);
  border: 1px solid rgba(246, 239, 228, .2);
}

html[data-theme="dark"] .t-clay {
  background: var(--clay-deep);
}

/* Process */
html[data-theme="dark"] .process {
  background: rgba(246, 239, 228, .04);
}

html[data-theme="dark"] .step-icon {
  background: var(--cinnamon);
  border-color: var(--cream);
  color: var(--cream);
}

html[data-theme="dark"] .step-num {
  color: var(--cream);
}

/* Testimonials */
html[data-theme="dark"] .dot {
  background: rgba(246, 239, 228, .3);
}

html[data-theme="dark"] .dot.active {
  background: var(--clay-deep);
}

/* Enquiry */
html[data-theme="dark"] .enquiry-form {
  background: rgba(246, 239, 228, .1);
}

/* Social & back-to-top */
html[data-theme="dark"] .socials a {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .socials a:hover {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .back-to-top {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .back-to-top:hover {
  background: var(--clay-deep);
  color: var(--cream);
}

/* E-commerce & motion layer */
html[data-theme="dark"] .product {
  background: rgba(246, 239, 228, .06);
}

html[data-theme="dark"] .product-media {
  background: rgba(246, 239, 228, .08);
}

html[data-theme="dark"] .p-craft,
html[data-theme="dark"] .p-rating,
html[data-theme="dark"] .ci-price {
  color: var(--cream);
}

html[data-theme="dark"] .p-badge {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .p-badge.sale {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .wish {
  background: rgba(246, 239, 228, .14);
  color: var(--cream);
}

html[data-theme="dark"] .wish.on {
  color: var(--terracotta);
}

html[data-theme="dark"] .add-btn {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .add-btn:hover,
html[data-theme="dark"] .add-btn.added {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .cat-ico {
  background: rgba(246, 239, 228, .08);
  color: var(--cream);
}

html[data-theme="dark"] .cat:hover .cat-ico {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .promo {
  background: rgba(246, 239, 228, .07);
  border: 1px solid var(--line);
}

html[data-theme="dark"] .trust-ico {
  background: rgba(181, 85, 47, .25);
  color: var(--cream);
}

html[data-theme="dark"] .toast {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .chip i {
  color: var(--peach);
}

/* Home 2 · Edition 02 */
html[data-theme="dark"] .h2-ticket {
  background: rgba(246, 239, 228, .07);
}

html[data-theme="dark"] .h2-ticket-stub {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .h2-stamp {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .h2-stamp>i {
  color: var(--peach);
}

html[data-theme="dark"] .h2-tag {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .h2-avatars span {
  border-color: var(--cinnamon);
}

html[data-theme="dark"] .h2-avatars span:first-child {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .h2-voices {
  background: rgba(246, 239, 228, .06);
}

html[data-theme="dark"] .h2-clock>div {
  background: rgba(246, 239, 228, .16);
}

html[data-theme="dark"] .zig-item .zig-dot {
  background: var(--cream);
  color: var(--cinnamon);
  border-color: var(--cinnamon);
}

html[data-theme="dark"] .shelf-tab.active {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .look-step .add-btn {
  background: var(--cream);
  color: var(--cinnamon);
}

/* Products page */
html[data-theme="dark"] .shop-hero-stat,
html[data-theme="dark"] .side-card {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .cat-link.active {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .cat-link.active i {
  color: var(--clay-deep);
}

html[data-theme="dark"] .cat-link.active b {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .shop-bar {
  background: var(--paper);
}

/* Artisan Stories */
html[data-theme="dark"] .feature-badge {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .av {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .spotlight-band {
  background: var(--clay-deep);
}

html[data-theme="dark"] .spot-stats li {
  background: rgba(246, 239, 228, .16);
}

html[data-theme="dark"] .reader {
  box-shadow: -30px 0 60px -30px rgba(0, 0, 0, .7);
}

html[data-theme="dark"] .chip-tab.active {
  color: var(--cream);
}

/* Nav dropdown */
html[data-theme="dark"] .main-nav .sub {
  background: var(--cinnamon);
  border-color: var(--line);
}

/* Extra sections */
html[data-theme="dark"] .g-big {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .g-big h3,
html[data-theme="dark"] .g-big p,
html[data-theme="dark"] .g-big .gift-go {
  color: var(--cinnamon);
}

html[data-theme="dark"] .ot-head {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ab-numbers {
  background: var(--clay-deep);
}

html[data-theme="dark"] .ab-quote {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ab-quote .ab-quote-inner i {
  color: var(--peach);
}

html[data-theme="dark"] .ab-join-inner {
  background: var(--clay-deep);
}

html[data-theme="dark"] .ab-join .btn-clay {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .v3 {
  background: rgba(246, 239, 228, .08);
}

html[data-theme="dark"] .v3 .val-ico {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .val-ico {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ct-form input,
html[data-theme="dark"] .ct-form select,
html[data-theme="dark"] .ct-form textarea {
  background: var(--cinnamon);
  color: var(--cream);
  border-color: var(--cream);
}

html[data-theme="dark"] .ct-form input::placeholder,
html[data-theme="dark"] .ct-form textarea::placeholder {
  color: var(--cream);
}

html[data-theme="dark"] .ct-form .error-msg {
  color: var(--cream);
  background: #6b3822;
  padding: .25rem .6rem;
  border-radius: 6px;
  display: inline-block;
}

html[data-theme="dark"] .ct-form .field.invalid .error-msg {
  display: inline-block;
}

html[data-theme="dark"] .ct-map {
  background: var(--cinnamon);
}

html[data-theme="dark"] .ct-map-frame {
  filter: invert(.9) hue-rotate(180deg) saturate(.8);
}

html[data-theme="dark"] .ct-map-link {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ct-map-link:hover,
html[data-theme="dark"] .ct-map-link:focus-visible {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .ct-next {
  border-color: rgba(246, 239, 228, .2);
}

html[data-theme="dark"] .ct-address {
  background: rgba(246, 239, 228, .08);
}

html[data-theme="dark"] .ct-steps li>span {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ws-date {
  background: var(--clay-deep);
}

html[data-theme="dark"] .fav-card.fav-mid {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .fav-card.fav-mid figcaption {
  color: var(--cinnamon);
}

/* Wishlist & bag */
html[data-theme="dark"] .wl-count {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .wl-figs li {
  background: var(--cinnamon);
}

html[data-theme="dark"] .wl-figs strong {
  color: var(--cream);
}

html[data-theme="dark"] .cp-summary,
html[data-theme="dark"] .wl-share-inner,
html[data-theme="dark"] .pin-box,
html[data-theme="dark"] .assure-grid li,
html[data-theme="dark"] .cp-cta-inner {
  background: rgba(246, 239, 228, .08);
}

html[data-theme="dark"] .coupon-row input {
  background: var(--cinnamon);
  color: var(--cream);
  border-color: var(--cream);
}

html[data-theme="dark"] .ship-progress {
  background: var(--cinnamon);
}

html[data-theme="dark"] .alert-box .field {
  background: rgba(246, 239, 228, .08);
}

html[data-theme="dark"] .cp-steps li.is-now span {
  background: var(--clay-deep);
}

html[data-theme="dark"] .b2 {
  background: var(--clay-deep);
}

html[data-theme="dark"] .b3 {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .b3 h3,
html[data-theme="dark"] .b3 p {
  color: var(--cinnamon);
}

/* WISHLIST & BAG · 5-section additions */
html[data-theme="dark"] .stock-in {
  background: rgba(120, 170, 100, .22);
  color: #CFE6BF;
}

html[data-theme="dark"] .stock-low {
  background: rgba(181, 85, 47, .3);
  color: #F6D9C8;
}

html[data-theme="dark"] .stock-mto {
  background: rgba(246, 239, 228, .12);
  color: var(--cream);
}

html[data-theme="dark"] .pay-row li {
  color: var(--cream);
}

/* HERO SECTIONS · Shop, About, Contact */
html[data-theme="dark"] .ph-stat {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .ch-badge {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ch-badge i {
  color: var(--peach);
}

html[data-theme="dark"] .ch-visual::before {
  background: var(--clay-deep);
}

html[data-theme="dark"] .ah-pillars li {
  background: rgba(20, 10, 4, .6);
}

/* HERO · Craft Stories + About (editorial) */
html[data-theme="dark"] .bm-hero {
  border-bottom-color: var(--cream);
}

html[data-theme="dark"] .ah2-badge {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .ah2-photo img {
  box-shadow: 0 18px 40px -22px rgba(0, 0, 0, .6);
}

/* HERO v4 · Craft Stories + About */
html[data-theme="dark"] .ms-hero {
  background: #4A2410;
}

html[data-theme="dark"] .ms-latest {
  background: var(--cream);
}

html[data-theme="dark"] .ab3-values li {
  background: rgba(246, 239, 228, .08);
}

/* HERO v5 · Journal + Blob */
html[data-theme="dark"] .jr-hero {
  background: radial-gradient(1100px 620px at 85% 10%, #7B4019 0%, #4E2510 60%, #2E1607 100%);
}

html[data-theme="dark"] .jr-card {
  border-color: var(--cinnamon);
}

html[data-theme="dark"] .ab4-hero {
  background: #693f25;
}

html[data-theme="dark"] .ab4-copy {
  color: var(--cream);
}

html[data-theme="dark"] .ab4-seal {
  border-color: #1E1109;
}

/* HOME 2 · HERO */
html[data-theme="dark"] .hx-badge {
  background: var(--clay-deep);
}

html[data-theme="dark"] .hx-note {
  background: #2A170B;
}

html[data-theme="dark"] .hx-note-ico {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .hx-watermark {
  color: var(--cream);
  opacity: .05;
}

/* Craft Stories hero separation */
html[data-theme="dark"] .jr-hero+.feature-story {
  border-top: 0;
}

/* Home 1 · v2 — Journey + Circle */
html[data-theme="dark"] {
  --jx-a: #9a5226;
  --jx-b: #4a1f09;
}

html[data-theme="dark"] .jx-stage {
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6);
}

html[data-theme="dark"] .jx-step::before {
  color: rgba(246, 239, 228, .07);
}

html[data-theme="dark"] .jx-nodes li {
  border-color: rgba(246, 239, 228, .3);
}

html[data-theme="dark"] .kc-card {
  background:
    radial-gradient(70% 90% at 100% 0%, rgba(242, 183, 156, .25), transparent 60%),
    linear-gradient(135deg, #B5552F 0%, #4a1f09 100%);
}

/* Home 1 · Kind words */
html[data-theme="dark"] .kv-stage {
  background: #5a2a10;
}

html[data-theme="dark"] .kv-body {
  color: var(--cream);
}

html[data-theme="dark"] .kv-mark {
  color: #F2B79C;
}

html[data-theme="dark"] .kv-pick:hover {
  background: rgba(246, 239, 228, .06);
}

/* About · Workshop diary + Inspection bench */
html[data-theme="dark"] .dy-tab[aria-selected="true"] {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .dy-tab:hover {
  background: rgba(246, 239, 228, .12);
}

html[data-theme="dark"] .dy-place i {
  color: var(--cream);
}

html[data-theme="dark"] .dy-dots i {
  background: rgba(246, 239, 228, .16);
}

html[data-theme="dark"] .dy-dots i.on {
  background: var(--cream);
}

html[data-theme="dark"] .chk-ico {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .chk.is-seen .chk-tick {
  color: var(--cream);
}

html[data-theme="dark"] .chk.is-open {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .chk.is-open .chk-ico {
  background: var(--cinnamon);
  color: var(--cream);
}

html[data-theme="dark"] .chk.is-open .chk-tick,
html[data-theme="dark"] .chk.is-open.is-seen .chk-tick {
  color: var(--cinnamon);
}

html[data-theme="dark"] .chk.is-open .chk-rule {
  border-top-color: rgba(123, 64, 25, .4);
}

html[data-theme="dark"] .bench-count strong {
  color: var(--cream);
}

/* Footer newsletter column */
html[data-theme="dark"] .ft-input {
  border-color: var(--cream);
}

html[data-theme="dark"] .ft-input:focus-visible {
  border-color: var(--terracotta);
}

html[data-theme="dark"] .ft-news-form.invalid .ft-input {
  border-color: #FFB9A3;
}

html[data-theme="dark"] .ft-btn {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .ft-btn:hover {
  background: var(--clay-deep);
  color: var(--cream);
}

html[data-theme="dark"] .footer-news-col .ft-error {
  color: #FFD3C4;
}

/* 404 page */
html[data-theme="dark"] .nf-code {
  color: var(--cream);
}

html[data-theme="dark"] .nf-art {
  background: rgba(246, 239, 228, .08);
}

/* =========================================================
   VISIBILITY & CONTRAST FIXES · dark mode (from the contrast report)
   ========================================================= */

/* D1–D3 · ghost buttons had no background, so the browser's grey showed under cream text */
html[data-theme="dark"] .btn-ghost {
  background: transparent;
  color: var(--cream);
  border-color: var(--cream);
}

html[data-theme="dark"] .btn-ghost:hover {
  background: var(--cream);
  color: var(--cinnamon);
}

/* D4 · "Scroll down" label on Home 2 */
html[data-theme="dark"] .hx-scroll {
  color: var(--peach);
}

/* D5 · Top Picks numerals: put each row on a darker panel so the peach numerals read */
html[data-theme="dark"] .rank-list li {
  background: rgba(0, 0, 0, .28);
}

html[data-theme="dark"] .rank-no {
  color: var(--peach);
}

/* D6 · collection numerals */
html[data-theme="dark"] .coll-num {
  color: var(--peach);
  opacity: 1;
}

/* D7 · blog story tags and count: cream pill on cinnamon; story cards darkened */
html[data-theme="dark"] .story {
  background: #5A2E14;
}

html[data-theme="dark"] .story-tag {
  color: var(--cream);
  background: var(--cinnamon);
  padding: .25rem .6rem;
  border-radius: 999px;
}

html[data-theme="dark"] .story-count span {
  color: var(--peach);
}

/* D8 · maker locations */
html[data-theme="dark"] .maker small,
html[data-theme="dark"] .kv-who small {
  color: var(--cream);
  opacity: .95;
}

/* D9 · breadcrumb current page */
html[data-theme="dark"] .crumbs span {
  color: var(--peach);
}

/* D10 · contact form and PIN box: darker panel so cream labels pass */
html[data-theme="dark"] .ct-form {
  background: rgba(0, 0, 0, .28);
}

html[data-theme="dark"] .pin-box {
  background: rgba(0, 0, 0, .25);
}

/* Product cards: ratings in cream on the brown card, old price stays readable */
html[data-theme="dark"] .product-body .p-rating,
html[data-theme="dark"] .product-body .p-rating span {
  color: var(--cream);
}

html[data-theme="dark"] .p-price s {
  opacity: .85;
}

/* Terracotta-coloured text on dark and brown surfaces → peach (4.6:1 on cinnamon) */
html[data-theme="dark"] .jx-count span,
html[data-theme="dark"] .jx-count,
html[data-theme="dark"] .zig-item small,
html[data-theme="dark"] .kv-pick small,
html[data-theme="dark"] .kv-who small,
html[data-theme="dark"] .shop-count span,
html[data-theme="dark"] .artisan-name span {
  color: var(--peach);
}

html[data-theme="dark"] .story-tag,
html[data-theme="dark"] .jr-kicker {
  color: var(--cream);
}

html[data-theme="dark"] .jr-kicker {
  background: var(--cinnamon);
}

/* Final pass · dark surfaces that were too light for their text */
html[data-theme="dark"] .story-sec {
  background: rgba(0, 0, 0, .3);
}

html[data-theme="dark"] .story-count span {
  color: var(--peach);
}

html[data-theme="dark"] .zig-item small,
html[data-theme="dark"] .kv-pick small,
html[data-theme="dark"] .kv-who small {
  color: var(--cream);
  opacity: 1;
}

html[data-theme="dark"] .shop-cta-inner {
  background: rgba(0, 0, 0, .3);
}

html[data-theme="dark"] .stock-tag {
  background: rgba(0, 0, 0, .4);
}

html[data-theme="dark"] .p-price s {
  opacity: 1;
  color: var(--cream);
}

html[data-theme="dark"] .h2-ticket-main>p {
  opacity: 1;
  color: var(--cream);
}

html[data-theme="dark"] .artisan-name span {
  color: var(--cream);
  opacity: 1;
}

html[data-theme="dark"] .shop-field output {
  color: var(--peach);
}

/* Final pass 2 · dark: timeline and wishlist surfaces, and full-strength captions */
html[data-theme="dark"] .wl-chip {
  background: rgba(0, 0, 0, .3);
}

html[data-theme="dark"] .ct-next-head {
  opacity: 1;
  color: var(--cream);
}

html[data-theme="dark"] small,
html[data-theme="dark"] .trust-item span,
html[data-theme="dark"] .feature-by small {
  opacity: 1;
}

/* Final pass 3 · dark: active wishlist chip keeps its contrast, captions full strength */
html[data-theme="dark"] .wl-chip.active {
  background: var(--cream);
  color: var(--cinnamon);
}

html[data-theme="dark"] .chan span {
  opacity: 1;
}

html[data-theme="dark"] .cp-steps li>span {
  background: var(--cinnamon);
  color: var(--cream);
}

/* Final pass 4 · dark */
html[data-theme="dark"] .kv-who span {
  opacity: 1;
}

html[data-theme="dark"] .ct-chips small {
  opacity: 1;
}

/* Navigation dropdown (Home 1 / Home 2 versions): the current page used terracotta on the dark panel */
html[data-theme="dark"] .main-nav .sub {
  background: var(--cinnamon);
  border-color: rgba(246, 239, 228, .25);
}

html[data-theme="dark"] .main-nav .sub a {
  color: var(--cream);
}

html[data-theme="dark"] .main-nav .sub a:hover {
  background: rgba(246, 239, 228, .12);
  color: var(--cream);
}

html[data-theme="dark"] .main-nav .sub a[aria-current="page"] {
  color: var(--cream);
  background: rgba(246, 239, 228, .16);
  font-weight: 700;
}

/* Cart drawer: footer note and empty-state text at full strength */
html[data-theme="dark"] .cart-empty,
html[data-theme="dark"] .fine {
  opacity: 1;
}

/* ---- Icon visibility (dark): icons follow the colour of their surface ---- */
html[data-theme="dark"] {
  --terra-text: var(--peach);
}

html[data-theme="dark"] .footer-col i {
  color: var(--peach);
}

html[data-theme="dark"] .spin-badge i {
  color: var(--clay-deep);
}

/* Icon surfaces: cream cards keep the deep terracotta; tan and field surfaces use cream icons */
html[data-theme="dark"] :is(.feature-grid, .ch-visual) {
  --terra-text: #8A3A1C;
}

html[data-theme="dark"] .wl-value .eyebrow,
html[data-theme="dark"] .wl-value .eyebrow i,
html[data-theme="dark"] .ch-copy i,
html[data-theme="dark"] .field>i {
  color: var(--cream);
}

html[data-theme="dark"] .ch-visual .ch-badge i {
  color: var(--terra-text);
}

html[data-theme="dark"] .product-media .wish i {
  color: var(--cream);
}
/* Blog · craft journey (dark) */
html[data-theme="dark"] .jr-node { background: var(--cream); color: var(--cinnamon); box-shadow: 0 0 0 8px var(--paper); }
html[data-theme="dark"] .jr-step.is-lit .jr-node { background: var(--peach); color: var(--cinnamon); }
html[data-theme="dark"] .jr-body h3,
html[data-theme="dark"] .jr-body p,
html[data-theme="dark"] .jr-tag { color: var(--cream); }
html[data-theme="dark"] .jr-media img { box-shadow: 0 18px 40px -20px rgba(0, 0, 0, .7); }

/* ---- FIX: active header underline in dark mode ---- */
html[data-theme="dark"] .main-nav a::after { background: var(--peach); }