/* ═══════════════════════════════════════════════
   KnowTheCheese — Shortcode Component Styles
   Visual Component Bible Edition v2.0
   Brand: Literata + DM Sans · Honey/Charcoal
   ═══════════════════════════════════════════════ */

/* ─── Brand Tokens ─── */
:root {
  /* Primary */
  --ktc-honey: #C8902E;
  --ktc-honey-light: #E8B960;
  --ktc-honey-pale: #FDF3E0;

  /* Neutrals */
  --ktc-char: #2A2520;
  --ktc-slate: #4A4340;
  --ktc-stone: #7A7370;
  --ktc-peb: #B8B2AC;
  --ktc-cream: #FAF7F2;
  --ktc-milk: #FFFFFF;

  /* Semantic */
  --ktc-wine: #8B3A4A;
  --ktc-wine-light: #F5E8EB;
  --ktc-sage: #6B8F71;
  --ktc-sage-light: #E8F0E9;
  --ktc-terra: #C4704A;
  --ktc-terra-light: #FDE8E0;
  --ktc-blue: #4A7FB5;
  --ktc-blue-light: #E6F0FA;
  --ktc-purple: #7B5EA7;
  --ktc-purple-light: #F0EBF5;
  --ktc-preg: #9B6B8A;
  --ktc-preg-light: #F8F0F5;
  --ktc-highlight: rgba(200,144,46,0.12);

  /* Typography */
  --ktc-font-display: 'Literata', Georgia, serif;
  --ktc-font-body: 'DM Sans', 'Segoe UI', sans-serif;

  /* Spacing (8px grid) */
  --ktc-sp-xs: 4px;
  --ktc-sp-sm: 8px;
  --ktc-sp-md: 16px;
  --ktc-sp-lg: 24px;
  --ktc-sp-xl: 32px;
  --ktc-sp-2xl: 48px;

  /* Radius */
  --ktc-radius: 6px;
  --ktc-radius-lg: 10px;
  --ktc-radius-pill: 999px;
}


/* ─── Global Component Resets ─── */

.ktc-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  flex-shrink: 0;
}

/* Highlight span */
.ktc-hl {
  background: var(--ktc-highlight);
  padding: 1px 5px;
  border-radius: 3px;
  font-weight: 500;
}


/* ═══════════════════════════════════════════════
   1. PROSE — Styled Lists
   ═══════════════════════════════════════════════ */

.ktc-list-check,
.ktc-list-dot,
.ktc-list-arrow,
.ktc-list-numbered {
  list-style: none;
  padding: 0;
  margin: 0 0 1.25em;
}

.ktc-list-check li,
.ktc-list-dot li,
.ktc-list-arrow li,
.ktc-list-numbered li {
  padding: 6px 0 6px 28px;
  position: relative;
  line-height: 1.6;
}

.ktc-list-check li::before {
  content: '\2713';
  position: absolute;
  left: 0;
  color: var(--ktc-sage);
  font-weight: 700;
}

.ktc-list-dot li::before {
  content: '\2022';
  position: absolute;
  left: 6px;
  color: var(--ktc-honey);
  font-weight: 700;
  font-size: 1.2em;
}

.ktc-list-arrow li::before {
  content: '\2192';
  position: absolute;
  left: 0;
  color: var(--ktc-honey);
  font-weight: 600;
}

.ktc-list-numbered {
  counter-reset: ktc-counter;
}

.ktc-list-numbered li {
  counter-increment: ktc-counter;
  padding-left: 36px;
}

.ktc-list-numbered li::before {
  content: counter(ktc-counter);
  position: absolute;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--ktc-char);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 8px;
}


/* ═══════════════════════════════════════════════
   2. CALLOUTS & SUMMARY
   ═══════════════════════════════════════════════ */

.ktc-callout {
  border-radius: 0 var(--ktc-radius-lg) var(--ktc-radius-lg) 0;
  padding: 18px 22px;
  margin: var(--ktc-sp-xl) 0;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.ktc-callout__icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  margin-top: 2px;
}

.ktc-callout__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 4px;
  font-family: var(--ktc-font-body);
}

.ktc-callout__content {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ktc-slate);
}

.ktc-callout__content p:last-child {
  margin-bottom: 0;
}

/* Tip — sage */
.ktc-callout--tip {
  border-left: 4px solid var(--ktc-sage);
  background: var(--ktc-sage-light);
}
.ktc-callout--tip .ktc-callout__icon,
.ktc-callout--tip .ktc-callout__label { color: var(--ktc-sage); }

/* Warning — wine */
.ktc-callout--warning {
  border-left: 4px solid var(--ktc-wine);
  background: var(--ktc-wine-light);
}
.ktc-callout--warning .ktc-callout__icon,
.ktc-callout--warning .ktc-callout__label { color: var(--ktc-wine); }

/* Note — blue */
.ktc-callout--note,
.ktc-callout--info {
  border-left: 4px solid var(--ktc-blue);
  background: var(--ktc-blue-light);
}
.ktc-callout--note .ktc-callout__icon,
.ktc-callout--note .ktc-callout__label,
.ktc-callout--info .ktc-callout__icon,
.ktc-callout--info .ktc-callout__label { color: var(--ktc-blue); }

/* Rule — purple */
.ktc-callout--rule {
  border-left: 4px solid var(--ktc-purple);
  background: var(--ktc-purple-light);
}
.ktc-callout--rule .ktc-callout__icon,
.ktc-callout--rule .ktc-callout__label { color: var(--ktc-purple); }

