/* ===========================================
   BakePastry Article Style Pro
   Version: 1.0.0
   Site: https://bakingpastryschools.com/
   Scoped to .bps-blog-wrap only
   Does NOT affect any other page or post
   Font-safe: inherits your theme/default font
   Designed for BakePastry baking articles:
   - Clean recipe and kitchen-guide readability
   - Warm caramel, cream, cinnamon, and neutral palette
   - Reusable blocks for recipes, baking methods, appliances, reviews, and tutorials
=========================================== */

/* ── BASE WRAPPER ── */
.bps-blog-wrap {
  margin: 0 auto;
  padding: 0 20px;
  line-height: 1.85;
  color: #1a1a1a;
  box-sizing: border-box;
}

.bps-blog-wrap *,
.bps-blog-wrap *::before,
.bps-blog-wrap *::after {
  box-sizing: border-box;
}

/* ── TYPOGRAPHY ── */
.bps-blog-wrap p { margin: 0 0 1.3em; }

.bps-blog-wrap h2 {
  font-size: 1.55em;
  font-weight: 700;
  margin: 2.2em 0 0.7em;
  color: #111;
  line-height: 1.3;
  border-bottom: 2px solid #ead3bd;
  padding-bottom: 0.3em;
}

.bps-blog-wrap h3 {
  font-size: 1.2em;
  font-weight: 700;
  margin: 1.8em 0 0.6em;
  color: #7c2d12;
  line-height: 1.35;
}

.bps-blog-wrap ul,
.bps-blog-wrap ol {
  margin: 0 0 1.3em 0;
  padding-left: 1.6em;
}

