/* ============================================================
   WiO SmartFoods · "Founder's Kitchen" v2.0.0 · CATEGORY EXTRA
   Collection-template-only atoms layered on rd-base.css.
   Reuses rd-base tokens, eyebrow, .rd-prod card, .rd-rcard,
   .rd-guarantee, header/footer. Adds: editorial category hero
   with collage, filter/sort toolbar (PDP .p-filter idiom),
   product-grid shell, results bar, explore-categories grid.
   Discipline: cream through-line, rust identity, green-ink CTA
   only, burgundy seal/proof only, gold 2px rules, NO shadows.
   ============================================================ */

/* ---- Lane fix (page-scoped, rd-base.css owns .rd-prod .save/.macro b — not editable here):
   burgundy is heritage/email + seal ONLY. Re-lane the SAVE chip and macro numerals to rust. ---- */
.rd-prod .save{background:var(--rust)}
.rd-prod .macro b{color:var(--rust)}
.rd-guarantee h2{color:var(--rust)}

/* ---- Breadcrumbs (matches PDP) ---- */
.c-crumbs{padding:16px 0 0}
.c-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:9px;padding:0;margin:0;font-family:var(--sans);font-size:13px;color:var(--meta)}
.c-crumbs a{color:var(--meta)}
.c-crumbs a:hover{color:var(--rust)}
.c-crumbs [aria-current]{color:var(--ink);font-weight:600}
.c-crumbs .sep{color:var(--rule)}

/* ============================================================
   CATEGORY HERO — magazine masthead + asymmetric food collage
   ============================================================ */
.c-hero{background:var(--cream);padding:clamp(24px,4vw,48px) 0 clamp(36px,5vw,72px);overflow:hidden}
.c-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,64px);align-items:center}
.c-hero .issue{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.c-hero .issue .rule{flex:1;height:2px;background:var(--gold);max-width:120px}
.c-hero h1{font-family:var(--serif);font-weight:700;font-size:clamp(38px,5.6vw,66px);line-height:1;letter-spacing:-.02em;text-wrap:balance}
.c-hero h1 em{font-style:italic;color:var(--rust)}
.c-hero .sub{font-family:var(--serif);font-style:italic;font-size:clamp(17px,2.1vw,22px);color:var(--ink-2);margin:22px 0 28px;max-width:34ch;line-height:1.4}
.c-hero .trust{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--rule);font-family:var(--sans);font-size:13.5px;color:var(--ink-2)}
.c-hero .trust .lead{display:inline-flex;align-items:center;gap:8px}
.c-hero .trust b{color:var(--ink);font-weight:700}
.c-hero .trust .sep{color:var(--rule)}
/* collage (same construction as home-a .a-collage) */
.c-collage{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:14px}
.c-collage .tile{position:relative;overflow:hidden;border-radius:4px;background:var(--cream-2)}
.c-collage .tile img{width:100%;height:100%;object-fit:cover}
.c-collage .tile .cap{position:absolute;left:14px;bottom:12px;background:var(--cream);color:var(--rust);font-family:var(--sans);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;padding:5px 11px;border-radius:999px}
.c-collage .big{grid-row:span 2;aspect-ratio:3/4}
.c-collage .sm{aspect-ratio:1/1}
.c-collage .pill{position:absolute;top:-14px;right:-6px;z-index:3;background:var(--cream);color:var(--rust);border:1.5px solid var(--rust);font-family:var(--sans);font-weight:700;font-size:13px;padding:10px 17px;border-radius:999px;transform:rotate(3deg)}
@media(max-width:860px){
  .c-hero-grid{grid-template-columns:1fr;gap:32px}
  .c-collage .pill{top:-10px}
}

/* ============================================================
   FILTER / SORT TOOLBAR — sticky under header, PDP filter idiom
   ============================================================ */