/* Pregnancy — preg purple */
.ktc-callout--pregnancy {
  border-left: 4px solid var(--ktc-preg);
  background: var(--ktc-preg-light);
}
.ktc-callout--pregnancy .ktc-callout__icon,
.ktc-callout--pregnancy .ktc-callout__label { color: var(--ktc-preg); }

/* Quick Summary — honey border-left */
.ktc-summary {
  border-left: 4px solid var(--ktc-honey);
  background: var(--ktc-honey-pale);
  border-radius: 0 var(--ktc-radius-lg) var(--ktc-radius-lg) 0;
  padding: 20px 24px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-summary__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--ktc-honey);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  font-family: var(--ktc-font-body);
}

.ktc-summary__body {
  font-size: 15px;
  line-height: 1.7;
  color: var(--ktc-char);
}

.ktc-summary__body p:last-child {
  margin-bottom: 0;
}

.ktc-summary__picks {
  display: flex;
  gap: 20px;
  margin-top: 12px;
  font-size: 13px;
  color: var(--ktc-slate);
}

.ktc-summary__picks span {
  display: flex;
  align-items: center;
  gap: 4px;
}


/* ═══════════════════════════════════════════════
   3. DATA — Facts, Attrs, KeyFacts, Uses, Storage, Temp, Shopping
   ═══════════════════════════════════════════════ */

/* Facts Strip */
.ktc-facts-strip {
  display: flex;
  background: var(--ktc-milk);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.12);
  overflow: hidden;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-facts-strip__item {
  flex: 1;
  padding: 18px 14px;
  text-align: center;
  border-right: 1px solid rgba(42,37,32,.08);
}

.ktc-facts-strip__item:last-child {
  border-right: none;
}

.ktc-facts-strip__icon {
  color: var(--ktc-honey);
  margin-bottom: 6px;
}

.ktc-facts-strip__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.2px;
  color: var(--ktc-stone);
  margin-bottom: 3px;
  text-transform: uppercase;
}

.ktc-facts-strip__value {
  font-size: 14px;
  font-weight: 700;
  color: var(--ktc-char);
}


/* Attribute Pills — 3-col grid with circle icons */
.ktc-attrs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-attrs__pill {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius);
  border: 1px solid rgba(42,37,32,.08);
}

.ktc-attrs__pill-icon {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 50%;
  background: var(--ktc-honey-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ktc-honey);
}

.ktc-attrs__pill-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  color: var(--ktc-stone);
  text-transform: uppercase;
  display: block;
}

.ktc-attrs__pill-value {
  font-size: 13px;
  font-weight: 500;
  color: var(--ktc-char);
  display: block;
}

.ktc-attrs__pill-link {
  color: var(--ktc-honey);
  text-decoration: none;
  font-weight: 600;
}

.ktc-attrs__pill-link:hover {
  text-decoration: underline;
}


/* Key Facts Card */
.ktc-keyfacts {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-keyfacts__header {
  background: var(--ktc-char);
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-milk);
  text-transform: uppercase;
  font-family: var(--ktc-font-body);
}

.ktc-keyfacts__body {
  padding: 4px 0;
}

.ktc-keyfacts__row {
  display: flex;
  justify-content: space-between;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(42,37,32,.06);
  font-size: 13px;
}

.ktc-keyfacts__row:nth-child(even) {
  background: var(--ktc-cream);
}

.ktc-keyfacts__row:last-child {
  border-bottom: none;
}

.ktc-keyfacts__label {
  font-weight: 600;
  color: var(--ktc-slate);
}

.ktc-keyfacts__value {
  color: var(--ktc-char);
  text-align: right;
  max-width: 60%;
}

.ktc-keyfacts__verdict {
  padding: 12px 18px;
  background: var(--ktc-honey-pale);
  border-top: 1px solid rgba(200,144,46,.2);
  font-size: 13px;
  font-weight: 600;
  color: var(--ktc-char);
}


/* Best Uses Grid — 4 columns */
.ktc-uses {
  margin: var(--ktc-sp-xl) 0;
}

.ktc-uses__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.ktc-uses__item {
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius);
  padding: 14px;
  border: 1px solid rgba(42,37,32,.08);
}

.ktc-uses__item--great {
  background: var(--ktc-sage-light);
  border-color: rgba(107,143,113,.2);
}

.ktc-uses__item--notideal {
  background: var(--ktc-cream);
  opacity: .65;
}

.ktc-uses__item-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktc-char);
  margin-bottom: 4px;
}

.ktc-uses__item-text {
  font-size: 12px;
  color: var(--ktc-slate);
  line-height: 1.5;
}


/* Storage Card with Progress Bars */
.ktc-storage {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-storage__header {
  background: var(--ktc-char);
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-milk);
  text-transform: uppercase;
  font-family: var(--ktc-font-body);
}

.ktc-storage__body {
  padding: 8px 18px;
}

.ktc-storage__row {
  padding: 10px 0;
  border-bottom: 1px solid rgba(42,37,32,.06);
}

.ktc-storage__row:last-child {
  border-bottom: none;
}

.ktc-storage__row-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}

.ktc-storage__row-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-storage__days {
  font-size: 12px;
  font-weight: 700;
  color: var(--ktc-honey);
}

.ktc-storage__bar-track {
  height: 6px;
  background: rgba(42,37,32,.08);
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 6px;
}

.ktc-storage__bar-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .3s ease;
}