.bps-blog-wrap li   { margin-bottom: 0.6em; line-height: 1.8; }
.bps-blog-wrap strong { font-weight: 700; color: #111; }

.bps-blog-wrap a {
  color: #b45309;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.bps-blog-wrap a:hover { opacity: .8; }

.bps-blog-wrap section { margin-bottom: 0.4em; }


/* ================================================
   BOXES
================================================ */

/* ── Quick Answer Box ── */
.bps-quick-answer {
  background: #fff7ed;
  border-left: 6px solid #b45309;
  border-radius: 8px;
  padding: 20px 22px;
  margin: 0 0 2em;
}
.bps-qa-label {
  font-weight: 700;
  font-size: 0.78em;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: #b45309;
  margin-bottom: 10px;
  display: block;
}
.bps-quick-answer p { margin: 0; font-size: 1.05em; }

/* ── Expert Tip Box ── */
.bps-tip-box {
  background: #fff7ed;
  border-left: 6px solid #7c2d12;
  border-radius: 8px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-tip-label {
  display: block;
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #7c2d12;
  margin-bottom: 10px;
}
.bps-tip-box p { margin: 0; }

/* ── Note Box ── */
.bps-note-box {
  background: #fff7ed;
  border-left: 6px solid #d97706;
  border-radius: 8px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-note-label {
  display: block;
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #d97706;
  margin-bottom: 10px;
}
.bps-note-box p { margin: 0; }

/* ── Warning Box ── */
.bps-warning-box {
  background: #fff1f2;
  border-left: 6px solid #b91c1c;
  border-radius: 8px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-warn-label {
  display: block;
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #b91c1c;
  margin-bottom: 10px;
}
.bps-warning-box p { margin: 0; }

/* ── Takeaway Box ── */
.bps-takeaway-box {
  background: #fffbeb;
  border-left: 6px solid #92400e;
  border-radius: 8px;
  padding: 20px 22px;
  margin: 2.2em 0 1.8em;
}
.bps-takeaway-label {
  display: block;
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #92400e;
  margin-bottom: 10px;
}
.bps-takeaway-box p { margin: 0; }


/* ================================================
   COMPONENTS
================================================ */

/* ── Stat / Number Strip ── */
.bps-stat-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 1.8em 0;
}
.bps-stat-item {
  flex: 1;
  min-width: 140px;
  background: #fffbeb;
  border: 1px solid #e8c7a5;
  border-radius: 10px;
  padding: 18px 16px;
  text-align: center;
}
.bps-stat-number {
  font-size: 2em;
  font-weight: 800;
  color: #b45309;
  line-height: 1.1;
  display: block;
}
.bps-stat-desc {
  font-size: 0.82em;
  color: #555;
  margin-top: 6px;
  display: block;
}

/* ── Pro Tips List ── */
.bps-pro-tips {
  background: #fff7ed;
  border: 1px solid #e7c9b1;
  border-radius: 10px;
  padding: 20px 22px;
  margin: 1.8em 0;
}
.bps-pro-tips-title {
  font-weight: 700;
  font-size: 0.95em;
  color: #7c2d12;
  margin-bottom: 14px;
  display: block;
}
.bps-pro-tips ul {
  margin: 0;
  padding-left: 1.4em;
}
.bps-pro-tips li {
  margin-bottom: 10px;
  font-size: 0.97em;
  color: #1a1a1a;
  line-height: 1.8;
}

/* ── Comparison Box (Benefits vs Drawbacks) ── */
.bps-compare {
  display: flex;
  gap: 16px;
  margin: 1.8em 0;
  flex-wrap: wrap;
}
.bps-compare-col {
  flex: 1;
  min-width: 200px;
  border-radius: 10px;
  padding: 18px 20px;
}
.bps-compare-col.good {
  background: #fff7ed;
  border: 1px solid #d9a273;
}
.bps-compare-col.bad {
  background: #fff1f2;
  border: 1px solid #fecdd3;
}
.bps-compare-title {
  font-weight: 700;
  font-size: 0.88em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 12px;
  display: block;
}
.bps-compare-col.good .bps-compare-title { color: #78350f; }
.bps-compare-col.bad  .bps-compare-title { color: #991b1b; }
.bps-compare-col ul {
  margin: 0;
  padding-left: 1.2em;
}
.bps-compare-col li {
  font-size: 0.95em;
  margin-bottom: 8px;
  color: #1a1a1a;
  line-height: 1.7;
}

/* ── Checklist ── */
.bps-checklist {
  background: #fffaf5;
  border: 1px solid #e8c7a5;
  border-radius: 10px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-checklist-title {
  font-weight: 700;
  font-size: 0.97em;
  color: #111;
  margin-bottom: 14px;
  display: block;
}
.bps-checklist ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.bps-checklist li {
  padding: 8px 0 8px 32px;
  position: relative;
  font-size: 0.97em;
  border-bottom: 1px solid #f3dfca;
  color: #1a1a1a;
  margin: 0;
  line-height: 1.7;
}
.bps-checklist li:last-child { border-bottom: none; }
.bps-checklist li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 8px;
  color: #b45309;
  font-weight: 700;
  font-size: 1.1em;
}

/* ── Step-by-Step Guide ── */
.bps-steps {
  margin: 1.8em 0;
}
.bps-step {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  padding: 18px 0;
  border-bottom: 1px solid #f4e4d3;
}
.bps-step:last-child { border-bottom: none; }
.bps-step-num {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: #b45309;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-weight: 700;
}
.bps-step-body { flex: 1; }
.bps-step-body strong {
  font-size: 1.02em;
  color: #111;
  display: block;
  margin-bottom: 6px;
}
.bps-step-body p {
  font-size: 0.97em;
  color: #444;
  margin: 0;
  line-height: 1.8;
}

/* ── Did You Know Box ── */
.bps-did-you-know {
  background: #fff7ed;
  border: 1px solid #efd5a6;
  border-radius: 10px;
  padding: 18px 22px;
  margin: 1.8em 0;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.bps-dyk-icon {
  font-size: 1.8em;
  flex-shrink: 0;
  line-height: 1;
}
.bps-dyk-body { flex: 1; }
.bps-dyk-label {
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #8a4b08;
  display: block;
  margin-bottom: 8px;
}
.bps-dyk-body p { margin: 0; font-size: 0.97em; color: #1a1a1a; line-height: 1.8; }

/* ── Cost / Coverage Estimate Box ── */
.bps-cost-box {
  background: #fffaf5;
  border: 1px solid #e8c7a5;
  border-left: 6px solid #b45309;
  border-radius: 8px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-cost-label {
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #b45309;
  display: block;
  margin-bottom: 12px;
}
.bps-cost-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid #d0e8e0;
  font-size: 0.97em;
}
.bps-cost-row:last-child { border-bottom: none; }
.bps-cost-row span:last-child { font-weight: 700; color: #111; }

/* ── FAQ Section ── */
.bps-faq { margin: 1.8em 0; }
.bps-faq-item {
  border: 1px solid #ead3bd;
  border-radius: 10px;
  margin-bottom: 12px;
  overflow: hidden;
}
.bps-faq-q {
  background: #fffbeb;
  padding: 16px 20px;
  font-weight: 700;
  font-size: 1em;
  color: #111;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  user-select: none;
  line-height: 1.5;
}
.bps-faq-q::after {
  content: '+';
  font-size: 1.4em;
  color: #b45309;
  font-weight: 400;
  flex-shrink: 0;
  transition: transform .25s;
}
.bps-faq-item.open .bps-faq-q::after {
  transform: rotate(45deg);
}
.bps-faq-a {
  display: none;
  padding: 16px 20px;
  font-size: 0.97em;
  color: #333;
  border-top: 1px solid #ead3bd;
  background: #fff;
  line-height: 1.85;
}
.bps-faq-a p { margin: 0; }
.bps-faq-item.open .bps-faq-a { display: block; }

/* ── Resources / Tools Needed ── */
.bps-tools-box {
  background: #fffaf5;
  border: 1px solid #e8c7a5;
  border-radius: 10px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-tools-title {
  font-weight: 700;
  font-size: 0.97em;
  color: #111;
  margin-bottom: 14px;
  display: block;
}
.bps-tools-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.bps-tool-tag {
  background: #fff;
  border: 1px solid #d9a273;
  border-radius: 20px;
  padding: 6px 16px;
  font-size: 0.88em;
  color: #7c2d12;
  white-space: nowrap;
}

/* ── Highlight / Key Stat Box ── */
.bps-highlight {
  background: linear-gradient(135deg, #fff7ed 0%, #fffbeb 100%);
  border: 1px solid #d9a273;
  border-radius: 10px;
  padding: 22px 26px;
  margin: 1.8em 0;
  text-align: center;
}
.bps-highlight-text {
  font-size: 1.2em;
  font-weight: 700;
  color: #b45309;
  line-height: 1.45;
  display: block;
}
.bps-highlight-sub {
  font-size: 0.87em;
  color: #555;
  margin-top: 8px;
  display: block;
}

/* ── Kitchen Safety Alert Box ── */
.bps-alert-box {
  background: #fff1f2;
  border: 1px solid #fecdd3;
  border-radius: 10px;
  padding: 18px 22px;
  margin: 1.8em 0;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.bps-alert-icon { font-size: 2em; flex-shrink: 0; line-height: 1; }
.bps-alert-body { flex: 1; }
.bps-alert-label {
  font-weight: 700;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: #991b1b;
  display: block;
  margin-bottom: 8px;
}
.bps-alert-body p { margin: 0; font-size: 0.97em; color: #1a1a1a; line-height: 1.8; }

/* ── Summary / Recap Box ── */
.bps-summary-box {
  background: #fffbeb;
  border: 1px solid #d7a77b;
  border-radius: 10px;
  padding: 20px 22px;
  margin: 1.8em 0;
}
.bps-summary-label {
  font-weight: 700;
  font-size: 0.8em;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #78350f;
  display: block;
  margin-bottom: 12px;
}
.bps-summary-box ul {
  margin: 0;
  padding-left: 1.4em;
}
.bps-summary-box li {
  font-size: 0.97em;
  margin-bottom: 8px;
  color: #1a1a1a;
  line-height: 1.8;
}

/* ── Dos and Don'ts ── */
.bps-dos-donts {
  display: flex;
  gap: 16px;
  margin: 1.8em 0;
  flex-wrap: wrap;
}
.bps-dos, .bps-donts {
  flex: 1;
  min-width: 200px;
  border-radius: 10px;
  padding: 18px 20px;
}
.bps-dos {
  background: #fff7ed;
  border: 1px solid #d9a273;
}
.bps-donts {
  background: #fff1f2;
  border: 1px solid #fecdd3;
}
.bps-dos-title, .bps-donts-title {
  font-weight: 700;
  font-size: 0.88em;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 12px;
  display: block;
}
.bps-dos-title   { color: #78350f; }
.bps-donts-title { color: #991b1b; }
.bps-dos ul, .bps-donts ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.bps-dos li, .bps-donts li {
  padding: 6px 0 6px 26px;
  position: relative;
  font-size: 0.95em;
  color: #1a1a1a;
  margin: 0;
  border-bottom: 1px solid rgba(0,0,0,.05);
  line-height: 1.7;
}
.bps-dos li:last-child,
.bps-donts li:last-child { border-bottom: none; }
.bps-dos li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: #b45309;
  font-weight: 700;
}
.bps-donts li::before {
  content: '✗';
  position: absolute;
  left: 0;
  color: #b91c1c;
  font-weight: 700;
}

/* ── Expert Quote / Testimonial ── */
.bps-expert-quote {
  background: #fffbeb;
  border: 1px solid #e4bea0;
  border-radius: 10px;
  padding: 20px 22px;
  margin: 1.8em 0;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}
.bps-expert-icon { font-size: 2em; flex-shrink: 0; line-height: 1; color: #92400e; }
.bps-expert-body { flex: 1; }
.bps-expert-text {
  font-size: 1em;
  font-style: italic;
  color: #333;
  line-height: 1.85;
  margin: 0 0 10px;
  display: block;
}
.bps-expert-name {
  font-size: 0.85em;
  font-weight: 700;
  color: #92400e;
}

/* ── Benefits Box ── */
.bps-benefits-box {
  background: #fff7ed;
  border: 1px solid #d9a273;
  border-radius: 10px;
  padding: 18px 22px;
  margin: 1.8em 0;
}
.bps-benefits-title {
  font-weight: 700;
  font-size: 0.97em;
  color: #78350f;
  margin-bottom: 14px;
  display: block;
}
.bps-benefits-box ul {
  margin: 0;
  padding-left: 1.4em;
}
.bps-benefits-box li {
  font-size: 0.97em;
  margin-bottom: 10px;
  color: #1a1a1a;
  line-height: 1.8;
}

/* ── Image Placeholder ── */
.bps-img-placeholder {
  background: #fffbeb;
  border: 2px dashed #e8c7a5;
  border-radius: 10px;
  padding: 32px 20px;
  margin: 1.8em 0;
  text-align: center;
  color: #6b7280;
  font-size: 0.9em;
}
.bps-img-placeholder span {
  display: block;
  font-size: 2em;
  margin-bottom: 8px;
}


/* ================================================
   TABLES
================================================ */
.bps-table-wrap {
  width: 100%;
  overflow-x: auto;
  margin: 1.6em 0 2em;
  -webkit-overflow-scrolling: touch;
  border-radius: 8px;
}
.bps-blog-wrap table {
  width: 100%;
  min-width: 480px;
  border-collapse: collapse;
  font-size: 0.95em;
  background: #fff;
  border: 1px solid #e8c7a5;
  border-radius: 8px;
  overflow: hidden;
}
.bps-blog-wrap thead { color: #fff; background: #b45309; }
.bps-blog-wrap th {
  text-align: left;
  padding: 14px 16px;
  font-weight: 700;
  font-size: 0.9em;
  letter-spacing: 0.02em;
}
.bps-blog-wrap td {
  padding: 13px 16px;
  border-top: 1px solid #ead3bd;
  vertical-align: top;
  color: #1a1a1a;
  line-height: 1.7;
}
.bps-blog-wrap tbody tr:nth-child(even) td { background: #fffbeb; }
.bps-blog-wrap tbody tr:hover td { background: #f7e7d4; }


/* ================================================
   MOBILE
================================================ */
@media (max-width: 640px) {
  .bps-blog-wrap      { padding: 0 14px; }
  .bps-blog-wrap h2   { font-size: 1.3em; }
  .bps-blog-wrap h3   { font-size: 1.1em; }

  .bps-quick-answer,
  .bps-tip-box,
  .bps-note-box,
  .bps-warning-box,
  .bps-takeaway-box,
  .bps-pro-tips,
  .bps-checklist,
  .bps-tools-box,
  .bps-cost-box,
  .bps-summary-box,
  .bps-benefits-box   { padding: 16px 16px; }

  .bps-compare,
  .bps-dos-donts      { flex-direction: column; }

  .bps-stat-strip     { gap: 10px; }
  .bps-stat-item      { min-width: 110px; }
  .bps-stat-number    { font-size: 1.6em; }

  .bps-did-you-know,
  .bps-alert-box,
  .bps-expert-quote   { flex-direction: column; gap: 10px; }

  .bps-highlight-text { font-size: 1em; }
}


/* ================================================
   BAKEPASTRY KITCHEN-SPECIFIC COMPONENT BLOCK
   Use these inside .bps-blog-wrap for the 10,000-post baking plan:
   recipe ideas, doneness guides, seasonal baking, kitchen questions,
   product reviews, preparation timelines, troubleshooting, and tutorials.
================================================ */
.bps-blog-wrap {
  --bps-brand: var(--bps-accent, #b45309);
  --bps-cream: #fff7ed;
  --bps-wheat: #f7e7d4;
  --bps-cinnamon: var(--bps-tip, #7c2d12);
  --bps-chocolate: #7c2d12;
  --bps-gold: var(--bps-note, #d97706);
  --bps-red: var(--bps-warning, #b91c1c);
  --bps-border: #ead3bd;
  --bps-text-soft: #68574d;
}

.bps-kitchen-hero {
  background: linear-gradient(135deg, #fff7ed 0%, #fff 52%, #fff7ed 100%);
  border: 1px solid var(--bps-border);
  border-left: 6px solid var(--bps-brand);
  border-radius: 18px;
  padding: 26px 28px;
  margin: 0 0 2em;
  box-shadow: 0 14px 34px rgba(180, 83, 9, .08);
}
.bps-kitchen-hero h2 {
  border-bottom: none;
  padding-bottom: 0;
  margin: .25em 0 .45em;
  color: #3c2a20;
}
.bps-kitchen-hero p { color: #68574d; margin: 0; }
.bps-kitchen-kicker,
.bps-kitchen-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--bps-brand);
  font-size: .76em;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.bps-kitchen-pill {
  display: inline-block;
  background: var(--bps-brand);
  color: #fff;
  border-radius: 999px;
  padding: 4px 12px;
  font-size: .76em;
  font-weight: 700;
}

.bps-recipe-idea-grid,
.bps-baking-method-grid,
.bps-palette-grid,
.bps-result-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 1.8em 0;
}
.bps-recipe-card,
.bps-method-card,
.bps-color-swatch-card,
.bps-result-chip,
.bps-product-card,
.bps-kitchen-qa-card {
  background: #fff;
  border: 1px solid var(--bps-border);
  border-radius: 14px;
  padding: 18px 18px;
  box-shadow: 0 8px 24px rgba(124, 45, 18, .06);
}
.bps-recipe-card-title,
.bps-method-card span,
.bps-palette-title,
.bps-link-cluster-title {
  display: block;
  color: var(--bps-brand);
  font-weight: 800;
  font-size: .95em;
  margin-bottom: 8px;
}
.bps-recipe-card p,
.bps-method-card p,
.bps-color-swatch-card small,
.bps-result-chip span,
.bps-kitchen-qa-card p,
.bps-product-card p { color: var(--bps-text-soft); margin: 0; line-height: 1.7; }

.bps-flavor-palette {
  background: linear-gradient(135deg, #fffaf5, #ffffff);
  border: 1px solid var(--bps-border);
  border-radius: 16px;
  padding: 20px;
  margin: 1.8em 0;
}
.bps-color-swatch-card {
  display: grid;
  grid-template-columns: 42px 1fr;
  column-gap: 12px;
  align-items: center;
}
.bps-color-swatch-card strong { display: block; color: #2f2119; font-size: .95em; }
.bps-color-swatch-card small { display: block; grid-column: 2; font-size: .82em; }
.bps-color-dot {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--bake-color, #d9a066);
  border: 2px solid #fff;
  box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 8px 18px rgba(0,0,0,.08);
  grid-row: span 2;
}

.bps-kitchen-qa-card {
  background: linear-gradient(135deg, #fffbeb, #fff);
  border-left: 6px solid var(--bps-brand);
  margin: 1.8em 0;
}
.bps-kitchen-question {
  font-size: 1.12em;
  font-weight: 800;
  color: var(--bps-brand);
  margin: 8px 0 10px !important;
  line-height: 1.45;
}

.bps-baking-timeline {
  background: #fff;
  border: 1px solid var(--bps-border);
  border-radius: 14px;
  padding: 18px 20px;
  margin: 1.8em 0;
}
.bps-timeline-row {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 14px;
  padding: 13px 0;
  border-bottom: 1px solid #f3dfca;
}
.bps-timeline-row:last-child { border-bottom: none; }
.bps-timeline-row span {
  color: var(--bps-brand);
  font-weight: 800;
}
.bps-timeline-row p { margin: 0; color: var(--bps-text-soft); }

.bps-baking-problem {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 1.8em 0;
}
.bps-baking-problem > div {
  border-radius: 14px;
  padding: 18px;
}
.bps-baking-problem > div:first-child { background: #fff1f2; border: 1px solid #fecdd3; }
.bps-baking-problem > div:last-child { background: #fffbeb; border: 1px solid var(--bps-border); }
.bps-problem-label,
.bps-fix-label {
  display: block;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: .78em;
  margin-bottom: 8px;
}
.bps-problem-label { color: var(--bps-red); }
.bps-fix-label { color: var(--bps-brand); }
.bps-baking-problem p { margin: 0; color: #44352d; }

.bps-product-card {
  border-left: 6px solid var(--bps-brand);
  margin: 1.8em 0;
}
.bps-product-card h3 { margin-top: .4em; }
.bps-product-meta {
  display: inline-block;
  color: var(--bps-brand);
  font-weight: 800;
  margin-top: 12px;
}

.bps-kitchen-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 1.4em 0 1.8em;
}
.bps-kitchen-tag {
  border: 1px solid var(--bps-border);
  background: #fffbeb;
  color: var(--bps-brand);
  border-radius: 999px;
  padding: 7px 14px;
  font-size: .86em;
  font-weight: 700;
}

.bps-result-chip strong {
  display: inline-block;
  background: var(--bps-brand);
  color: #fff;
  border-radius: 999px;
  padding: 4px 10px;
  margin-bottom: 9px;
  font-size: .8em;
}
.bps-result-chip span { display: block; }

.bps-kitchen-link-cluster {
  background: #fffbeb;
  border: 1px solid var(--bps-border);
  border-radius: 14px;
  padding: 18px 20px;
  margin: 1.8em 0;
}
.bps-kitchen-link-cluster a {
  display: block;
  padding: 10px 0;
  border-top: 1px solid #f3dfca;
  font-weight: 700;
  text-decoration: none;
}
.bps-kitchen-link-cluster a:hover { text-decoration: underline; }

.bps-process-map {
  background: #fff;
  border: 1px solid var(--bps-border);
  border-radius: 16px;
  padding: 20px;
  margin: 1.8em 0;
}
.bps-process-map-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.bps-process-map-card {
  position: relative;
  padding: 14px 14px 14px 20px;
  background: #fffaf5;
  border-radius: 12px;
  overflow: hidden;
}
.bps-process-map-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--bps-brand);
}
.bps-process-map-card strong { display: block; color: #2f2119; margin-bottom: 4px; }
.bps-process-map-card span { color: var(--bps-text-soft); font-size: .9em; }

@media (max-width: 760px) {
  .bps-recipe-idea-grid,
  .bps-baking-method-grid,
  .bps-palette-grid,
  .bps-result-grid,
  .bps-process-map-grid { grid-template-columns: 1fr; }
  .bps-baking-problem { grid-template-columns: 1fr; }
  .bps-timeline-row { grid-template-columns: 1fr; gap: 4px; }
  .bps-color-swatch-card { grid-template-columns: 36px 1fr; }
  .bps-color-dot { width: 34px; height: 34px; }
}


/* ============================================================
   BakePastry compatibility fixes: image cards + flat problem/fix markup
   These rules are intentionally strong because some themes/plugins
   override grid, p, image, and label styles.
============================================================ */

.bps-blog-wrap .bps-article-image {
  display: block !important;
  margin: 24px 0 32px !important;
  padding: 0 !important;
  text-align: center !important;
  background: transparent !important;
}

.bps-blog-wrap .bps-image-frame {
  display: block !important;
  background: #ffffff !important;
  border: 1px solid #ecd2b8 !important;
  border-radius: 18px !important;
  padding: 10px !important;
  box-shadow: 0 12px 32px rgba(180, 83, 9, 0.10) !important;
  overflow: hidden !important;
}

.bps-blog-wrap .bps-article-image img,
.bps-blog-wrap .bps-image-frame img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  object-fit: cover !important;
}

.bps-blog-wrap .bps-image-caption {
  display: block !important;
  max-width: 760px !important;
  margin: 10px auto 0 !important;
  padding: 0 8px !important;
  color: #8a5d45 !important;
  font-size: 0.92em !important;
  font-style: italic !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

.bps-blog-wrap .bps-image-source {
  display: block !important;
  margin: 6px auto 0 !important;
  color: #8a6a58 !important;
  font-size: 0.78em !important;
  line-height: 1.4 !important;
  text-align: center !important;
}

/* Supports both correct nested markup and AI-generated flat markup:
   Nested: <div class="bps-baking-problem"><div><span...>Problem</span><p>...</p></div>...</div>
   Flat:   <div class="bps-baking-problem"><span...>Problem</span><p>...</p><span...>Fix</span><p>...</p></div>
*/
.bps-blog-wrap .bps-baking-problem {
  display: block !important;
  width: 100% !important;
  margin: 24px 0 !important;
  padding: 18px !important;
  background: linear-gradient(135deg, #fffaf5 0%, #ffffff 100%) !important;
  border: 1px solid #ecd2b8 !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 28px rgba(180, 83, 9, 0.08) !important;
}

.bps-blog-wrap .bps-baking-problem > div {
  display: block !important;
  margin: 0 0 14px !important;
  padding: 15px 16px !important;
  border-radius: 14px !important;
}

.bps-blog-wrap .bps-baking-problem > div:first-child {
  background: #fff1f2 !important;
  border: 1px solid #fecdd3 !important;
}

.bps-blog-wrap .bps-baking-problem > div:last-child {
  margin-bottom: 0 !important;
  background: #fffbeb !important;
  border: 1px solid #ecd2b8 !important;
}

.bps-blog-wrap .bps-baking-problem > .bps-problem-label,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label,
.bps-blog-wrap .bps-baking-problem .bps-problem-label,
.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: auto !important;
  margin: 0 0 8px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  font-size: 0.76em !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}

.bps-blog-wrap .bps-baking-problem .bps-problem-label {
  color: #b91c1c !important;
  background: #ffe4e6 !important;
}

.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  color: #92400e !important;
  background: #f7e7d4 !important;
}

.bps-blog-wrap .bps-baking-problem > .bps-problem-label + p,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p {
  display: block !important;
  margin: 0 0 14px !important;
  padding: 14px 16px !important;
  border-radius: 14px !important;
  color: #44352d !important;
  line-height: 1.75 !important;
}

.bps-blog-wrap .bps-baking-problem > .bps-problem-label + p {
  background: #fff1f2 !important;
  border: 1px solid #fecdd3 !important;
}

.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p {
  margin-bottom: 0 !important;
  background: #fffbeb !important;
  border: 1px solid #ecd2b8 !important;
}

.bps-blog-wrap .bps-baking-problem > div p {
  margin: 0 !important;
  color: #44352d !important;
  line-height: 1.75 !important;
}

@media (max-width: 640px) {
  .bps-blog-wrap .bps-baking-problem {
    padding: 14px !important;
    border-radius: 16px !important;
  }
  .bps-blog-wrap .bps-image-frame {
    padding: 7px !important;
    border-radius: 15px !important;
  }
  .bps-blog-wrap .bps-article-image img,
  .bps-blog-wrap .bps-image-frame img {
    border-radius: 10px !important;
  }
}


/* ===========================================
   BakePastry v1.3 Problem/Fix Block Polish
   Cleaner layout for flat AI markup and nested markup.
   Removes the empty rounded bar issue caused by blank paragraphs.
=========================================== */
.bps-blog-wrap .bps-baking-problem {
  display: block !important;
  width: 100% !important;
  margin: 28px 0 !important;
  padding: 22px 24px !important;
  background: #fffaf5 !important;
  border: 1px solid #dfb890 !important;
  border-left: 5px solid #b45309 !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 30px rgba(180, 83, 9, 0.07) !important;
}

.bps-blog-wrap .bps-baking-problem::before {
  display: none !important;
  content: none !important;
}

.bps-blog-wrap .bps-baking-problem > div {
  display: block !important;
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px dashed #ddb28e !important;
  border-radius: 0 !important;
}

.bps-blog-wrap .bps-baking-problem > div:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
  background: transparent !important;
}

.bps-blog-wrap .bps-baking-problem .bps-problem-label,
.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: max-content !important;
  margin: 0 0 8px !important;
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 0.74em !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

.bps-blog-wrap .bps-baking-problem .bps-problem-label {
  color: #b91c1c !important;
  background: #ffe4e6 !important;
}

.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  color: #92400e !important;
  background: #f7e7d4 !important;
}

.bps-blog-wrap .bps-baking-problem > p,
.bps-blog-wrap .bps-baking-problem > .bps-problem-label + p,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p,
.bps-blog-wrap .bps-baking-problem > div p {
  display: block !important;
  margin: 0 0 18px !important;
  padding: 0 0 18px !important;
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px dashed #ddb28e !important;
  border-radius: 0 !important;
  color: #33261f !important;
  font-size: 1em !important;
  line-height: 1.8 !important;
}

.bps-blog-wrap .bps-baking-problem > p:empty,
.bps-blog-wrap .bps-baking-problem > p:has(br:only-child),
.bps-blog-wrap .bps-baking-problem > div p:empty,
.bps-blog-wrap .bps-baking-problem > div p:has(br:only-child) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  line-height: 0 !important;
}

.bps-blog-wrap .bps-baking-problem > p:last-child,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p,
.bps-blog-wrap .bps-baking-problem > div:last-child p:last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

@media (max-width: 640px) {
  .bps-blog-wrap .bps-baking-problem {
    padding: 18px 18px !important;
    border-radius: 16px !important;
  }
}


/* ============================================================
   BakePastry v1.4 Full Component Stability Fix
   Purpose: make every generated info-article block look clean even
   when AI outputs simple/flat HTML. These rules intentionally load
   late and are scoped to BakePastry article wrappers only.
============================================================ */

.bps-blog-wrap {
  --bps-bg: #fffaf5;
  --bps-card: #ffffff;
  --bps-border-strong: #dfad82;
  --bps-border-soft: #efd4bb;
  --bps-muted: #6b5548;
  --bps-text: #2c211b;
  --bps-shadow: 0 12px 30px rgba(180, 83, 9, .075);
}

.bps-blog-wrap p:empty,
.bps-blog-wrap li:empty,
.bps-blog-wrap span:empty {
  display: none !important;
}

.bps-blog-wrap .bps-quick-answer,
.bps-blog-wrap .bps-tip-box,
.bps-blog-wrap .bps-note-box,
.bps-blog-wrap .bps-warning-box,
.bps-blog-wrap .bps-takeaway-box,
.bps-blog-wrap .bps-checklist,
.bps-blog-wrap .bps-tools-box,
.bps-blog-wrap .bps-cost-box,
.bps-blog-wrap .bps-summary-box,
.bps-blog-wrap .bps-benefits-box,
.bps-blog-wrap .bps-kitchen-qa-card,
.bps-blog-wrap .bps-flavor-palette,
.bps-blog-wrap .bps-process-map,
.bps-blog-wrap .bps-baking-timeline,
.bps-blog-wrap .bps-baking-problem {
  max-width: 100% !important;
  box-sizing: border-box !important;
}

.bps-blog-wrap .bps-quick-answer p:last-child,
.bps-blog-wrap .bps-tip-box p:last-child,
.bps-blog-wrap .bps-note-box p:last-child,
.bps-blog-wrap .bps-warning-box p:last-child,
.bps-blog-wrap .bps-takeaway-box p:last-child,
.bps-blog-wrap .bps-summary-box p:last-child,
.bps-blog-wrap .bps-benefits-box p:last-child {
  margin-bottom: 0 !important;
}

/* Clean routine block: label on top, text below, no awkward two-column table look. */
.bps-blog-wrap .bps-baking-timeline {
  display: block !important;
  width: 100% !important;
  margin: 28px 0 !important;
  padding: 20px !important;
  background: linear-gradient(135deg, #fffaf5 0%, #fff 100%) !important;
  border: 1px solid var(--bps-border-strong) !important;
  border-left: 5px solid var(--bps-brand, #b45309) !important;
  border-radius: 18px !important;
  box-shadow: var(--bps-shadow) !important;
}

.bps-blog-wrap .bps-timeline-row,
.bps-blog-wrap .bps-baking-timeline > div {
  display: block !important;
  grid-template-columns: none !important;
  width: 100% !important;
  margin: 0 0 14px !important;
  padding: 16px 18px !important;
  background: #fff !important;
  border: 1px solid var(--bps-border-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 20px rgba(180, 83, 9, .045) !important;
}

.bps-blog-wrap .bps-timeline-row:last-child,
.bps-blog-wrap .bps-baking-timeline > div:last-child {
  margin-bottom: 0 !important;
}

.bps-blog-wrap .bps-timeline-row strong,
.bps-blog-wrap .bps-timeline-row > span:first-child,
.bps-blog-wrap .bps-baking-timeline > div > strong:first-child,
.bps-blog-wrap .bps-baking-timeline > div > span:first-child {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 0 9px !important;
  padding: 5px 11px !important;
  color: #92400e !important;
  background: #f7e7d4 !important;
  border-radius: 999px !important;
  font-size: .78em !important;
  font-weight: 800 !important;
  letter-spacing: .03em !important;
  line-height: 1.25 !important;
}

.bps-blog-wrap .bps-timeline-row p,
.bps-blog-wrap .bps-baking-timeline > div p {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--bps-text) !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 1em !important;
  line-height: 1.8 !important;
}

/* Clean Problem/Fix block: consistent with routine but with red/caramel labels. */
.bps-blog-wrap .bps-baking-problem {
  display: block !important;
  width: 100% !important;
  margin: 28px 0 !important;
  padding: 20px !important;
  background: linear-gradient(135deg, #fffaf5 0%, #fff 100%) !important;
  border: 1px solid var(--bps-border-strong) !important;
  border-left: 5px solid var(--bps-brand, #b45309) !important;
  border-radius: 18px !important;
  box-shadow: var(--bps-shadow) !important;
}

.bps-blog-wrap .bps-baking-problem > div {
  display: block !important;
  width: 100% !important;
  margin: 0 0 14px !important;
  padding: 16px 18px !important;
  background: #fff !important;
  border: 1px solid var(--bps-border-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 20px rgba(180, 83, 9, .045) !important;
}

.bps-blog-wrap .bps-baking-problem > div:last-child {
  margin-bottom: 0 !important;
}

.bps-blog-wrap .bps-baking-problem .bps-problem-label,
.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  max-width: max-content !important;
  margin: 0 0 9px !important;
  padding: 5px 11px !important;
  border-radius: 999px !important;
  font-size: .76em !important;
  font-weight: 800 !important;
  letter-spacing: .07em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}

.bps-blog-wrap .bps-baking-problem .bps-problem-label {
  color: #b91c1c !important;
  background: #ffe4e6 !important;
}

.bps-blog-wrap .bps-baking-problem .bps-fix-label {
  color: #92400e !important;
  background: #f7e7d4 !important;
}

.bps-blog-wrap .bps-baking-problem > p,
.bps-blog-wrap .bps-baking-problem > .bps-problem-label + p,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p,
.bps-blog-wrap .bps-baking-problem > div p {
  display: block !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--bps-text) !important;
  font-size: 1em !important;
  line-height: 1.8 !important;
}

.bps-blog-wrap .bps-baking-problem > p:last-child,
.bps-blog-wrap .bps-baking-problem > .bps-fix-label + p,
.bps-blog-wrap .bps-baking-problem > div:last-child p:last-child {
  margin-bottom: 0 !important;
}

/* Better cost/time rows. */
.bps-blog-wrap .bps-cost-row {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 12px 0 !important;
  border-bottom: 1px solid var(--bps-border-soft) !important;
  color: var(--bps-text) !important;
}

.bps-blog-wrap .bps-cost-row span:first-child {
  color: var(--bps-muted) !important;
}

.bps-blog-wrap .bps-cost-row span:last-child {
  justify-self: end !important;
  color: #92400e !important;
  font-weight: 800 !important;
}

/* Stronger tools/chip layout. */
.bps-blog-wrap .bps-tools-grid,
.bps-blog-wrap .bps-kitchen-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.bps-blog-wrap .bps-tool-tag,
.bps-blog-wrap .bps-kitchen-tag {
  display: inline-flex !important;
  align-items: center !important;
  width: auto !important;
  margin: 0 !important;
  padding: 7px 13px !important;
  background: #fff !important;
  border: 1px solid var(--bps-border-strong) !important;
  border-radius: 999px !important;
  color: #92400e !important;
  font-size: .88em !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

/* Better steps cards. */
.bps-blog-wrap .bps-steps {
  display: grid !important;
  gap: 12px !important;
  margin: 26px 0 !important;
}

.bps-blog-wrap .bps-step {
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: start !important;
  padding: 16px !important;
  background: #fff !important;
  border: 1px solid var(--bps-border-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 20px rgba(180, 83, 9, .045) !important;
}

.bps-blog-wrap .bps-step-body p:last-child {
  margin-bottom: 0 !important;
}

/* Better grid cards. */
.bps-blog-wrap .bps-recipe-card,
.bps-blog-wrap .bps-method-card,
.bps-blog-wrap .bps-color-swatch-card,
.bps-blog-wrap .bps-result-chip,
.bps-blog-wrap .bps-process-map-card {
  background: #fff !important;
  border: 1px solid var(--bps-border-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 20px rgba(180, 83, 9, .045) !important;
}

/* FAQ section fallback if heading wrapper exists. */
.bps-blog-wrap .bps-faq-section {
  margin: 32px 0 0 !important;
}

.bps-blog-wrap .bps-faq-item {
  background: #fff !important;
  border: 1px solid var(--bps-border-soft) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 20px rgba(180, 83, 9, .04) !important;
}

/* Image block. */
.bps-blog-wrap .bps-article-image {
  margin: 24px 0 32px !important;
}

.bps-blog-wrap .bps-image-caption {
  margin-top: 10px !important;
  color: #8a5d45 !important;
  font-size: .92em !important;
  font-style: italic !important;
  text-align: center !important;
}

@media (max-width: 640px) {
  .bps-blog-wrap .bps-baking-timeline,
  .bps-blog-wrap .bps-baking-problem {
    padding: 16px !important;
    border-radius: 16px !important;
  }

  .bps-blog-wrap .bps-timeline-row,
  .bps-blog-wrap .bps-baking-timeline > div,
  .bps-blog-wrap .bps-baking-problem > div,
  .bps-blog-wrap .bps-step {
    padding: 14px !important;
  }

  .bps-blog-wrap .bps-cost-row {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }

  .bps-blog-wrap .bps-cost-row span:last-child {
    justify-self: start !important;
  }
}


/* ================================================
   BAKEPASTRY COMPARISON ARTICLE BLOCKS
   Use for product-free informational comparisons:
   air fryer vs oven, stainless steel vs nonstick, hand mixer vs stand mixer,
   glass vs metal bakeware, convection vs conventional cooking, etc.
================================================ */

.bps-blog-wrap .bps-comparison-hero {
  margin: 1.8em 0 2.1em;
  padding: 22px 24px;
  background:
    radial-gradient(circle at top left, rgba(180, 83, 9, 0.14), transparent 34%),
    linear-gradient(135deg, #fffaf5 0%, #ffffff 62%, #fff8ef 100%);
  border: 1px solid #e8c7a5;
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(146, 64, 14, 0.08);
}
.bps-blog-wrap .bps-comparison-kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  padding: 5px 10px;
  border-radius: 999px;
  background: #fff7ed;
  color: #92400e;
  font-size: .74em;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-comparison-title {
  display: block;
  margin: 0 0 8px;
  font-size: 1.35em;
  line-height: 1.28;
  font-weight: 800;
  color: #111;
}
.bps-blog-wrap .bps-comparison-hero p { margin: 0; color: #333; }

.bps-blog-wrap .bps-vs-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 14px;
  align-items: stretch;
  margin: 1.8em 0;
}
.bps-blog-wrap .bps-vs-card {
  position: relative;
  min-width: 0;
  background: #fff;
  border: 1px solid #e8c7a5;
  border-radius: 16px;
  padding: 18px 18px 16px;
  box-shadow: 0 12px 30px rgba(146, 64, 14, .07);
}
.bps-blog-wrap .bps-vs-label {
  display: inline-block;
  margin: 0 0 8px;
  padding: 4px 9px;
  background: #fff7ed;
  border-radius: 999px;
  color: #92400e;
  font-size: .72em;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-vs-card h3 {
  margin: 0 0 8px;
  color: #111;
  font-size: 1.12em;
  border: 0;
  padding: 0;
}
.bps-blog-wrap .bps-vs-card p { margin: 0; color: #444; line-height: 1.65; }
.bps-blog-wrap .bps-versus-badge {
  align-self: center;
  justify-self: center;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #b45309;
  color: #fff;
  font-size: .82em;
  font-weight: 900;
  letter-spacing: .08em;
  box-shadow: 0 10px 22px rgba(180, 83, 9, .25);
}

.bps-blog-wrap .bps-verdict-box,
.bps-blog-wrap .bps-final-verdict {
  margin: 1.9em 0;
  padding: 20px 22px;
  background: linear-gradient(135deg, #fff7ed 0%, #ffffff 100%);
  border: 1px solid #e8c7a5;
  border-left: 6px solid #b45309;
  border-radius: 14px;
  box-shadow: 0 14px 32px rgba(146, 64, 14, .07);
}
.bps-blog-wrap .bps-verdict-label,
.bps-blog-wrap .bps-final-verdict-label {
  display: block;
  margin: 0 0 8px;
  color: #92400e;
  font-size: .78em;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-verdict-box p,
.bps-blog-wrap .bps-final-verdict p { margin: 0; }

.bps-blog-wrap .bps-best-for-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 1.8em 0;
}
.bps-blog-wrap .bps-best-for-card {
  background: #fff;
  border: 1px solid #e8c7a5;
  border-radius: 14px;
  padding: 17px 18px;
  box-shadow: 0 10px 26px rgba(146, 64, 14, .06);
}
.bps-blog-wrap .bps-best-for-label {
  display: block;
  margin: 0 0 7px;
  color: #92400e;
  font-size: .76em;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-best-for-card strong {
  display: block;
  margin: 0 0 6px;
  color: #111;
  font-size: 1.03em;
}
.bps-blog-wrap .bps-best-for-card p { margin: 0; color: #444; }

.bps-blog-wrap .bps-decision-box {
  margin: 1.8em 0;
  background: #fffaf5;
  border: 1px solid #e8c7a5;
  border-radius: 16px;
  padding: 18px 20px;
}
.bps-blog-wrap .bps-decision-label {
  display: block;
  margin: 0 0 12px;
  color: #92400e;
  font-size: .8em;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-decision-row {
  display: grid;
  grid-template-columns: 170px 1fr;
  gap: 14px;
  align-items: start;
  padding: 12px 0;
  border-top: 1px solid #f3dfca;
}
.bps-blog-wrap .bps-decision-row:first-of-type { border-top: 0; padding-top: 0; }
.bps-blog-wrap .bps-decision-row strong { color: #111; }
.bps-blog-wrap .bps-decision-row p { margin: 0; color: #444; }

.bps-blog-wrap .bps-score-row {
  margin: 1.5em 0;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid #ead3bd;
  border-radius: 14px;
}
.bps-blog-wrap .bps-score-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.bps-blog-wrap .bps-score-label {
  color: #92400e;
  font-size: .78em;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}
.bps-blog-wrap .bps-score-note {
  color: #666;
  font-size: .82em;
}
.bps-blog-wrap .bps-score-bar {
  height: 10px;
  overflow: hidden;
  background: #f4e4d3;
  border-radius: 999px;
}
.bps-blog-wrap .bps-score-fill {
  display: block;
  height: 100%;
  width: 50%;
  background: #b45309;
  border-radius: inherit;
}

.bps-blog-wrap .bps-comparison-note {
  margin: 1.6em 0;
  padding: 15px 18px;
  background: #fff;
  border: 1px dashed #d59b71;
  border-radius: 12px;
  color: #444;
  font-size: .96em;
}
.bps-blog-wrap .bps-comparison-note p { margin: 0; }

@media (max-width: 760px) {
  .bps-blog-wrap .bps-vs-cards {
    grid-template-columns: 1fr;
  }
  .bps-blog-wrap .bps-versus-badge {
    width: 40px;
    height: 40px;
    transform: none;
  }
  .bps-blog-wrap .bps-best-for-grid {
    grid-template-columns: 1fr;
  }
  .bps-blog-wrap .bps-decision-row {
    grid-template-columns: 1fr;
    gap: 5px;
  }
}