.c-toolbar{background:rgba(250,246,240,.96);backdrop-filter:blur(10px);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);position:sticky;top:61px;z-index:30}
.c-toolbar-in{display:flex;align-items:center;gap:18px;padding:14px 0;flex-wrap:wrap}
.c-filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.c-fk{font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--meta);margin-right:2px}
.c-filter{cursor:pointer;padding:8px 15px;min-height:44px;display:inline-flex;align-items:center;border:1.5px solid var(--rule);background:#fff;color:var(--ink);border-radius:999px;font-family:var(--sans);font-weight:600;font-size:13px;transition:border-color .16s var(--ease),background .16s var(--ease),color .16s var(--ease)}
.c-filter:hover{border-color:var(--rust);color:var(--rust)}
.c-filter[aria-pressed="true"]{background:var(--rust);color:#fff;border-color:var(--rust)}
.c-toolbar .spacer{flex:1}
.c-sort{display:inline-flex;align-items:center;gap:9px}
.c-sort label{font-family:var(--sans);font-weight:700;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--meta)}
.c-sortwrap{position:relative;display:inline-flex;align-items:center}
.c-sort select{appearance:none;-webkit-appearance:none;font-family:var(--sans);font-weight:600;font-size:13.5px;color:var(--ink);background:#fff;border:1.5px solid var(--rule);border-radius:999px;padding:9px 38px 9px 16px;min-height:44px;cursor:pointer}
.c-sort select:hover{border-color:var(--rust)}
.c-sortwrap .chev{position:absolute;right:14px;pointer-events:none;color:var(--ink-2);display:grid;place-items:center}
@media(max-width:680px){
  .c-toolbar{top:57px}
  .c-toolbar-in{gap:12px;flex-wrap:wrap}
  .c-filters{flex-wrap:wrap;min-width:0;max-width:100%}
  .c-filter{flex-shrink:0;min-height:44px;display:inline-flex;align-items:center}
  .c-toolbar .spacer{display:none}
  .c-sort{width:100%}
  .c-sortwrap{flex:1}
  .c-sort select{width:100%}
}

/* ============================================================
   PRODUCT GRID SHELL
   ============================================================ */
.c-shop{background:var(--cream);padding:clamp(32px,4.5vw,56px) 0 clamp(48px,6vw,84px)}
.c-resbar{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:26px;flex-wrap:wrap}
.c-resbar .count{font-family:var(--sans);font-size:14px;color:var(--ink-2)}
.c-resbar .count b{color:var(--ink);font-weight:700}
.c-resbar .promo{font-family:var(--sans);font-weight:600;font-size:13px;color:var(--green-ink);display:inline-flex;align-items:center;gap:7px}
.c-resbar .promo::before{content:"";width:16px;height:2px;background:var(--gold)}
.c-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
@media(max-width:1040px){.c-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.c-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.c-grid{grid-template-columns:1fr 1fr;gap:12px}}

/* in-card subscribe toggle (segmented), layered on .rd-prod */
.rd-prod .toggle{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1.5px solid var(--rule);border-radius:999px;padding:3px;margin-top:4px;background:var(--cream)}
.rd-prod .toggle button{border:0;background:transparent;font-family:var(--sans);font-weight:700;font-size:12.5px;color:var(--ink-2);padding:8px 6px;min-height:44px;border-radius:999px;cursor:pointer;line-height:1.15;letter-spacing:.01em;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;white-space:nowrap}
.rd-prod .toggle button[aria-pressed="true"]{background:var(--green-ink);color:#fff}
.rd-prod .toggle button .pc{display:block;font-size:12px;font-weight:600;opacity:.85;letter-spacing:0;white-space:nowrap}
.rd-prod .toggle button[aria-pressed="true"] .pc{opacity:.95}

/* load-more */
.c-more{text-align:center;margin-top:40px}

/* ============================================================
   TESTIMONIALS (home-a .a-rev-* construction, borrowed classes)
   ============================================================ */
.a-rev-hero{display:grid;grid-template-columns:auto 1fr;gap:clamp(28px,4vw,56px);align-items:center;background:var(--card);border:1px solid var(--rule);border-radius:4px;padding:32px clamp(24px,3vw,44px);margin-bottom:32px}
.a-rev-hero .big{font-family:var(--serif);font-weight:700;font-size:clamp(54px,8vw,84px);color:var(--ink);line-height:1}
.a-rev-hero .starline .stars{font-size:20px;display:block}
.a-rev-hero .starline .lbl{font-family:var(--sans);font-size:14px;color:var(--ink-2);display:block;margin-top:6px}
.a-rev-hero .copy h2{font-family:var(--serif);font-size:clamp(22px,2.8vw,30px);margin-bottom:8px}
.a-rev-hero .copy p{font-family:var(--sans);font-size:16px;color:var(--ink-2);margin:0}
.a-rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:900px){.a-rev-grid{grid-template-columns:1fr}.a-rev-hero{grid-template-columns:1fr;text-align:center}}
.a-rev-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--rule)}
.a-rev-foot .note{font-family:var(--sans);font-size:13px;color:var(--meta)}
.a-rev-foot a{font-family:var(--sans);font-weight:700;font-size:14.5px;color:var(--green-ink);border-bottom:2px solid currentColor;padding-bottom:3px;display:inline-flex;align-items:center;min-height:44px}

/* ============================================================
   EXPLORE MORE CATEGORIES (home-a .a-cat construction)
   ============================================================ */
.c-explore{background:var(--card);padding:clamp(54px,7vw,96px) 0}
.c-explore .a-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:36px}
.c-explore .a-head h2{font-family:var(--serif);font-weight:700;font-size:clamp(28px,4vw,42px);letter-spacing:-.018em;line-height:1.02;margin-top:14px}
.c-explore .a-head .sub{font-family:var(--sans);font-size:16px;color:var(--ink-2);margin-top:12px;max-width:46ch}
.c-explore .a-head .see{font-family:var(--sans);font-weight:700;font-size:14px;color:var(--green-ink);white-space:nowrap;border-bottom:2px solid currentColor;padding-bottom:3px;display:inline-flex;align-items:center;min-height:44px}
.c-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.c-cat{position:relative;aspect-ratio:4/5;border-radius:4px;overflow:hidden;display:flex;align-items:flex-end;color:#fff}
.c-cat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.c-cat:hover img{transform:scale(1.05)}
.c-cat .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,20,12,0) 35%,rgba(40,20,12,.8) 100%)}
.c-cat .ctb{position:relative;z-index:2;padding:20px;display:flex;justify-content:space-between;align-items:flex-end;width:100%}
.c-cat .meta{font-family:var(--sans);font-weight:600;font-size:12px;opacity:.9;letter-spacing:.04em}
.c-cat .lab{font-family:var(--serif);font-weight:700;font-size:clamp(19px,2.2vw,24px);margin-top:3px}
.c-cat .go{font-size:22px}
@media(max-width:880px){.c-catgrid{grid-template-columns:1fr 1fr}.c-explore .a-head{flex-direction:column;align-items:flex-start;gap:12px}}
@media(max-width:480px){.c-catgrid{grid-template-columns:1fr 1fr;gap:12px}}