.ktc-storage__row-note {
  font-size: 12px;
  color: var(--ktc-stone);
  line-height: 1.5;
}


/* Temperature Strip */
.ktc-temp {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 18px;
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.08);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-temp__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-stone);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ktc-temp__range {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ktc-temp__value {
  font-size: 18px;
  font-weight: 700;
  color: var(--ktc-char);
  font-family: var(--ktc-font-display);
}

.ktc-temp__sep {
  font-size: 12px;
  color: var(--ktc-stone);
}

.ktc-temp__unit {
  font-size: 13px;
  color: var(--ktc-stone);
}

.ktc-temp__note {
  font-size: 12px;
  color: var(--ktc-stone);
  margin-left: auto;
}


/* Shopping Tips */
.ktc-shopping {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-shopping__header {
  background: var(--ktc-char);
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-milk);
  text-transform: uppercase;
  font-family: var(--ktc-font-body);
}

.ktc-shopping__body {
  padding: 8px 18px;
}

.ktc-shopping__row {
  padding: 10px 0;
  border-bottom: 1px solid rgba(42,37,32,.06);
}

.ktc-shopping__row:last-child {
  border-bottom: none;
}

.ktc-shopping__row-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktc-char);
  margin-bottom: 2px;
}

.ktc-shopping__row-text {
  font-size: 12px;
  color: var(--ktc-stone);
  line-height: 1.5;
}


/* ═══════════════════════════════════════════════
   4. SCORING — Scores, Match Circles, Radar, PriceBars, NumRow
   ═══════════════════════════════════════════════ */

/* Score Bars */
.ktc-scores {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-scores__header {
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-honey);
  text-transform: uppercase;
  background: var(--ktc-cream);
  border-bottom: 1px solid rgba(42,37,32,.08);
  font-family: var(--ktc-font-body);
}

.ktc-scores__body {
  padding: 14px 18px;
}

.ktc-scores__bar {
  margin-bottom: 14px;
}

.ktc-scores__bar:last-child {
  margin-bottom: 0;
}

.ktc-scores__bar-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: 5px;
}

.ktc-scores__bar-label {
  font-size: 13px;
  font-weight: 500;
  color: var(--ktc-slate);
}

.ktc-scores__bar-value {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktc-char);
}

.ktc-scores__bar-track {
  height: 8px;
  background: rgba(42,37,32,.08);
  border-radius: 4px;
  overflow: hidden;
}

.ktc-scores__bar-fill {
  height: 100%;
  border-radius: 4px;
  transition: width .4s ease;
}


/* Match Percentage Circles */
.ktc-match {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
  margin: var(--ktc-sp-xl) 0;
  justify-content: center;
}

.ktc-match__item {
  text-align: center;
  min-width: 90px;
}

.ktc-match__name {
  font-size: 13px;
  font-weight: 600;
  color: var(--ktc-char);
  margin-top: 8px;
}

.ktc-match__note {
  font-size: 11px;
  color: var(--ktc-stone);
  margin-top: 2px;
}


/* Radar Chart */
.ktc-radar {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-radar__header {
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-honey);
  text-transform: uppercase;
  background: var(--ktc-cream);
  border-bottom: 1px solid rgba(42,37,32,.08);
  font-family: var(--ktc-font-body);
}

.ktc-radar__body {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 18px;
}

.ktc-radar__chart-wrap {
  flex: 0 0 200px;
}

.ktc-radar__svg {
  width: 200px;
  height: 200px;
}

.ktc-radar__bars {
  flex: 1;
}

.ktc-radar__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.ktc-radar__bar:last-child {
  margin-bottom: 0;
}

.ktc-radar__bar-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--ktc-stone);
  min-width: 50px;
  text-transform: uppercase;
}

.ktc-radar__bar-track {
  flex: 1;
  height: 6px;
  background: rgba(42,37,32,.08);
  border-radius: 3px;
  overflow: hidden;
}

.ktc-radar__bar-fill {
  height: 100%;
  border-radius: 3px;
  background: var(--ktc-honey);
}

.ktc-radar__bar-val {
  font-size: 11px;
  font-weight: 700;
  color: var(--ktc-char);
  min-width: 24px;
  text-align: right;
}


/* Price Bars */
.ktc-pricebars {
  margin: var(--ktc-sp-xl) 0;
}

.ktc-pricebars__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-stone);
  margin-bottom: 14px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ktc-pricebars__bar {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
  font-size: 13px;
}

