/* ============================================================
   Curated Picks — product-roundup display for OWN WooCommerce products
   House style (warm charcoal + gold, rounded, editorial). Distinct from
   ZimmWriter Black Tie. Install once per site; theme via the vars on .pk-wrap.
   Scoped to .pk-wrap so it never touches shop/category/product templates.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700&family=Rubik:wght@500;600;700&display=swap');

.pk-wrap{
  --pk-ink:#1c1917; --pk-ink2:#57534e; --pk-accent:#ca8a04; --pk-accent-hover:#d99a0a;
  --pk-accent-soft:#fbf3e0; --pk-bg:#faf9f7; --pk-card:#fff; --pk-line:#ece7e1;
  --pk-r:16px; --pk-rs:10px; --pk-sh:0 10px 34px rgba(28,25,23,.09); --pk-shs:0 3px 10px rgba(28,25,23,.06);
  /* CTA contrast, fixed 2026-08-21. White on #ca8a04 was 2.94:1 -- failing WCAG AA for
   normal text (4.5:1) and even the large-text threshold (3:1), on a 13px bold button.
   Dark ink on the gold is 5.95:1. The hover gold was DARKENED, which is backwards once
   the text is dark (it dropped to 4.32:1), so hover now lightens to #d99a0a = 7.14:1. */
  /* konahm override: --pk-accent:#111; --pk-accent-hover:#000; --pk-accent-soft:#f1f1f1; */
  font-family:"Nunito Sans",system-ui,-apple-system,sans-serif; color:var(--pk-ink);
}
.pk-wrap *{ box-sizing:border-box; }

.pk-head{ text-align:center; margin:0 0 26px; }
.pk-eyebrow{ display:inline-block; font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--pk-accent); background:var(--pk-accent-soft); padding:7px 14px; border-radius:999px; margin-bottom:12px; }
.pk-head h2,.pk-head h3{ font-family:"Rubik",sans-serif; font-weight:600; font-size:27px; margin:0; color:var(--pk-ink); }

/* A: ranked pick cards */
.pk-picks{ display:flex; flex-direction:column; gap:22px; max-width:820px; margin:0 auto; list-style:none; padding:0; counter-reset:pk; }
.pk-card{ position:relative; background:var(--pk-card); border:1px solid var(--pk-line); border-radius:var(--pk-r);
  box-shadow:var(--pk-sh); display:grid; grid-template-columns:120px 1fr auto; gap:20px; padding:20px; align-items:center; counter-increment:pk; }
.pk-rank{ position:absolute; top:-12px; left:-12px; width:34px; height:34px; border-radius:50%; background:var(--pk-ink);
  color:#fff; font-family:"Rubik"; font-weight:700; font-size:15px; line-height:34px; text-align:center; box-shadow:var(--pk-shs); }
.pk-rank::before{ content:counter(pk); }
.pk-thumb{ width:120px; height:120px; border-radius:var(--pk-rs); object-fit:cover; background:#f2efe9; }
.pk-body{ min-width:0; }
.pk-award{ display:inline-block; font-weight:700; font-size:11px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--pk-accent); background:var(--pk-accent-soft); padding:6px 11px; border-radius:999px; margin-bottom:9px; }
.pk-name{ font-family:"Rubik"; font-weight:600; font-size:18px; line-height:1.25; margin:0 0 10px; }
.pk-name a{ color:var(--pk-ink); text-decoration:none; }
.pk-name a:hover{ text-decoration:underline; text-decoration-color:var(--pk-accent); }
.pk-chips{ display:flex; flex-wrap:wrap; gap:6px; margin:0; padding:0; list-style:none; }
.pk-chips li{ font-size:12px; color:var(--pk-ink2); background:#f6f3ee; border:1px solid var(--pk-line); padding:4px 9px; border-radius:8px; }
.pk-chips b{ color:var(--pk-ink); font-weight:700; }
.pk-cta{ display:flex; flex-direction:column; gap:8px; text-align:center; min-width:150px; }
.pk-price{ font-family:"Rubik"; font-weight:600; font-size:17px; }
.pk-price del{ color:#a8a29e; font-weight:400; font-size:14px; margin-right:6px; }
.pk-price ins{ text-decoration:none; }
.pk-btn{ display:block; background:var(--pk-accent); color:var(--pk-ink); font-weight:700; font-size:13px; letter-spacing:.04em;
  text-transform:uppercase; padding:12px 18px; border-radius:10px; text-decoration:none; box-shadow:var(--pk-shs);
  transition:background .18s ease, transform .12s ease; cursor:pointer; }
.pk-btn:hover{ background:var(--pk-accent-hover); transform:translateY(-1px); }
.pk-rev{ font-size:12px; color:var(--pk-ink2); text-decoration:none; }
.pk-rev:hover{ color:var(--pk-accent); }

/* B: verdict hero */
.pk-review{ max-width:820px; margin:34px auto 0; }
.pk-review h3,.pk-review h4{ font-family:"Rubik"; font-weight:600; font-size:21px; margin:26px 0 14px; scroll-margin-top:90px; }
.pk-review .n{ color:var(--pk-accent); font-weight:700; margin-right:8px; }
.pk-verdict{ display:grid; grid-template-columns:170px 1fr; gap:24px; align-items:center; background:var(--pk-card);
  border:1px solid var(--pk-line); border-radius:var(--pk-r); box-shadow:var(--pk-sh); padding:22px; }
.pk-verdict img{ width:100%; border-radius:var(--pk-rs); background:#f2efe9; }
.pk-vlabel{ display:block; font-weight:700; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--pk-accent); margin-bottom:8px; }
.pk-vtitle{ font-family:"Rubik"; font-weight:600; font-size:23px; margin:0 0 14px; position:relative; padding-bottom:12px; }
.pk-vtitle::after{ content:""; position:absolute; left:0; bottom:0; width:44px; height:3px; background:var(--pk-accent); border-radius:2px; }
.pk-vprice{ font-family:"Rubik"; font-weight:600; font-size:17px; margin:0 0 14px; }
.pk-vprice del{ color:#a8a29e; font-weight:400; font-size:14px; margin-right:6px; }
.pk-vprice ins{ text-decoration:none; }

/* C: spec grid */
.pk-specs{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--pk-line); border:1px solid var(--pk-line);
  border-radius:var(--pk-rs); overflow:hidden; margin:16px 0 0; list-style:none; padding:0; }
.pk-specs li{ background:var(--pk-card); padding:12px 14px; }
.pk-specs .k{ display:block; font-weight:700; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--pk-accent); margin-bottom:4px; }
.pk-specs .v{ font-size:14px; color:var(--pk-ink); }
.pk-desc{ font-size:15px; line-height:1.7; color:#3f3a35; margin:16px 2px 0; }

@media(max-width:640px){
  .pk-card{ grid-template-columns:1fr; text-align:center; }
  .pk-thumb{ margin:0 auto; }
  .pk-chips{ justify-content:center; }
  .pk-cta{ min-width:0; }
  .pk-verdict{ grid-template-columns:1fr; text-align:center; }
  .pk-verdict img{ max-width:170px; margin:0 auto; }
  .pk-vtitle::after{ left:50%; transform:translateX(-50%); }
  .pk-specs{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:420px){ .pk-specs{ grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce){ .pk-btn{ transition:none; } }