.ktc-pricebars__name {
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-pricebars__track {
  height: 20px;
  background: rgba(42,37,32,.06);
  border-radius: 4px;
  overflow: hidden;
}

.ktc-pricebars__fill {
  height: 100%;
  border-radius: 4px;
  background: var(--ktc-honey);
}

.ktc-pricebars__price {
  font-weight: 700;
  color: var(--ktc-char);
  font-size: 12px;
  min-width: 55px;
  text-align: right;
}


/* Number Row — stat cards with colored backgrounds */
.ktc-numrow {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-numrow__stat {
  flex: 1;
  min-width: 100px;
  padding: 14px 16px;
  background: var(--ktc-honey-pale);
  border-radius: var(--ktc-radius);
  text-align: center;
}

.ktc-numrow__value {
  font-family: var(--ktc-font-display);
  font-size: 22px;
  font-weight: 700;
  color: var(--ktc-char);
  line-height: 1.2;
}

.ktc-numrow__label {
  font-size: 11px;
  font-weight: 600;
  color: var(--ktc-slate);
  margin-top: 2px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.ktc-numrow__note {
  font-size: 10px;
  color: var(--ktc-stone);
  margin-top: 4px;
}


/* ═══════════════════════════════════════════════
   5. TABLES — Compare, Nutrition
   ═══════════════════════════════════════════════ */

/* Compare Table with honeyP highlight column */
.ktc-compare-wrap {
  margin: var(--ktc-sp-xl) 0;
  overflow-x: auto;
}

.ktc-compare {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.ktc-compare th {
  padding: 14px 16px;
  text-align: center;
  font-family: var(--ktc-font-display);
  font-weight: 600;
  font-size: 15px;
  background: var(--ktc-cream);
  color: var(--ktc-char);
  border-bottom: 1px solid rgba(42,37,32,.12);
}

.ktc-compare__highlight-head {
  background: var(--ktc-honey-pale) !important;
}

.ktc-compare__attr-col {
  width: 140px;
  text-align: left !important;
}

.ktc-compare td {
  padding: 10px 16px;
  font-size: 13px;
  text-align: center;
  border-bottom: 1px solid rgba(42,37,32,.06);
}

.ktc-compare tr:nth-child(even) td {
  background: var(--ktc-cream);
}

.ktc-compare__row-label {
  text-align: left !important;
  font-weight: 600;
  color: var(--ktc-slate);
}

.ktc-compare__highlight {
  background: rgba(253,243,224,.5) !important;
}


/* Nutrition Table — charcoal header, alternating rows */
.ktc-nutrition {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-nutrition__header {
  background: var(--ktc-char);
  padding: 12px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-milk);
  text-transform: uppercase;
  font-family: var(--ktc-font-body);
}

.ktc-nutrition__serving {
  font-size: 11px;
  font-weight: 400;
  opacity: .7;
  letter-spacing: 0;
  text-transform: none;
}

.ktc-nutrition__body {
  padding: 0;
}

.ktc-nutrition__row {
  display: flex;
  justify-content: space-between;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(42,37,32,.06);
  font-size: 13px;
  color: var(--ktc-char);
}

.ktc-nutrition__row:nth-child(even) {
  background: var(--ktc-cream);
}

.ktc-nutrition__row:last-child {
  border-bottom: none;
}


/* ═══════════════════════════════════════════════
   6. INTERACTIVE — Tabs, FAQ, Checklist, Toggle
   ═══════════════════════════════════════════════ */

/* Tabs — honey active border */
.ktc-tabs {
  margin: var(--ktc-sp-xl) 0;
}

.ktc-tabs__nav {
  display: flex;
  border-bottom: 2px solid rgba(42,37,32,.12);
}

.ktc-tabs__btn {
  padding: 10px 20px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  background: transparent;
  color: var(--ktc-stone);
  font-family: var(--ktc-font-body);
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  transition: color .15s, border-color .15s;
}

.ktc-tabs__btn:hover {
  color: var(--ktc-char);
}

.ktc-tabs__btn.is-active {
  color: var(--ktc-honey);
  border-bottom-color: var(--ktc-honey);
}

.ktc-tabs__panel {
  display: none;
  padding: 18px 0;
}

.ktc-tabs__panel.is-active {
  display: block;
}


/* FAQ Accordion — single-open per block */
.ktc-faq {
  margin: var(--ktc-sp-xl) 0;
}

.ktc-faq__item {
  background: var(--ktc-milk);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.12);
  overflow: hidden;
  margin-bottom: 8px;
}

.ktc-faq__question {
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--ktc-char);
  background: none;
  border: none;
  width: 100%;
  text-align: left;
  font-family: var(--ktc-font-body);
  line-height: 1.4;
}

.ktc-faq__question:hover {
  background: var(--ktc-cream);
}

.ktc-faq__icon {
  width: 16px;
  height: 16px;
  color: var(--ktc-peb);
  transition: transform .2s, color .2s;
  flex-shrink: 0;
  margin-left: 12px;
}

.ktc-faq__item.is-open .ktc-faq__icon {
  transform: rotate(45deg);
  color: var(--ktc-honey);
}

.ktc-faq__answer {
  display: none;
  padding: 0 18px 16px;
  font-size: 14px;
  color: var(--ktc-slate);
  line-height: 1.7;
}

.ktc-faq__answer p:last-child {
  margin-bottom: 0;
}

.ktc-faq__item.is-open .ktc-faq__answer {
  display: block;
}


/* Checklist — charcoal header, toggle checkmarks, counter */
.ktc-checklist {
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.12);
  overflow: hidden;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-checklist__header {
  background: var(--ktc-char);
  color: var(--ktc-milk);
  padding: 10px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.5px;
  font-family: var(--ktc-font-body);
}

.ktc-checklist__counter {
  margin-left: auto;
  font-weight: 400;
  opacity: .6;
  font-size: 11px;
}

.ktc-checklist__body {
  padding: 8px 14px;
}

.ktc-checklist__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 4px;
  border-bottom: 1px solid rgba(42,37,32,.06);
  cursor: pointer;
  font-size: 14px;
  color: var(--ktc-char);
  transition: opacity .15s;
}

.ktc-checklist__item:last-child {
  border-bottom: none;
}

.ktc-checklist__box {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  border: 2px solid var(--ktc-peb);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color .15s, background .15s;
  color: transparent;
}

.ktc-checklist__item.is-checked .ktc-checklist__box {
  border-color: var(--ktc-sage);
  background: var(--ktc-sage-light);
  color: var(--ktc-sage);
}

.ktc-checklist__item.is-checked .ktc-checklist__text {
  text-decoration: line-through;
  opacity: .55;
}


/* Toggle Reveal */
.ktc-toggle {
  background: var(--ktc-milk);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.12);
  overflow: hidden;
  margin-bottom: 8px;
}

.ktc-toggle__header {
  padding: 14px 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-toggle__header-icon {
  transition: transform .2s;
  color: var(--ktc-peb);
}

.ktc-toggle.is-open .ktc-toggle__header {
  background: var(--ktc-honey-pale);
}

.ktc-toggle.is-open .ktc-toggle__header-icon {
  transform: rotate(180deg);
  color: var(--ktc-honey);
}

.ktc-toggle__content {
  display: none;
  padding: 0 18px 16px;
  font-size: 14px;
  color: var(--ktc-slate);
  line-height: 1.7;
  background: var(--ktc-honey-pale);
}

.ktc-toggle.is-open .ktc-toggle__content {
  display: block;
}


/* ═══════════════════════════════════════════════
   7. CARDS — Picks, ProsCons, Steps, Pairing, Verdict, Seasons, DoDont
   ═══════════════════════════════════════════════ */

/* Ranked Picks — colored badge headers */
.ktc-picks {
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-picks__header {
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-honey);
  text-transform: uppercase;
  background: var(--ktc-cream);
  border-bottom: 1px solid rgba(42,37,32,.08);
  font-family: var(--ktc-font-body);
}

.ktc-picks__list {
  padding: 0;
}

.ktc-picks__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(42,37,32,.06);
}

.ktc-picks__item:last-child {
  border-bottom: none;
}

.ktc-picks__rank {
  width: 28px;
  height: 28px;
  min-width: 28px;
  border-radius: 6px;
  color: var(--ktc-milk);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ktc-font-display);
  font-size: 14px;
  font-weight: 700;
  margin-top: 2px;
}

.ktc-picks__body {
  flex: 1;
}

.ktc-picks__name {
  font-family: var(--ktc-font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-picks__note {
  font-size: 13px;
  color: var(--ktc-slate);
  margin-top: 4px;
  line-height: 1.5;
}

.ktc-picks__use {
  font-size: 11px;
  color: var(--ktc-stone);
  padding: 4px 8px;
  background: var(--ktc-cream);
  border-radius: 4px;
  display: inline-block;
  margin-top: 8px;
}

.ktc-picks__match {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktc-honey);
  white-space: nowrap;
  margin-top: 4px;
}


/* Pros & Cons — 2-col sage/wine split */
.ktc-proscons {
  display: flex;
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-proscons__col {
  flex: 1;
  padding: 0;
}

.ktc-proscons__col--cons {
  border-left: 1px solid rgba(42,37,32,.08);
}

.ktc-proscons__label {
  padding: 10px 16px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.ktc-proscons__list {
  padding: 8px 16px 14px;
}

.ktc-proscons__item {
  display: flex;
  gap: 6px;
  font-size: 13px;
  color: var(--ktc-char);
  margin-bottom: 7px;
  line-height: 1.5;
}


/* Steps — numbered circles charcoal bg */
.ktc-steps {
  margin: var(--ktc-sp-xl) 0;
}

.ktc-step {
  display: flex;
  gap: 16px;
  padding: 16px 20px;
  background: var(--ktc-milk);
  border-radius: 8px;
  border: 1px solid rgba(42,37,32,.08);
  align-items: flex-start;
  margin-bottom: 10px;
}

.ktc-step__number {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 50%;
  background: var(--ktc-char);
  color: var(--ktc-milk);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--ktc-font-display);
  font-size: 15px;
  font-weight: 600;
}

.ktc-step__title {
  font-size: 15px;
  font-weight: 600;
  color: var(--ktc-char);
  margin-bottom: 3px;
}

.ktc-step__body {
  font-size: 14px;
  color: var(--ktc-slate);
  line-height: 1.6;
}


/* Pairing Cards — wine-colored side strip, star icon */
.ktc-pairing {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-pairing__card {
  display: flex;
  border-radius: var(--ktc-radius);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.08);
  background: var(--ktc-milk);
}

.ktc-pairing__card-strip {
  width: 4px;
  background: var(--ktc-wine);
  flex-shrink: 0;
}

.ktc-pairing__card-body {
  padding: 12px 14px;
  flex: 1;
}

.ktc-pairing__card-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--ktc-char);
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ktc-pairing__card-label .ktc-icon {
  color: var(--ktc-honey);
}

.ktc-pairing__card-note {
  font-size: 12px;
  color: var(--ktc-slate);
  line-height: 1.5;
}

.ktc-pairing__card-type {
  font-size: 10px;
  font-weight: 700;
  color: var(--ktc-stone);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 6px;
}


/* Verdict — charcoal bg, honey label "THE BOTTOM LINE" */
.ktc-verdict {
  background: var(--ktc-char);
  border-radius: var(--ktc-radius-lg);
  padding: 22px 24px;
  margin: var(--ktc-sp-2xl) 0;
}

.ktc-verdict__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: var(--ktc-honey);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--ktc-font-body);
}

.ktc-verdict__body {
  font-size: 15px;
  line-height: 1.7;
  color: var(--ktc-peb);
}

.ktc-verdict__body p:last-child {
  margin-bottom: 0;
}

.ktc-verdict__body strong {
  color: var(--ktc-milk);
  font-weight: 700;
}

.ktc-verdict__picks {
  display: flex;
  gap: 16px;
  font-size: 12px;
  color: var(--ktc-honey-light);
  margin-top: 14px;
}

.ktc-verdict__picks span {
  display: flex;
  align-items: center;
  gap: 4px;
}


/* Seasons — 2x2 grid, seasonal colors */
.ktc-seasons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-seasons__card {
  background: var(--ktc-milk);
  border-radius: var(--ktc-radius);
  padding: 14px 16px;
  border: 1px solid rgba(42,37,32,.08);
}

.ktc-seasons__season {
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.ktc-seasons__text {
  font-size: 12px;
  color: var(--ktc-slate);
  line-height: 1.5;
}


/* Do / Don't */
.ktc-dodont {
  display: flex;
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-dodont__col {
  flex: 1;
  padding: 0;
}

.ktc-dodont__col + .ktc-dodont__col {
  border-left: 1px solid rgba(42,37,32,.08);
}

.ktc-dodont__col-label {
  padding: 10px 16px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
}

.ktc-dodont__item {
  display: flex;
  gap: 6px;
  font-size: 13px;
  color: var(--ktc-char);
  padding: 6px 16px;
  line-height: 1.5;
}

.ktc-dodont__item:last-child {
  padding-bottom: 14px;
}


/* ═══════════════════════════════════════════════
   8. TRUST / E-E-A-T
   ═══════════════════════════════════════════════ */

/* Author Box — full bio card with avatar circle */
.ktc-author {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 18px 20px;
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.08);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-author__avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
}

.ktc-author__avatar-placeholder {
  width: 64px;
  height: 64px;
  min-width: 64px;
  border-radius: 50%;
  background: var(--ktc-honey-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ktc-honey);
}

.ktc-author__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-stone);
  text-transform: uppercase;
  margin-bottom: 2px;
}

.ktc-author__name {
  font-family: var(--ktc-font-display);
  font-size: 16px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-author__name a {
  color: var(--ktc-char);
  text-decoration: none;
}

.ktc-author__name a:hover {
  color: var(--ktc-honey);
}

.ktc-author__bio {
  font-size: 13px;
  color: var(--ktc-slate);
  margin-top: 4px;
  line-height: 1.5;
}


/* Byline (compact) */
.ktc-byline {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  color: var(--ktc-stone);
  margin: var(--ktc-sp-md) 0;
}

.ktc-byline__by a {
  color: var(--ktc-char);
  font-weight: 600;
  text-decoration: none;
}

.ktc-byline__date {
  display: flex;
  align-items: center;
  gap: 4px;
}


/* Reviewed Badge — sage */
.ktc-reviewed {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: var(--ktc-sage-light);
  border-radius: var(--ktc-radius);
  border: 1px solid rgba(107,143,113,.15);
  font-size: 12px;
  color: var(--ktc-sage);
  margin: var(--ktc-sp-md) 0;
}

.ktc-reviewed__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.ktc-reviewed__date {
  color: var(--ktc-stone);
  margin-left: 4px;
}


/* Updated Badge — cream with calendar */
.ktc-updated {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius);
  border: 1px solid rgba(42,37,32,.08);
  font-size: 12px;
  color: var(--ktc-stone);
  margin: var(--ktc-sp-md) 0;
}

.ktc-updated__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--ktc-slate);
}


/* Sources — numbered with type badges */
.ktc-sources {
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.12);
  overflow: hidden;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-sources__header {
  padding: 10px 16px;
  background: var(--ktc-cream);
  border-bottom: 1px solid rgba(42,37,32,.08);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--ktc-honey);
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: var(--ktc-font-body);
}

.ktc-sources__list {
  padding: 12px 16px;
}

.ktc-source {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(42,37,32,.06);
}

.ktc-source:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.ktc-source__num {
  font-size: 11px;
  font-weight: 700;
  color: var(--ktc-honey);
  font-family: var(--ktc-font-display);
  min-width: 18px;
}

.ktc-source__text {
  font-size: 13px;
  color: var(--ktc-char);
  font-weight: 500;
}

.ktc-source__text a {
  color: var(--ktc-honey);
  text-decoration: none;
  margin-left: 4px;
}

.ktc-source__meta {
  font-size: 11.5px;
  color: var(--ktc-stone);
  margin-top: 2px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ktc-source__badge {
  font-size: 9px;
  font-weight: 700;
  padding: 1px 6px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* Source badge types: PDO, Journal, Dairy Board */
.ktc-source__badge--pdo        { background: var(--ktc-honey-pale); color: var(--ktc-honey); }
.ktc-source__badge--journal    { background: var(--ktc-blue-light); color: var(--ktc-blue); }
.ktc-source__badge--dairy      { background: var(--ktc-sage-light); color: var(--ktc-sage); }
.ktc-source__badge--gov        { background: var(--ktc-sage-light); color: var(--ktc-sage); }
.ktc-source__badge--university { background: var(--ktc-purple-light); color: var(--ktc-purple); }
.ktc-source__badge--expert     { background: var(--ktc-terra-light); color: var(--ktc-terra); }

.ktc-source__note {
  font-size: 11px;
  color: var(--ktc-stone);
  margin-top: 4px;
  line-height: 1.5;
}


/* ═══════════════════════════════════════════════
   9. CTAs — Pin, Subscribe, Crosslink, Related
   ═══════════════════════════════════════════════ */

/* Pinterest Save — charcoal bg, honey button, bookmark icon */
.ktc-pin {
  background: var(--ktc-char);
  border-radius: var(--ktc-radius-lg);
  padding: 18px 22px;
  display: flex;
  align-items: center;
  gap: 16px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-pin__icon {
  color: var(--ktc-honey);
  flex-shrink: 0;
}

.ktc-pin__body {
  flex: 1;
}

.ktc-pin__text {
  font-size: 14px;
  color: var(--ktc-peb);
  line-height: 1.5;
}

.ktc-pin__btn {
  padding: 10px 20px;
  background: var(--ktc-honey);
  color: var(--ktc-milk);
  border-radius: var(--ktc-radius);
  border: none;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background .15s;
}

.ktc-pin__btn:hover {
  background: var(--ktc-honey-light);
  color: var(--ktc-milk);
}


/* Newsletter Subscribe — honeyP gradient, pill button */
.ktc-subscribe {
  background: linear-gradient(135deg, var(--ktc-honey-pale), var(--ktc-cream));
  border-radius: var(--ktc-radius-lg);
  padding: 22px 24px;
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid rgba(200,144,46,.15);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-subscribe__body {
  flex: 1;
}

.ktc-subscribe__title {
  font-size: 15px;
  font-weight: 700;
  color: var(--ktc-char);
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

.ktc-subscribe__text {
  font-size: 13px;
  color: var(--ktc-slate);
}

.ktc-subscribe__btn {
  padding: 10px 24px;
  background: var(--ktc-honey);
  color: var(--ktc-milk);
  border-radius: var(--ktc-radius-pill);
  border: none;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
  transition: background .15s;
}

.ktc-subscribe__btn:hover {
  background: var(--ktc-honey-light);
  color: var(--ktc-milk);
}


/* Cross-Silo CTA — cream bg, charcoal left border, book icon */
.ktc-crosslink {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  background: var(--ktc-cream);
  border-radius: var(--ktc-radius-lg);
  border: 1px solid rgba(42,37,32,.08);
  border-left: 4px solid var(--ktc-char);
  margin: var(--ktc-sp-xl) 0;
}

.ktc-crosslink__icon {
  color: var(--ktc-char);
  flex-shrink: 0;
}

.ktc-crosslink__body {
  flex: 1;
}

.ktc-crosslink__type {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-stone);
  text-transform: uppercase;
  margin-bottom: 2px;
}

.ktc-crosslink__title {
  font-family: var(--ktc-font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-crosslink__btn {
  padding: 8px 16px;
  background: var(--ktc-char);
  color: var(--ktc-milk);
  border-radius: var(--ktc-radius);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: background .15s;
}

.ktc-crosslink__btn:hover {
  background: var(--ktc-slate);
  color: var(--ktc-milk);
}


/* Related Card */
.ktc-related {
  display: flex;
  gap: 16px;
  padding: 16px 20px;
  background: var(--ktc-cream);
  border-radius: 8px;
  border: 1px solid rgba(42,37,32,.08);
  align-items: center;
  margin: var(--ktc-sp-xl) 0;
  text-decoration: none;
  transition: border-color .15s;
}

.ktc-related:hover {
  border-color: var(--ktc-honey);
}

.ktc-related__icon-box {
  width: 52px;
  height: 52px;
  min-width: 52px;
  border-radius: 8px;
  background: var(--ktc-honey-pale);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ktc-honey);
}

.ktc-related__body {
  flex: 1;
}

.ktc-related__type {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.5px;
  color: var(--ktc-honey);
  text-transform: uppercase;
  margin-bottom: 2px;
}

.ktc-related__title {
  font-family: var(--ktc-font-display);
  font-size: 15px;
  font-weight: 600;
  color: var(--ktc-char);
}

.ktc-related__desc {
  font-size: 12px;
  color: var(--ktc-stone);
  margin-top: 2px;
}

.ktc-related__arrow {
  color: var(--ktc-peb);
  flex-shrink: 0;
  transition: color .15s;
}

.ktc-related:hover .ktc-related__arrow {
  color: var(--ktc-honey);
}


/* ═══════════════════════════════════════════════
   10. NAVIGATION — Aging Timeline, Badges, Pregnancy
   ═══════════════════════════════════════════════ */

/* Aging Timeline — dots on a vertical line */
.ktc-aging {
  position: relative;
  padding-left: 24px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-aging__line {
  position: absolute;
  left: 7px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--ktc-peb);
}

.ktc-aging__stage {
  position: relative;
  padding-bottom: 16px;
}

.ktc-aging__stage:last-child {
  padding-bottom: 0;
}

.ktc-aging__dot {
  position: absolute;
  left: -24px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--ktc-honey);
  border: 3px solid var(--ktc-milk);
  box-shadow: 0 0 0 2px var(--ktc-honey);
}

.ktc-aging__stage-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--ktc-char);
}

.ktc-aging__months {
  font-size: 12px;
  font-weight: 600;
  color: var(--ktc-honey);
  margin-top: 2px;
}

.ktc-aging__desc {
  font-size: 12px;
  color: var(--ktc-stone);
  margin-top: 2px;
  line-height: 1.5;
}


/* Inline Badges (11 types) */
.ktc-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--ktc-radius-pill);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  vertical-align: middle;
}

.ktc-badge--default  { background: var(--ktc-cream); color: var(--ktc-slate); }
.ktc-badge--honey    { background: var(--ktc-honey-pale); color: var(--ktc-honey); }
.ktc-badge--sage     { background: var(--ktc-sage-light); color: var(--ktc-sage); }
.ktc-badge--wine     { background: var(--ktc-wine-light); color: var(--ktc-wine); }
.ktc-badge--blue     { background: var(--ktc-blue-light); color: var(--ktc-blue); }
.ktc-badge--purple   { background: var(--ktc-purple-light); color: var(--ktc-purple); }
.ktc-badge--terra    { background: var(--ktc-terra-light); color: var(--ktc-terra); }
.ktc-badge--preg     { background: var(--ktc-preg-light); color: var(--ktc-preg); }
.ktc-badge--cheese   { background: var(--ktc-honey-pale); color: var(--ktc-honey); }
.ktc-badge--compare  { background: var(--ktc-blue-light); color: var(--ktc-blue); }
.ktc-badge--guide    { background: var(--ktc-sage-light); color: var(--ktc-sage); }


/* Pregnancy Safety */
.ktc-pregnancy {
  border-left: 4px solid var(--ktc-preg);
  background: var(--ktc-preg-light);
  border-radius: 0 var(--ktc-radius-lg) var(--ktc-radius-lg) 0;
  padding: 16px 20px;
  margin: var(--ktc-sp-xl) 0;
}

.ktc-pregnancy__header {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.ktc-pregnancy__note {
  font-size: 13px;
  color: var(--ktc-slate);
  line-height: 1.6;
}


/* Matrix Table */
.ktc-matrix-wrap {
  margin: var(--ktc-sp-xl) 0;
  overflow-x: auto;
}

.ktc-matrix {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: var(--ktc-radius-lg);
  overflow: hidden;
  border: 1px solid rgba(42,37,32,.12);
}

.ktc-matrix th {
  padding: 10px 14px;
  background: var(--ktc-char);
  color: var(--ktc-milk);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  text-align: center;
}

.ktc-matrix td {
  padding: 10px 14px;
  font-size: 13px;
  text-align: center;
  border-bottom: 1px solid rgba(42,37,32,.06);
  color: var(--ktc-char);
}

.ktc-matrix tr:nth-child(even) td {
  background: var(--ktc-cream);
}

.ktc-matrix__name {
  text-align: left !important;
  font-weight: 600;
  color: var(--ktc-char);
}


/* ═══════════════════════════════════════════════
   11. SPACING & TOC OVERRIDE
   ═══════════════════════════════════════════════ */

/* Easy Table of Contents Override */
#ez-toc-container {
  background: var(--ktc-cream) !important;
  border: 1px solid rgba(42,37,32,.12) !important;
  border-radius: var(--ktc-radius-lg) !important;
  padding: 18px 22px !important;
}

#ez-toc-container .ez-toc-title {
  font-family: var(--ktc-font-display) !important;
  font-weight: 600 !important;
  color: var(--ktc-char) !important;
}

#ez-toc-container a {
  color: var(--ktc-honey) !important;
}

#ez-toc-container a:hover {
  text-decoration: underline !important;
}


/* ═══════════════════════════════════════════════
   RESPONSIVE — 768px (Tablet)
   ═══════════════════════════════════════════════ */

@media (max-width: 768px) {
  .ktc-facts-strip { flex-direction: column; }
  .ktc-facts-strip__item { border-right: none; border-bottom: 1px solid rgba(42,37,32,.08); }
  .ktc-facts-strip__item:last-child { border-bottom: none; }

  .ktc-attrs { grid-template-columns: repeat(2, 1fr); }
  .ktc-uses__grid { grid-template-columns: repeat(2, 1fr); }
  .ktc-pairing { grid-template-columns: 1fr; }
  .ktc-seasons { grid-template-columns: 1fr; }
  .ktc-numrow { flex-wrap: wrap; }
  .ktc-numrow__stat { min-width: calc(50% - 5px); }

  .ktc-proscons { flex-direction: column; }
  .ktc-proscons__col--cons { border-left: none; border-top: 1px solid rgba(42,37,32,.08); }

  .ktc-dodont { flex-direction: column; }
  .ktc-dodont__col + .ktc-dodont__col { border-left: none; border-top: 1px solid rgba(42,37,32,.08); }

  .ktc-radar__body { flex-direction: column; }
  .ktc-radar__chart-wrap { flex: none; }

  .ktc-subscribe { flex-direction: column; text-align: center; }
  .ktc-pin { flex-direction: column; text-align: center; gap: 12px; }
  .ktc-crosslink { flex-direction: column; text-align: center; gap: 12px; }
}


/* ═══════════════════════════════════════════════
   RESPONSIVE — 480px (Mobile)
   ═══════════════════════════════════════════════ */

@media (max-width: 480px) {
  .ktc-attrs { grid-template-columns: 1fr; }
  .ktc-uses__grid { grid-template-columns: 1fr; }
  .ktc-numrow__stat { min-width: 100%; }

  .ktc-pricebars__bar { grid-template-columns: 80px 1fr auto; }

  .ktc-compare th,
  .ktc-compare td { padding: 8px 10px; font-size: 12px; }

  .ktc-summary__picks { flex-direction: column; gap: 8px; }
  .ktc-verdict__picks { flex-direction: column; gap: 8px; }

  .ktc-related { flex-direction: column; text-align: center; }
  .ktc-related__icon-box { margin: 0 auto; }
}