/*
 Theme Name:  Kadence Child — DwellWellGuide
 Theme URI:   https://dwellwellguide.com
 Description: Child theme for DwellWellGuide.com — Home Improvement & Decor blog.
              Covers: Article pages, Review pages, Homepage, Archive pages,
              Sidebar, Navigation, Footer, and all plugin overrides.
 Author:      DwellWellGuide
 Template:    kadence
 Version:     1.0.0
 License:     GNU General Public License v2 or later
*/

/* ============================================================
   GOOGLE FONTS — load before anything references them
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;1,400&family=DM+Sans:ital,wght@0,300;0,400;0,500;1,300&display=swap');


/* ============================================================
   TABLE OF CONTENTS
   ─────────────────
   1.  CSS Custom Properties (design tokens)
   2.  Global Reset & Base
   3.  Typography
   4.  Utility Classes
   5.  Navigation
   6.  Homepage
   7.  Article Page — Layout & Structure
   8.  Article Page — Hero & Meta Bar
   9.  Article Page — Content Body
   10. Article Page — Special Blocks
        a. Table of Contents
        b. Tip / Info Boxes
        c. Cost Box
        d. Inline Product Card (AAWP)
        e. Share Row
   11. Sidebar
        a. Sidebar Email Opt-In
        b. Sidebar Product List
        c. Sidebar Related Posts
   12. Review Page — Layout & Structure
   13. Review Page — Hero Section
   14. Review Page — Verdict Card (WP Review Pro)
   15. Review Page — Buy Box (AAWP)
   16. Review Page — Pros & Cons
   17. Review Page — Comparison Table (TablePress)
   18. Review Page — FAQ (Rank Math)
   19. Review Page — Bottom CTA Strip
   20. Author Bio Box
   21. Breadcrumbs
   22. Affiliate Disclosure
   23. Archive & Category Pages
   24. Footer
   25. Plugin Overrides
        a. Easy Table of Contents
        b. Sassy Social Share
        c. FluentForms
        d. Rank Math Breadcrumbs
   26. Accessibility
   27. Print Styles
   28. Responsive — Tablet (max 900px)
   29. Responsive — Mobile (max 600px)
   ============================================================ */


/* ============================================================
   1. CSS CUSTOM PROPERTIES
   ============================================================ */
:root {
  /* Brand palette */
  --clay:          #C4896A;
  --clay-light:    #EDD5C4;
  --clay-dark:     #8C5A3F;
  --clay-xlight:   #FAF0E8;
  --forest:        #3B5042;
  --forest-light:  #D6E3D9;
  --forest-mid:    #6B8C74;
  --forest-dark:   #27503A;
  --cream:         #FAF7F2;
  --warm-white:    #FFFDF9;
  --gold:          #C9A84C;

  /* Neutrals */
  --ink:           #1E1E1E;
  --ink-mid:       #2C2C2C;
  --text-body:     #4A4A4A;
  --text-muted:    #888888;
  --text-light:    #BBBBBB;
  --border:        #E8E2D8;
  --border-light:  #F0EBE2;
  --surface:       #FAFAFA;
  --white:         #FFFFFF;

  /* Semantic */
  --green-bg:      #EAF3DE;
  --green-text:    #27500A;
  --green-border:  #3B6D11;
  --red-bg:        #FCEBEB;
  --red-text:      #791F1F;
  --red-border:    #A32D2D;
  --amber-bg:      #FAEEDA;
  --amber-text:    #633806;
  --info-bg:       #E6F1FB;
  --info-text:     #0C447C;

  /* Typography */
  --font-serif:    'Playfair Display', Georgia, serif;
  --font-sans:     'DM Sans', system-ui, sans-serif;

  /* Scale — fluid type using clamp() */
  --text-xs:       0.75rem;
  --text-sm:       0.8125rem;
  --text-base:     0.9375rem;
  --text-md:       1rem;
  --text-lg:       1.125rem;
  --text-xl:       1.25rem;
  --text-2xl:      1.5rem;
  --text-3xl:      1.875rem;
  --text-4xl:      clamp(1.875rem, 4vw, 2.5rem);
  --text-5xl:      clamp(2.25rem,  5vw, 3.25rem);

  /* Spacing */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* Layout */
  --max-width:       1200px;
  --content-width:    760px;
  --sidebar-width:    280px;
  --content-gap:       40px;

  /* Radii */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --radius-xl:   20px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.06);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.08);
  --shadow-lg:  0 12px 40px rgba(0,0,0,0.10);
  --shadow-clay: 0 8px 32px rgba(196,137,106,0.14);

  /* Transitions */
  --ease:        0.2s ease;
  --ease-spring: 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}


/* ============================================================
   2. GLOBAL RESET & BASE
   ============================================================ */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-sans);
  font-size:   var(--text-base);
  line-height: 1.75;
  color:       var(--text-body);
  background:  var(--warm-white);
  margin:      0;
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img,
video {
  max-width: 100%;
  height:    auto;
  display:   block;
}

a {
  color:           var(--clay);
  text-decoration: none;
  transition:      color var(--ease);
}
a:hover { color: var(--clay-dark); }

hr {
  border:     none;
  border-top: 1px solid var(--border);
  margin:     var(--space-8) 0;
}

/* Container */
.dwg-container {
  max-width:     var(--max-width);
  margin-inline: auto;
  padding-inline: var(--space-6);
}
.dwg-content-narrow {
  max-width: var(--content-width);
}


/* ============================================================
   3. TYPOGRAPHY
   ============================================================ */

/* Headings inherit serif */
h1, h2, h3, h4, h5, h6 {
  font-family:    var(--font-serif);
  font-weight:    700;
  color:          var(--ink);
  line-height:    1.2;
  letter-spacing: -0.02em;
}

h1 { font-size: var(--text-5xl); margin: 0 0 var(--space-5); }
h2 { font-size: var(--text-4xl); margin: var(--space-10) 0 var(--space-4); }
h3 { font-size: var(--text-2xl); margin: var(--space-6) 0 var(--space-3); }
h4 { font-size: var(--text-xl);  margin: var(--space-5) 0 var(--space-2); font-family: var(--font-sans); font-weight: 500; }
h5, h6 { font-size: var(--text-base); font-family: var(--font-sans); font-weight: 500; }

p  { margin: 0 0 var(--space-5); }

ul, ol {
  padding-left: var(--space-6);
  margin:       0 0 var(--space-5);
}
li { margin-bottom: var(--space-2); line-height: 1.7; }

strong, b { font-weight: 500; color: var(--ink); }
em, i { font-style: italic; }

blockquote {
  margin:      var(--space-8) 0;
  padding:     var(--space-5) var(--space-6);
  border-left: 4px solid var(--clay);
  background:  var(--clay-xlight);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-family: var(--font-serif);
  font-size:   var(--text-xl);
  font-style:  italic;
  color:       var(--clay-dark);
}
blockquote cite {
  display:    block;
  margin-top: var(--space-3);
  font-size:  var(--text-sm);
  font-style: normal;
  color:      var(--text-muted);
}

code {
  font-family:    monospace;
  font-size:      0.875em;
  background:     var(--cream);
  border:         1px solid var(--border);
  border-radius:  var(--radius-sm);
  padding:        0.1em 0.4em;
  color:          var(--clay-dark);
}

table {
  width:           100%;
  border-collapse: collapse;
  font-size:       var(--text-sm);
}
th, td {
  padding:       var(--space-3) var(--space-4);
  text-align:    left;
  border-bottom: 1px solid var(--border);
}
th {
  background:    var(--ink);
  color:         var(--white);
  font-family:   var(--font-sans);
  font-weight:   500;
  font-size:     var(--text-xs);
  letter-spacing: 0.5px;
}
tbody tr:nth-child(even) td { background: var(--cream); }


/* ============================================================
   4. UTILITY CLASSES
   ============================================================ */

.dwg-sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.dwg-cat-badge {
  display:       inline-block;
  background:    var(--clay-light);
  color:         var(--clay-dark);
  font-size:     var(--text-xs);
  font-weight:   500;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding:       4px 12px;
  border-radius: var(--radius-pill);
  transition:    background var(--ease);
}
.dwg-cat-badge:hover {
  background: var(--clay);
  color:      var(--white);
}

.dwg-read-time {
  display:     inline-flex;
  align-items: center;
  gap:         5px;
  font-size:   var(--text-sm);
  color:       var(--text-muted);
}

.dwg-updated-badge,
.dwg-updated {
  display:     inline-block;
  background:  var(--forest-light);
  color:       var(--forest-dark);
  font-size:   var(--text-xs);
  font-weight: 500;
  padding:     3px 10px;
  border-radius: var(--radius-pill);
}

/* Buttons */
.dwg-btn {
  display:         inline-block;
  padding:         12px 26px;
  border-radius:   var(--radius-pill);
  font-family:     var(--font-sans);
  font-size:       var(--text-sm);
  font-weight:     500;
  text-decoration: none;
  transition:      all var(--ease);
  cursor:          pointer;
  border:          none;
}
.dwg-btn-primary {
  background: var(--clay);
  color:      var(--white);
}
.dwg-btn-primary:hover {
  background: var(--clay-dark);
  color:      var(--white);
}
.dwg-btn-ghost {
  background: transparent;
  color:      var(--ink);
  border:     1.5px solid var(--ink);
}
.dwg-btn-ghost:hover {
  background: var(--ink);
  color:      var(--white);
}
.dwg-btn-white {
  background: var(--white);
  color:      var(--clay-dark);
}
.dwg-btn-white:hover {
  background: var(--clay-light);
  color:      var(--clay-dark);
}


/* ============================================================
   5. NAVIGATION
   ============================================================ */

/* Kadence sticky nav overrides */
.site-header,
.kadence-sticky-header {
  background:    var(--warm-white) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow:    none !important;
}

.site-header .site-branding .site-title {
  font-family:    var(--font-serif) !important;
  font-size:      1.375rem !important;
  font-weight:    700 !important;
  letter-spacing: -0.02em !important;
  color:          var(--ink) !important;
}

/* Logo "Nest & Thrive" ampersand accent */
.site-header .site-branding .site-title a { color: var(--ink); }
.site-header .site-branding .site-title a:hover { color: var(--clay); }

/* Primary nav links */
.primary-navigation a,
.main-navigation a {
  font-family: var(--font-sans);
  font-size:   var(--text-sm);
  font-weight: 500;
  color:       var(--text-body) !important;
  letter-spacing: 0.2px;
  transition:  color var(--ease);
}
.primary-navigation a:hover,
.main-navigation a:hover,
.primary-navigation .current-menu-item > a,
.main-navigation .current-menu-item > a {
  color: var(--clay) !important;
}

/* Nav CTA button (Free Guide) */
.nav-cta-button a,
.header-navigation .menu-item.menu-cta a {
  background:    var(--clay) !important;
  color:         var(--white) !important;
  padding:       8px 20px !important;
  border-radius: var(--radius-pill) !important;
  font-size:     var(--text-sm) !important;
  font-weight:   500 !important;
  transition:    background var(--ease) !important;
}
.nav-cta-button a:hover,
.header-navigation .menu-item.menu-cta a:hover {
  background: var(--clay-dark) !important;
}

/* Mobile hamburger */
.menu-toggle {
  color: var(--ink) !important;
}


/* ============================================================
   6. HOMEPAGE
   ============================================================ */

/* Hero section */
.dwg-hero {
  background:   var(--cream);
  min-height:   580px;
  display:      grid;
  grid-template-columns: 1fr 1fr;
  overflow:     hidden;
}
.dwg-hero-left {
  padding:         var(--space-16) var(--space-10) var(--space-16) var(--space-8);
  display:         flex;
  flex-direction:  column;
  justify-content: center;
}
.dwg-hero-eyebrow {
  font-size:      var(--text-xs);
  font-weight:    500;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color:          var(--clay);
  margin-bottom:  var(--space-5);
}
.dwg-hero-title {
  font-family: var(--font-serif);
  font-size:   var(--text-5xl);
  line-height: 1.1;
  color:       var(--ink);
  margin:      0 0 var(--space-5);
}
.dwg-hero-title em {
  font-style: italic;
  color:      var(--clay);
}
.dwg-hero-subtitle {
  font-size:   var(--text-md);
  line-height: 1.7;
  color:       var(--text-body);
  font-weight: 300;
  margin:      0 0 var(--space-8);
  max-width:   420px;
}
.dwg-hero-btns {
  display:   flex;
  gap:       var(--space-3);
  flex-wrap: wrap;
}
.dwg-hero-stats {
  display:      flex;
  gap:          var(--space-8);
  margin-top:   var(--space-10);
  padding-top:  var(--space-8);
  border-top:   1px solid var(--border);
}
.dwg-hero-stat-num {
  font-family: var(--font-serif);
  font-size:   var(--text-3xl);
  font-weight: 700;
  color:       var(--ink);
  line-height: 1;
}
.dwg-hero-stat-label {
  font-size:  var(--text-xs);
  color:      var(--text-muted);
  margin-top: 3px;
}

/* Trust bar */
.dwg-trust-bar {
  background: var(--forest);
  padding:    var(--space-4) var(--space-8);
  display:    flex;
  align-items: center;
  justify-content: center;
  gap:        var(--space-10);
  flex-wrap:  wrap;
}
.dwg-trust-item {
  display:     flex;
  align-items: center;
  gap:         var(--space-2);
  color:       rgba(255,255,255,0.82);
  font-size:   var(--text-sm);
}
.dwg-trust-icon {
  width:           18px;
  height:          18px;
  background:      var(--forest-mid);
  border-radius:   50%;
  display:         flex;
  align-items:     center;
  justify-content: center;
  flex-shrink:     0;
  font-size:       10px;
  color:           var(--white);
}

/* Silo grid */
.dwg-silos {
  padding:    var(--space-16) var(--space-8);
  background: var(--warm-white);
}
.dwg-silos-grid {
  display:               grid;
  grid-template-columns: repeat(4, 1fr);
  gap:                   var(--space-5);
}
.dwg-silo-card {
  background:    var(--cream);
  border-radius: var(--radius-lg);
  padding:       var(--space-6) var(--space-5);
  text-decoration: none;
  transition:    all var(--ease-spring);
  border:        1.5px solid transparent;
  position:      relative;
  overflow:      hidden;
}
.dwg-silo-card::before {
  content:    '';
  position:   absolute;
  top:        0; left: 0;
  width:      4px; height: 100%;
  background: var(--clay);
  opacity:    0;
  transition: opacity var(--ease);
}
.dwg-silo-card:hover {
  background:   var(--white);
  border-color: var(--clay-light);
  box-shadow:   var(--shadow-clay);
  transform:    translateY(-3px);
  color:        inherit;
}
.dwg-silo-card:hover::before { opacity: 1; }

.dwg-silo-icon {
  width:           44px;
  height:          44px;
  border-radius:   var(--radius-md);
  background:      var(--clay-light);
  display:         flex;
  align-items:     center;
  justify-content: center;
  margin-bottom:   var(--space-4);
  font-size:       20px;
}
.dwg-silo-card.variant-forest .dwg-silo-icon { background: var(--forest-light); }
.dwg-silo-card.variant-amber  .dwg-silo-icon { background: var(--amber-bg); }
.dwg-silo-card.variant-blue   .dwg-silo-icon { background: var(--info-bg); }

.dwg-silo-title {
  font-family:  var(--font-serif);
  font-size:    var(--text-base);
  font-weight:  700;
  color:        var(--ink);
  margin:       0 0 var(--space-2);
  line-height:  1.3;
}
.dwg-silo-desc {
  font-size:   var(--text-sm);
  color:       var(--text-muted);
  line-height: 1.6;
  font-weight: 300;
  margin:      0;
}
.dwg-silo-arrow {
  position:   absolute;
  top:        var(--space-5);
  right:      var(--space-4);
  color:      var(--clay-light);
  font-size:  18px;
  transition: all var(--ease);
}
.dwg-silo-card:hover .dwg-silo-arrow {
  color:     var(--clay);
  transform: translateX(4px);
}

/* Product picks strip */
.dwg-picks {
  padding:    var(--space-16) var(--space-8);
  background: var(--white);
}
.dwg-picks-grid {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   var(--space-5);
}
.dwg-pick-card {
  background:    var(--white);
  border:        1px solid var(--border);
  border-radius: var(--radius-lg);
  padding:       var(--space-5);
  display:       flex;
  gap:           var(--space-4);
  align-items:   flex-start;
  transition:    all var(--ease);
}
.dwg-pick-card:hover {
  border-color: var(--clay-light);
  box-shadow:   var(--shadow-clay);
}
.dwg-pick-rank {
  font-family: var(--font-serif);
  font-size:   var(--text-4xl);
  font-weight: 700;
  color:       var(--clay-light);
  line-height: 1;
  flex-shrink: 0;
  min-width:   32px;
}
.dwg-pick-img {
  width:           70px;
  height:          70px;
  border-radius:   var(--radius-md);
  background:      var(--clay-light);
  flex-shrink:     0;
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       28px;
}
.dwg-pick-title {
  font-size:   var(--text-sm);
  font-weight: 500;
  color:       var(--ink);
  line-height: 1.4;
  margin:      0 0 var(--space-2);
}
.dwg-pick-meta {
  font-size:   var(--text-xs);
  color:       var(--text-muted);
  font-weight: 300;
  margin:      0 0 var(--space-3);
}
.dwg-pick-stars {
  display:       flex;
  gap:           2px;
  margin-bottom: var(--space-3);
}
.dwg-star {
  width:      11px;
  height:     11px;
  background: var(--gold);
  clip-path:  polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);
}
.dwg-pick-cta {
  font-size:   var(--text-xs);
  font-weight: 500;
  color:       var(--clay);
}
.dwg-pick-cta:hover { color: var(--clay-dark); }



/* Social proof below form */
.dwg-social-proof {
  display:         flex;
  align-items:     center;
  justify-content: center;
  gap:             var(--space-3);
  margin-top:      var(--space-5);
  font-size:       var(--text-xs);
  color:           rgba(255,255,255,0.5);
}
.dwg-avatars { display: flex; }
.dwg-avatar {
  width:         24px;
  height:        24px;
  border-radius: 50%;
  border:        2px solid var(--forest);
  margin-left:   -6px;
  font-size:     9px;
  display:       flex;
  align-items:   center;
  justify-content: center;
  font-weight:   500;
  color:         var(--white);
}


/* ============================================================
   7. ARTICLE PAGE — LAYOUT & STRUCTURE
   ============================================================ */

/* Kadence content area */
body.single-post .content-area,
body.single-post .site-content {
  background: var(--warm-white);
}

/* Two-column wrapper: content + sidebar */
body.single-post .content-container,
body.single-post .kadence-content-area-inner {
  display:               grid;
  grid-template-columns: 1fr var(--sidebar-width);
  gap:                   var(--content-gap);
  max-width:             var(--max-width);
  margin-inline:         auto;
  padding-inline:        var(--space-6);
  padding-block:         var(--space-10);
  align-items:           start;
}

/* Main article column */
body.single-post .entry-content-wrap,
body.single-post main {
  min-width: 0; /* prevent overflow in grid */
}


/* ============================================================
   8. ARTICLE PAGE — HERO & META BAR
   ============================================================ */

/* Category badge */
.single-post .entry-header .dwg-cat-badge,
.single-post .post-category-badge {
  display:       inline-block;
  margin-bottom: var(--space-4);
}

/* Article title */
.single-post h1.entry-title {
  font-family:  var(--font-serif) !important;
  font-size:    var(--text-4xl) !important;
  font-weight:  700 !important;
  line-height:  1.15 !important;
  color:        var(--ink) !important;
  margin:       0 0 var(--space-5) !important;
  letter-spacing: -0.02em;
}

/* Article subtitle / excerpt shown above content */
.single-post .entry-subtitle {
  font-size:   var(--text-lg);
  line-height: 1.65;
  color:       var(--text-body);
  font-weight: 300;
  margin:      0 0 var(--space-5);
}

/* Meta bar */
.single-post .entry-meta,
.single-post .article-meta-bar {
  display:       flex;
  align-items:   center;
  gap:           var(--space-4);
  flex-wrap:     wrap;
  padding-bottom: var(--space-5);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--space-6);
  font-size:     var(--text-sm);
  color:         var(--text-muted);
}

/* Author avatar circle */
.single-post .author-avatar-circle,
.single-post .entry-meta .author-avatar {
  width:           32px;
  height:          32px;
  border-radius:   50%;
  background:      var(--clay-light);
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       var(--text-xs);
  font-weight:     500;
  color:           var(--clay-dark);
  flex-shrink:     0;
  overflow:        hidden;
}
.single-post .entry-meta .author-avatar img {
  width:         100%;
  height:        100%;
  object-fit:    cover;
  border-radius: 50%;
}

/* Meta dividers */
.single-post .entry-meta .meta-divider {
  width:      1px;
  height:     16px;
  background: var(--border);
}

/* Featured image */
.single-post .post-thumbnail,
.single-post .featured-image-wrap {
  margin-bottom: var(--space-6);
}
.single-post .post-thumbnail img,
.single-post .featured-image-wrap img {
  border-radius: var(--radius-lg);
  width:         100%;
  height:        auto;
}
.single-post .wp-caption-text,
.single-post figcaption {
  font-size:  var(--text-xs);
  color:      var(--text-muted);
  text-align: center;
  margin-top: var(--space-2);
}


/* ============================================================
   9. ARTICLE PAGE — CONTENT BODY
   ============================================================ */

.single-post .entry-content {
  font-family: var(--font-sans);
  font-size:   var(--text-base);
  line-height: 1.8;
  color:       var(--text-body);
}

.single-post .entry-content h2 {
  font-family:  var(--font-serif);
  font-size:    var(--text-3xl);
  font-weight:  700;
  color:        var(--ink);
  margin:       var(--space-10) 0 var(--space-4);
  padding-top:  var(--space-2);
  line-height:  1.25;
}
.single-post .entry-content h3 {
  font-family: var(--font-serif);
  font-size:   var(--text-xl);
  font-weight: 700;
  color:       var(--ink);
  margin:      var(--space-8) 0 var(--space-3);
}
.single-post .entry-content h4 {
  font-family: var(--font-sans);
  font-size:   var(--text-base);
  font-weight: 500;
  color:       var(--ink);
  margin:      var(--space-6) 0 var(--space-2);
}

.single-post .entry-content p { margin: 0 0 var(--space-5); }

.single-post .entry-content a {
  color:           var(--clay);
  text-decoration: underline;
  text-decoration-color: var(--clay-light);
  text-underline-offset:  3px;
  transition:      color var(--ease), text-decoration-color var(--ease);
}
.single-post .entry-content a:hover {
  color:                  var(--clay-dark);
  text-decoration-color:  var(--clay);
}

.single-post .entry-content ul li::marker { color: var(--clay); }
.single-post .entry-content ol li::marker {
  color:       var(--clay);
  font-weight: 500;
}

/* Images in content */
.single-post .entry-content img {
  border-radius: var(--radius-md);
  margin-block:  var(--space-6);
}
.single-post .entry-content figure { margin: var(--space-8) 0; }

/* Horizontal rule */
.single-post .entry-content hr {
  border-top: 2px solid var(--border);
  margin:     var(--space-10) 0;
}

/* Share row at article bottom */
.dwg-share-row {
  display:       flex;
  align-items:   center;
  gap:           var(--space-3);
  flex-wrap:     wrap;
  padding-top:   var(--space-6);
  border-top:    1px solid var(--border);
  margin-top:    var(--space-8);
}
.dwg-share-label {
  font-size:  var(--text-sm);
  color:      var(--text-muted);
  flex-shrink: 0;
}
.dwg-share-btn {
  background:    var(--cream);
  border:        1px solid var(--border);
  border-radius: var(--radius-pill);
  padding:       6px 14px;
  font-size:     var(--text-xs);
  font-weight:   500;
  color:         var(--text-body);
  transition:    all var(--ease);
  cursor:        pointer;
  text-decoration: none;
}
.dwg-share-btn:hover {
  background: var(--clay);
  border-color: var(--clay);
  color:      var(--white);
}


/* ============================================================
   10. ARTICLE PAGE — SPECIAL BLOCKS
   ============================================================ */

/* ── a. Table of Contents ── */
.ez-toc-container,
.dwg-toc {
  background:  var(--cream) !important;
  border-left: 3px solid var(--clay) !important;
  border-radius: 0 !important;
  padding:     var(--space-5) var(--space-6) !important;
  margin:      var(--space-6) 0 !important;
  box-shadow:  none !important;
}
.ez-toc-title,
.dwg-toc-title {
  font-family:    var(--font-sans) !important;
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color:          var(--clay-dark) !important;
  margin-bottom:  var(--space-3) !important;
}
.ez-toc-list,
.dwg-toc-list {
  list-style:  none !important;
  padding:     0 !important;
  margin:      0 !important;
}
.ez-toc-list li,
.dwg-toc-list li {
  margin-bottom: var(--space-2) !important;
}
.ez-toc-list li a,
.dwg-toc-list li a {
  font-size:       var(--text-sm) !important;
  color:           var(--text-body) !important;
  text-decoration: none !important;
  display:         flex !important;
  align-items:     center !important;
  gap:             var(--space-2) !important;
  transition:      color var(--ease) !important;
}
.ez-toc-list li a:hover,
.dwg-toc-list li a:hover { color: var(--clay) !important; }
.ez-toc-counter,
.dwg-toc-num {
  font-size:  var(--text-xs) !important;
  color:      var(--text-muted) !important;
  min-width:  20px;
  flex-shrink: 0;
}

/* ── b. Tip / Info Boxes ── */
.dwg-tip-box,
.kb-info-box-container.dwg-style-tip,
.wp-block-kadence-infobox.dwg-tip {
  background:    var(--forest-light);
  border-left:   3px solid var(--forest);
  border-radius: 0;
  padding:       var(--space-4) var(--space-5);
  margin:        var(--space-6) 0;
}
.dwg-tip-box-label,
.kb-info-box-container.dwg-style-tip .kb-info-box-title {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.2px !important;
  color:          var(--forest) !important;
  margin-bottom:  var(--space-2) !important;
}
.dwg-tip-box-text,
.kb-info-box-container.dwg-style-tip .kb-info-box-text {
  font-size:   var(--text-sm) !important;
  color:       #2A3D30 !important;
  line-height: 1.65 !important;
  font-weight: 400 !important;
}

/* Warning box variant */
.dwg-warn-box,
.kb-info-box-container.dwg-style-warn {
  background:  var(--amber-bg);
  border-left: 3px solid var(--gold);
  border-radius: 0;
  padding:     var(--space-4) var(--space-5);
  margin:      var(--space-6) 0;
}
.dwg-warn-box-label { color: var(--amber-text); }

/* ── c. Cost Box ── */
.dwg-cost-box {
  background:    var(--cream);
  border:        1px solid var(--border);
  border-radius: var(--radius-md);
  padding:       var(--space-5);
  margin:        var(--space-6) 0;
  display:       grid;
  grid-template-columns: repeat(3, 1fr);
  gap:           0;
}
.dwg-cost-item {
  text-align: center;
  padding:    0 var(--space-4);
}
.dwg-cost-item + .dwg-cost-item { border-left: 1px solid var(--border); }
.dwg-cost-label {
  font-size:      var(--text-xs);
  text-transform: uppercase;
  letter-spacing: 1px;
  color:          var(--text-muted);
  margin-bottom:  4px;
  display:        block;
}
.dwg-cost-value {
  font-family: var(--font-serif);
  font-size:   var(--text-3xl);
  font-weight: 700;
  color:       var(--clay-dark);
  display:     block;
  line-height: 1.1;
}
.dwg-cost-note {
  font-size:   var(--text-xs);
  color:       var(--text-muted);
  margin-top:  4px;
  display:     block;
}

/* ── d. Inline Product Card (AAWP) ── */
.aawp .aawp-product,
.aawp-product--horizontal {
  border:        1px solid var(--border) !important;
  border-radius: var(--radius-md) !important;
  padding:       var(--space-4) !important;
  display:       flex !important;
  align-items:   center !important;
  gap:           var(--space-4) !important;
  margin:        var(--space-5) 0 !important;
  background:    var(--white) !important;
  box-shadow:    none !important;
  transition:    border-color var(--ease), box-shadow var(--ease) !important;
}
.aawp .aawp-product:hover {
  border-color: var(--clay-light) !important;
  box-shadow:   var(--shadow-clay) !important;
}
.aawp .aawp-product__thumb {
  width:         56px !important;
  height:        56px !important;
  border-radius: var(--radius-md) !important;
  object-fit:    contain !important;
  flex-shrink:   0 !important;
}
.aawp .aawp-product__title {
  font-size:   var(--text-sm) !important;
  font-weight: 500 !important;
  color:       var(--ink) !important;
  margin:      0 0 var(--space-2) !important;
  font-family: var(--font-sans) !important;
}
.aawp .aawp-product__subtitle,
.aawp .aawp-product__description {
  font-size:   var(--text-xs) !important;
  color:       var(--text-muted) !important;
  font-weight: 300 !important;
  margin:      0 0 var(--space-3) !important;
}
.aawp .aawp-product__button {
  margin-top: 0 !important;
}
.aawp .aawp-product__button a,
.aawp .aawp-button {
  background:      var(--clay) !important;
  color:           var(--white) !important;
  border-radius:   var(--radius-pill) !important;
  padding:         8px var(--space-4) !important;
  font-size:       var(--text-xs) !important;
  font-weight:     500 !important;
  font-family:     var(--font-sans) !important;
  text-decoration: none !important;
  display:         inline-block !important;
  transition:      background var(--ease) !important;
  border:          none !important;
}
.aawp .aawp-product__button a:hover,
.aawp .aawp-button:hover {
  background: var(--clay-dark) !important;
  color:      var(--white) !important;
}

/* ── e. Share Row ── */
.dwg-share-row { /* defined above in section 9 */ }


/* ============================================================
   11. SIDEBAR
   ============================================================ */

.widget-area,
.kadence-sidebar,
.site-sidebar {
  position:   sticky;
  top:        var(--space-10);
  align-self: flex-start;
}

/* Generic widget */
.widget-area .widget,
.dwg-widget {
  margin-bottom: var(--space-5);
}

/* ── a. Sidebar Email Opt-In ── */
.dwg-sidebar-optin,
.widget.dwg-email-optin {
  background:    var(--clay);
  border-radius: var(--radius-lg);
  padding:       var(--space-5);
  text-align:    center;
  margin-bottom: var(--space-5);
}
.dwg-sidebar-optin h3,
.dwg-sidebar-optin .dwg-optin-title {
  font-family: var(--font-serif);
  font-size:   var(--text-xl);
  font-weight: 700;
  color:       var(--white);
  margin:      0 0 var(--space-2);
  line-height: 1.3;
}
.dwg-sidebar-optin p,
.dwg-sidebar-optin .dwg-optin-sub {
  font-size:   var(--text-xs);
  color:       rgba(255,255,255,0.75);
  font-weight: 300;
  line-height: 1.6;
  margin:      0 0 var(--space-4);
}
.dwg-sidebar-optin .dwg-btn,
.dwg-sidebar-optin input[type="submit"] {
  background:    var(--white) !important;
  color:         var(--clay-dark) !important;
  border-radius: var(--radius-pill) !important;
  padding:       9px var(--space-5) !important;
  font-size:     var(--text-sm) !important;
  font-weight:   500 !important;
  display:       inline-block;
  width:         100%;
  text-align:    center;
  border:        none !important;
  cursor:        pointer;
  transition:    background var(--ease) !important;
}
.dwg-sidebar-optin .dwg-btn:hover { background: var(--clay-light) !important; }

/* ── b. Sidebar Product List ── */
.dwg-sidebar-products,
.widget.dwg-product-list {
  background:    var(--cream);
  border-radius: var(--radius-md);
  padding:       var(--space-5);
  margin-bottom: var(--space-5);
}
.dwg-sidebar-products h3,
.dwg-sidebar-products .widget-title {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color:          var(--clay-dark) !important;
  margin:         0 0 var(--space-4) !important;
  font-family:    var(--font-sans) !important;
}
.dwg-sidebar-product {
  display:       flex;
  gap:           var(--space-3);
  align-items:   flex-start;
  padding:       var(--space-3) 0;
  border-bottom: 1px solid var(--border);
}
.dwg-sidebar-product:last-child { border-bottom: none; }
.dwg-sidebar-product-img {
  width:         44px;
  height:        44px;
  border-radius: var(--radius-sm);
  background:    var(--clay-light);
  flex-shrink:   0;
  object-fit:    contain;
}
.dwg-sidebar-product-name {
  font-size:   var(--text-sm);
  font-weight: 500;
  color:       var(--ink);
  margin:      0 0 var(--space-1);
  line-height: 1.35;
}
.dwg-sidebar-product-price {
  font-size:  var(--text-xs);
  color:      var(--text-muted);
  margin:     0;
}
.dwg-sidebar-product-link {
  font-size:   var(--text-xs);
  font-weight: 500;
  color:       var(--clay);
  display:     block;
  margin-top:  var(--space-1);
}

/* ── c. Sidebar Related Posts ── */
.dwg-sidebar-related,
.dwg-related-posts,
.widget.dwg-related {
  background:    var(--cream);
  border-radius: var(--radius-md);
  padding:       var(--space-5);
}
.dwg-sidebar-related h3,
.dwg-related-posts-title,
.widget.dwg-related .widget-title {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color:          var(--clay-dark) !important;
  margin:         0 0 var(--space-4) !important;
  font-family:    var(--font-sans) !important;
}
.dwg-related-item {
  display:       flex;
  gap:           var(--space-3);
  align-items:   flex-start;
  padding:       var(--space-3) 0;
  border-bottom: 1px solid var(--border);
}
.dwg-related-item:last-child { border-bottom: none; }
.dwg-related-thumb {
  width:         48px;
  height:        40px;
  flex-shrink:   0;
  border-radius: var(--radius-sm);
  overflow:      hidden;
  background:    var(--border);
}
.dwg-related-thumb img {
  width:      100%;
  height:     100%;
  object-fit: cover;
}
.dwg-related-title {
  font-size:   var(--text-sm);
  font-weight: 500;
  color:       var(--ink);
  line-height: 1.35;
  display:     block;
  margin:      0 0 var(--space-1);
  transition:  color var(--ease);
}
.dwg-related-title:hover { color: var(--clay); }
.dwg-related-meta {
  font-size:  var(--text-xs);
  color:      var(--text-muted);
  display:    block;
}


/* ============================================================
   12. REVIEW PAGE — LAYOUT & STRUCTURE
   ============================================================ */

.dwg-review-page {
  background: var(--warm-white);
}

.dwg-review-page .dwg-container { max-width: var(--max-width); }

/* Content width for review body text */
.dwg-review-page .dwg-content-narrow {
  max-width:     var(--content-width);
  margin-inline: auto;
  padding:       var(--space-10) var(--space-6);
}


/* ============================================================
   13. REVIEW PAGE — HERO SECTION
   ============================================================ */

.dwg-review-hero {
  background: var(--cream);
  padding:    var(--space-10) 0 0;
}
.dwg-review-hero-inner {
  display:               grid;
  grid-template-columns: 1fr 360px;
  gap:                   var(--space-8);
  align-items:           start;
}

/* Independent-testing badge */
.dwg-review-badge {
  display:       inline-flex;
  align-items:   center;
  gap:           var(--space-2);
  background:    var(--forest-light);
  color:         var(--green-text);
  font-size:     var(--text-xs);
  font-weight:   500;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding:       4px 12px;
  border-radius: var(--radius-pill);
  margin-bottom: var(--space-4);
}
.dwg-badge-dot {
  width:         6px;
  height:        6px;
  border-radius: 50%;
  background:    var(--forest-mid);
  flex-shrink:   0;
}

/* Review title */
.dwg-review-title {
  font-family:  var(--font-serif);
  font-size:    var(--text-4xl);
  font-weight:  700;
  line-height:  1.15;
  color:        var(--ink);
  margin:       0 0 var(--space-4);
  letter-spacing: -0.02em;
}

/* Review subtitle */
.dwg-review-subtitle {
  font-size:   var(--text-base);
  color:       var(--text-body);
  line-height: 1.65;
  font-weight: 300;
  margin:      0 0 var(--space-5);
}

/* Review meta row */
.dwg-review-meta {
  display:     flex;
  align-items: center;
  gap:         var(--space-4);
  flex-wrap:   wrap;
}
.dwg-review-meta-item {
  font-size: var(--text-sm);
  color:     var(--text-muted);
}

/* Star rating row (from WP Review or manual) */
.dwg-stars-row {
  display:     flex;
  align-items: center;
  gap:         3px;
}
.dwg-stars-score {
  font-size:   var(--text-base);
  font-weight: 500;
  color:       var(--ink);
  margin-left: var(--space-2);
}
.dwg-stars-count {
  font-size: var(--text-sm);
  color:     var(--text-muted);
}


/* ============================================================
   14. REVIEW PAGE — VERDICT CARD (WP Review Pro)
   ============================================================ */

/* Outer wrapper */
.wpr-review-wrapper,
.wpr-review-overall-rating {
  background:    var(--white) !important;
  border:        1.5px solid var(--clay-light) !important;
  border-radius: var(--radius-lg) !important;
  padding:       var(--space-5) !important;
  box-shadow:    none !important;
  margin:        0 0 var(--space-4) !important;
}

/* Header row inside verdict card */
.wpr-review-header {
  display:         flex !important;
  align-items:     center !important;
  justify-content: space-between !important;
  margin-bottom:   var(--space-4) !important;
}
.wpr-review-header .wpr-review-title {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color:          var(--clay-dark) !important;
  font-family:    var(--font-sans) !important;
}

/* Overall score circle */
.wpr-overall-score,
.wpr-rating-percentage,
.wpr-review-score {
  width:           52px !important;
  height:          52px !important;
  background:      var(--clay) !important;
  border-radius:   50% !important;
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  font-family:     var(--font-serif) !important;
  font-size:       1.25rem !important;
  font-weight:     700 !important;
  color:           var(--white) !important;
  border:          none !important;
  box-shadow:      none !important;
}

/* Score label next to circle */
.wpr-score-label strong {
  font-size:   var(--text-sm) !important;
  color:       var(--clay-dark) !important;
  font-weight: 500 !important;
  display:     block !important;
}
.wpr-score-label span {
  font-size: var(--text-xs) !important;
  color:     var(--text-muted) !important;
}

/* Individual criteria bars */
.wpr-criteria-bar-wrap,
.wpr-review-criteria {
  margin-bottom: var(--space-3) !important;
}
.wpr-criteria-label-row {
  display:         flex !important;
  justify-content: space-between !important;
  font-size:       var(--text-xs) !important;
  color:           var(--text-body) !important;
  margin-bottom:   4px !important;
}
.wpr-criteria-bar {
  background:    var(--border) !important;
  border-radius: 4px !important;
  height:        6px !important;
  overflow:      hidden !important;
}
.wpr-criteria-bar-fill {
  background:    var(--clay) !important;
  border-radius: 4px !important;
  height:        6px !important;
  transition:    width 0.9s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* Stars inside WP Review Pro */
.wpr-review-stars .wpr-star,
.wpr-stars .star-full {
  color: var(--gold) !important;
}
.wpr-review-stars .wpr-star-empty,
.wpr-stars .star-empty {
  color: var(--border) !important;
}

/* Verdict summary text */
.wpr-verdict-summary,
.wpr-review-desc {
  font-size:   var(--text-sm) !important;
  color:       var(--text-body) !important;
  line-height: 1.65 !important;
  font-weight: 300 !important;
  padding-top: var(--space-4) !important;
  border-top:  1px solid var(--border) !important;
  margin-top:  var(--space-4) !important;
}


/* ============================================================
   15. REVIEW PAGE — BUY BOX (AAWP)
   ============================================================ */

.aawp-product.aawp-buybox,
.aawp .aawp-product--buybox {
  background:    var(--forest) !important;
  border-radius: var(--radius-lg) !important;
  padding:       var(--space-5) !important;
  border:        none !important;
  box-shadow:    none !important;
  display:       block !important;
  flex-direction: column !important;
  gap:           0 !important;
  margin:        0 !important;
}
.aawp-product.aawp-buybox .aawp-buybox-label,
.aawp-product--buybox .aawp-buybox-label {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.5px !important;
  color:          rgba(255,255,255,0.6) !important;
  margin:         0 0 var(--space-3) !important;
}
.aawp-product.aawp-buybox .aawp-product__price,
.aawp-product--buybox .aawp-product__price {
  font-family:  var(--font-serif) !important;
  font-size:    var(--text-4xl) !important;
  font-weight:  700 !important;
  color:        var(--white) !important;
  margin:       0 0 var(--space-1) !important;
  line-height:  1 !important;
}
.aawp-product.aawp-buybox .aawp-price-note,
.aawp-product--buybox .aawp-price-note {
  font-size:     var(--text-xs) !important;
  color:         rgba(255,255,255,0.6) !important;
  margin-bottom: var(--space-4) !important;
}

/* Primary CTA */
.aawp-product.aawp-buybox .aawp-product__button a,
.aawp-product--buybox .aawp-product__button a {
  background:      var(--clay) !important;
  color:           var(--white) !important;
  border-radius:   var(--radius-pill) !important;
  padding:         12px var(--space-4) !important;
  font-size:       var(--text-sm) !important;
  font-weight:     500 !important;
  display:         block !important;
  text-align:      center !important;
  margin-bottom:   var(--space-3) !important;
  width:           100% !important;
  transition:      background var(--ease) !important;
  text-decoration: none !important;
}
.aawp-product.aawp-buybox .aawp-product__button a:hover {
  background: var(--clay-dark) !important;
  color:      var(--white) !important;
}

/* Secondary / alternative link */
.aawp-product.aawp-buybox .aawp-product__link-alt {
  display:      block !important;
  text-align:   center !important;
  background:   rgba(255,255,255,0.1) !important;
  color:        rgba(255,255,255,0.8) !important;
  border-radius: var(--radius-pill) !important;
  padding:      10px var(--space-4) !important;
  font-size:    var(--text-sm) !important;
  border:       1px solid rgba(255,255,255,0.2) !important;
  text-decoration: none !important;
}

/* Disclosure */
.aawp-disclosure,
.aawp-product.aawp-buybox .aawp-disclosure {
  font-size:   var(--text-xs) !important;
  color:       rgba(255,255,255,0.4) !important;
  text-align:  center !important;
  margin-top:  var(--space-3) !important;
  line-height: 1.5 !important;
}


/* ============================================================
   16. REVIEW PAGE — PROS & CONS
   ============================================================ */

.dwg-pros-cons {
  display:               grid;
  grid-template-columns: 1fr 1fr;
  gap:                   var(--space-4);
  margin:                var(--space-6) 0;
}

/* Pros column */
.dwg-pros-box {
  background:    var(--green-bg);
  border-radius: var(--radius-md);
  padding:       var(--space-4) var(--space-5);
}
.dwg-pros-title,
.dwg-cons-title {
  font-size:      var(--text-xs);
  font-weight:    500;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin:         0 0 var(--space-3);
}
.dwg-pros-title { color: var(--green-text); }

.dwg-pros-list,
.dwg-cons-list {
  list-style: none;
  padding:    0;
  margin:     0;
}
.dwg-pros-list li,
.dwg-cons-list li {
  font-size:     var(--text-sm);
  line-height:   1.55;
  margin-bottom: var(--space-2);
  display:       flex;
  align-items:   flex-start;
  gap:           var(--space-2);
  font-weight:   300;
}
.dwg-pros-list li .dwg-pro-mark { color: var(--green-border); font-size: 1rem; flex-shrink: 0; margin-top: -1px; }

/* Cons column */
.dwg-cons-box {
  background:    var(--red-bg);
  border-radius: var(--radius-md);
  padding:       var(--space-4) var(--space-5);
}
.dwg-cons-title { color: var(--red-text); }
.dwg-cons-list li .dwg-con-mark { color: var(--red-border); font-size: 1rem; flex-shrink: 0; margin-top: -1px; }

/* Kadence Icon List inside pros/cons Kadence Blocks */
.kb-icon-list-item-wrap.dwg-pros .kb-svg-icon-wrap svg { fill: var(--green-border) !important; }
.kb-icon-list-item-wrap.dwg-cons .kb-svg-icon-wrap svg { fill: var(--red-border) !important; }


/* ============================================================
   17. REVIEW PAGE — COMPARISON TABLE (TablePress)
   ============================================================ */

.dwg-compare-section {
  margin: var(--space-8) 0;
}
.dwg-compare-title {
  font-family: var(--font-serif);
  font-size:   var(--text-2xl);
  font-weight: 700;
  color:       var(--ink);
  margin:      0 0 var(--space-5);
}

/* TablePress overrides */
.tablepress { font-size: var(--text-sm) !important; }

.tablepress thead th {
  background:     var(--ink) !important;
  color:          var(--white) !important;
  padding:        10px 14px !important;
  font-family:    var(--font-sans) !important;
  font-weight:    500 !important;
  font-size:      var(--text-xs) !important;
  letter-spacing: 0.4px !important;
  border:         none !important;
}
.tablepress thead th:first-child { border-radius: 8px 0 0 0 !important; }
.tablepress thead th:last-child  { border-radius: 0 8px 0 0 !important; }

.tablepress tbody td {
  padding:       9px 14px !important;
  border-bottom: 0.5px solid var(--border) !important;
  color:         var(--text-body) !important;
  vertical-align: middle !important;
}
.tablepress tbody tr:nth-child(even) td {
  background: var(--cream) !important;
}

/* Winner / top-pick row */
.tablepress tbody tr.winner-row td {
  background: var(--forest-light) !important;
}
.tablepress tbody tr.winner-row td:first-child {
  font-weight: 500 !important;
  color:       var(--ink) !important;
}

/* Winner badge pill */
.winner-badge {
  display:       inline-block;
  background:    var(--forest);
  color:         var(--white);
  font-size:     9px;
  font-weight:   500;
  padding:       2px 8px;
  border-radius: var(--radius-pill);
  margin-left:   var(--space-2);
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

/* Check / cross cells */
.tablepress td.check { color: var(--green-border); font-weight: 500; }
.tablepress td.cross { color: var(--red-border); }
.tablepress td.partial { color: var(--amber-text); }


/* ============================================================
   18. REVIEW PAGE — FAQ (Rank Math)
   ============================================================ */

.dwg-faq-section,
.rank-math-faq-block {
  margin: var(--space-8) 0;
}
.rank-math-faq-title,
.dwg-faq-title {
  font-family:  var(--font-serif);
  font-size:    var(--text-2xl);
  font-weight:  700;
  color:        var(--ink);
  margin:       0 0 var(--space-5);
}
.rank-math-faq-item {
  border-bottom: 1px solid var(--border);
  padding:       var(--space-4) 0;
}
.rank-math-faq-item:first-of-type { border-top: 1px solid var(--border); }

.rank-math-faq-question {
  font-size:   var(--text-sm);
  font-weight: 500;
  color:       var(--ink);
  margin:      0;
  display:     flex;
  justify-content: space-between;
  align-items:     flex-start;
  gap:         var(--space-3);
  cursor:      pointer;
  line-height: 1.5;
}
.dwg-faq-arrow {
  color:      var(--clay);
  font-size:  var(--text-lg);
  flex-shrink: 0;
  margin-top: -2px;
  transition: transform var(--ease);
}
.rank-math-faq-answer {
  font-size:   var(--text-sm);
  color:       var(--text-body);
  line-height: 1.7;
  font-weight: 300;
  margin-top:  var(--space-3);
  padding-top: 0;
}


/* ============================================================
   19. REVIEW PAGE — BOTTOM CTA STRIP
   ============================================================ */

.dwg-review-bottom-cta {
  background: var(--clay);
  padding:    var(--space-8) 0;
  margin-top: var(--space-10);
}
.dwg-bottom-cta-inner {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  gap:             var(--space-6);
  flex-wrap:       wrap;
}
.dwg-cta-text h3 {
  font-family:  var(--font-serif);
  font-size:    var(--text-2xl);
  font-weight:  700;
  color:        var(--white);
  margin:       0 0 var(--space-2);
  line-height:  1.25;
}
.dwg-cta-text p {
  font-size:   var(--text-sm);
  color:       rgba(255,255,255,0.75);
  font-weight: 300;
  margin:      0;
}
.dwg-cta-btn {
  background:      var(--white);
  color:           var(--clay-dark) !important;
  padding:         11px var(--space-6);
  border-radius:   var(--radius-pill);
  font-size:       var(--text-sm);
  font-weight:     500;
  text-decoration: none;
  white-space:     nowrap;
  flex-shrink:     0;
  transition:      background var(--ease);
}
.dwg-cta-btn:hover {
  background: var(--clay-light);
  color:      var(--clay-dark) !important;
}


/* ============================================================
   20. AUTHOR BIO BOX
   ============================================================ */

.dwg-author-bio {
  display:       flex;
  gap:           var(--space-4);
  align-items:   flex-start;
  background:    var(--cream);
  border-radius: var(--radius-lg);
  padding:       var(--space-5);
  margin-top:    var(--space-8);
  border-top:    2px solid var(--border);
}
.dwg-author-avatar {
  flex-shrink:   0;
  width:         64px;
  height:        64px;
  border-radius: 50%;
  overflow:      hidden;
  background:    var(--clay-light);
}
.dwg-author-avatar img {
  width:   100%;
  height:  100%;
  object-fit: cover;
}
.dwg-author-info { flex: 1; }
.dwg-author-name {
  font-size:   var(--text-base);
  font-weight: 500;
  color:       var(--ink);
  margin:      0 0 var(--space-2);
}
.dwg-author-name a { color: var(--ink); }
.dwg-author-name a:hover { color: var(--clay); }
.dwg-author-desc {
  font-size:   var(--text-sm);
  color:       var(--text-muted);
  line-height: 1.65;
  font-weight: 300;
  margin:      0;
}


/* ════════════════════════════════════════════════
   BREADCRUMB BAR
   Matches the height and style of the reference
   ════════════════════════════════════════════════ */

/* Outer bar — full width, cream background */
.dwg-breadcrumb-bar,
.rank-math-breadcrumb-trail,
.breadcrumb-trail,
.kadence-breadcrumbs,
.site-breadcrumb {
  background:    #FAF7F2;
  border-bottom: 1px solid #E8E2D8;
  /* Match TheBarkBrief height — generous padding */
  padding:       16px clamp(16px, 4vw, 48px);
  width:         100%;
}

/* Inner wrapper — constrain to content width and align left */
.dwg-breadcrumb-bar .rank-math-breadcrumb,
.rank-math-breadcrumb,
nav.rank-math-breadcrumb,
.breadcrumb-trail .trail-items,
.kadence-breadcrumbs .breadcrumbs {
  max-width:   1200px;
  margin:      0 auto;
  display:     flex;
  align-items: center;
  flex-wrap:   wrap;
  gap:         4px;
  /* This aligns the breadcrumb text with the article title below it */
  padding:     0;
}

/* All breadcrumb text */
.rank-math-breadcrumb,
.rank-math-breadcrumb span,
.rank-math-breadcrumb a,
.breadcrumb-trail .trail-items,
.kadence-breadcrumbs span {
  font-family:  'DM Sans', sans-serif;
  font-size:    13px;
  font-weight:  400;
  line-height:  1;
  color:        #888888;
}

/* Links */
.rank-math-breadcrumb a,
.breadcrumb-trail a,
.kadence-breadcrumbs a {
  color:           #888888;
  text-decoration: none;
  transition:      color 0.2s;
}
.rank-math-breadcrumb a:hover,
.breadcrumb-trail a:hover,
.kadence-breadcrumbs a:hover {
  color: #C4896A;
}

/* Separator › */
.rank-math-breadcrumb .separator,
.rank-math-breadcrumb span.separator,
.breadcrumb-trail .sep,
.kadence-breadcrumbs .bc-sep {
  color:       #CCCCCC;
  font-size:   13px;
  padding:     0 4px;
  font-weight: 300;
}

/* Current page — last item (not linked) */
.rank-math-breadcrumb span:last-child:not(.separator),
.rank-math-breadcrumb .last,
.breadcrumb-trail .trail-end,
.kadence-breadcrumbs .current {
  color:         #4A4A4A;
  font-weight:   400;
  /* Truncate very long titles so bar doesn't wrap */
  max-width:     420px;
  overflow:      hidden;
  white-space:   nowrap;
  text-overflow: ellipsis;
}

/* Mobile — shorten current page text more aggressively */
@media (max-width: 600px) {
  .rank-math-breadcrumb span:last-child:not(.separator) {
    max-width: 200px;
  }
  .dwg-breadcrumb-bar,
  .kadence-breadcrumbs {
    padding: 12px 16px;
  }
}
/* ============================================================
   22. AFFILIATE DISCLOSURE
   ============================================================ */

.dwg-disclosure {
  background:    var(--amber-bg);
  border-left:   3px solid var(--gold);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  padding:       var(--space-3) var(--space-5);
  margin-bottom: var(--space-6);
}
.dwg-disclosure p {
  font-size:   var(--text-xs);
  color:       var(--amber-text);
  margin:      0;
  line-height: 1.6;
}
.dwg-disclosure strong { color: var(--amber-text); }


/* ============================================================
   23. ARCHIVE & CATEGORY PAGES
   ============================================================ */

.archive-header,
.category-header,
.tax-header {
  background:  var(--cream);
  padding:     var(--space-10) var(--space-8);
  border-bottom: 1px solid var(--border);
}
.archive-header h1,
.category-header h1 {
  font-family: var(--font-serif);
  font-size:   var(--text-4xl);
  color:       var(--ink);
  margin:      0 0 var(--space-2);
}
.archive-header .archive-desc,
.category-header .archive-desc {
  font-size:   var(--text-base);
  color:       var(--text-muted);
  font-weight: 300;
  margin:      0;
}

/* Post card grid on archives */
.archive .kadence-loop-wrapper,
.archive .post-loop-wrap {
  display:               grid;
  grid-template-columns: repeat(3, 1fr);
  gap:                   var(--space-6);
  max-width:             var(--max-width);
  margin-inline:         auto;
  padding:               var(--space-8);
}

/* Individual post cards */
.archive article.post,
.archive .entry-card {
  background:    var(--white);
  border:        1px solid var(--border);
  border-radius: var(--radius-lg);
  overflow:      hidden;
  transition:    all var(--ease);
}
.archive article.post:hover {
  box-shadow: var(--shadow-md);
  transform:  translateY(-3px);
  border-color: var(--clay-light);
}
.archive article.post .post-thumbnail img {
  height:     220px;
  width:      100%;
  object-fit: cover;
  border-radius: 0;
  margin:     0;
}
.archive article.post .entry-summary {
  padding: var(--space-5);
}
.archive article.post .entry-title {
  font-family: var(--font-serif);
  font-size:   var(--text-lg);
  font-weight: 700;
  margin:      0 0 var(--space-3);
  line-height: 1.3;
}
.archive article.post .entry-title a {
  color: var(--ink);
  text-decoration: none;
}
.archive article.post .entry-title a:hover { color: var(--clay); }
.archive article.post .entry-excerpt {
  font-size:   var(--text-sm);
  color:       var(--text-muted);
  line-height: 1.65;
  font-weight: 300;
  margin:      0 0 var(--space-4);
}
.archive article.post .entry-footer {
  display:     flex;
  align-items: center;
  gap:         var(--space-3);
  font-size:   var(--text-xs);
  color:       var(--text-muted);
}


/* ============================================================
   24. FOOTER
   ============================================================ */

.site-footer {
  background: var(--ink);
  color:      rgba(255,255,255,0.7);
}

.footer-widgets-area,
.dwg-footer-widgets {
  padding:               var(--space-12) var(--space-8) var(--space-8);
  display:               grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap:                   var(--space-10);
  max-width:             var(--max-width);
  margin-inline:         auto;
}

/* Footer brand column */
.footer-brand-col .site-title,
.footer-brand-col .footer-logo {
  font-family:  var(--font-serif);
  font-size:    1.25rem;
  font-weight:  700;
  color:        var(--white);
  margin-bottom: var(--space-4);
  display:      block;
}
.footer-brand-desc {
  font-size:   var(--text-sm);
  line-height: 1.7;
  font-weight: 300;
  max-width:   260px;
  color:       rgba(255,255,255,0.6);
  margin:      0;
}

/* Footer nav columns */
.dwg-footer-col h4,
.widget-area.footer-widget .widget-title {
  font-size:      var(--text-xs) !important;
  font-weight:    500 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color:          var(--white) !important;
  margin:         0 0 var(--space-4) !important;
  font-family:    var(--font-sans) !important;
}
.dwg-footer-col a,
.widget-area.footer-widget a {
  display:     block;
  font-size:   var(--text-sm);
  color:       rgba(255,255,255,0.55);
  font-weight: 300;
  margin-bottom: var(--space-2);
  transition:  color var(--ease);
  text-decoration: none;
}
.dwg-footer-col a:hover,
.widget-area.footer-widget a:hover { color: var(--clay); }

/* Footer bottom bar */
.footer-bottom,
.site-info {
  background:  #111111;
  padding:     var(--space-4) var(--space-8);
  display:     flex;
  justify-content: space-between;
  align-items: center;
  font-size:   var(--text-xs);
  color:       rgba(255,255,255,0.35);
  max-width:   none;
}
.footer-bottom a { color: rgba(255,255,255,0.35); }
.footer-bottom a:hover { color: var(--clay); }


/* ============================================================
   25. PLUGIN OVERRIDES
   ============================================================ */

/* ── a. Easy Table of Contents ── */
/* (main styles in section 10a — these catch any selectors missed above) */
#ez-toc-container      { border: none !important; background: var(--cream) !important; }
#ez-toc-container nav  { padding: 0 !important; }
.ez-toc-title-container { margin-bottom: var(--space-3) !important; }

/* ── b. Sassy Social Share ── */
.sassy-social-share-container {
  margin-top: var(--space-6) !important;
}
.sassy-social-share-button {
  border-radius: var(--radius-pill) !important;
  transition:    all var(--ease) !important;
}
.nc_tweetContainer {
  border-radius: var(--radius-pill) !important;
}



/* Sidebar opt-in — white button when on clay background */
.dwg-sidebar-optin .fluentform .ff-btn-submit {
  background: var(--white) !important;
  color:      var(--clay-dark) !important;
}
.dwg-sidebar-optin .fluentform .ff-btn-submit:hover {
  background: var(--clay-light) !important;
}

/* ── d. Rank Math Breadcrumbs ── */
.rank-math-breadcrumb {
  font-size:   var(--text-xs) !important;
  color:       var(--text-muted) !important;
}
.rank-math-breadcrumb a {
  color:      var(--text-muted) !important;
  transition: color var(--ease) !important;
}
.rank-math-breadcrumb a:hover { color: var(--clay) !important; }
.rank-math-breadcrumb .separator { color: var(--border) !important; }


/* ============================================================
   26. ACCESSIBILITY
   ============================================================ */

/* Skip to content */
.skip-link {
  position:    absolute;
  top:         -999px;
  left:        var(--space-4);
  background:  var(--clay);
  color:       var(--white);
  padding:     var(--space-3) var(--space-5);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  z-index:     9999;
  font-size:   var(--text-sm);
  font-weight: 500;
  transition:  top 0.1s;
}
.skip-link:focus { top: 0; }

/* Focus ring — visible for keyboard navigation */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline:        3px solid var(--clay);
  outline-offset: 3px;
  border-radius:  var(--radius-sm);
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration:    0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration:   0.01ms !important;
  }
  html { scroll-behavior: auto; }
}


/* ============================================================
   27. PRINT STYLES
   ============================================================ */

@media print {
  .site-header,
  .site-footer,
  .widget-area,
  .dwg-share-row,
  .dwg-sidebar-optin,
  .dwg-review-bottom-cta,
  .sassy-social-share-container,
  .aawp-product.aawp-buybox { display: none !important; }

  body { font-size: 12pt; color: #000; background: #fff; }

  .single-post .content-container,
  .single-post .kadence-content-area-inner {
    display: block;
    max-width: 100%;
    padding:   0;
  }

  h1 { font-size: 24pt; }
  h2 { font-size: 18pt; }
  h3 { font-size: 14pt; }

  a { color: #000; text-decoration: underline; }
  a[href]::after { content: " (" attr(href) ")"; font-size: 9pt; color: #555; }

  img { max-width: 100% !important; }
}


/* ============================================================
   28. RESPONSIVE — TABLET (max-width: 900px)
   ============================================================ */

@media (max-width: 900px) {

  /* Article: stack to single column */
  body.single-post .content-container,
  body.single-post .kadence-content-area-inner {
    grid-template-columns: 1fr;
    gap:                   var(--space-8);
    padding-block:         var(--space-8);
  }

  /* Sidebar below content on tablet */
  .widget-area,
  .kadence-sidebar {
    position: static;
    top:      auto;
  }

  /* Review hero: stack columns */
  .dwg-review-hero-inner {
    grid-template-columns: 1fr;
  }

  /* Silo grid: 2 columns */
  .dwg-silos-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Picks grid: 2 columns */
  .dwg-picks-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  /* Archive grid: 2 columns */
  .archive .kadence-loop-wrapper,
  .archive .post-loop-wrap {
    grid-template-columns: repeat(2, 1fr);
    padding:               var(--space-5);
  }

  /* Footer: 2 columns */
  .footer-widgets-area,
  .dwg-footer-widgets {
    grid-template-columns: 1fr 1fr;
    gap:                   var(--space-6);
  }

  /* Hero: stack columns */
  .dwg-hero {
    grid-template-columns: 1fr;
    min-height:            auto;
  }
  .dwg-hero-left {
    padding: var(--space-10) var(--space-6);
  }

  /* Cost box: single column */
  .dwg-cost-box {
    grid-template-columns: 1fr;
  }
  .dwg-cost-item { border-left: none !important; border-top: 1px solid var(--border); padding: var(--space-4) 0; }
  .dwg-cost-item:first-child { border-top: none; }

  /* Trust bar: wrap */
  .dwg-trust-bar { gap: var(--space-4); padding: var(--space-4); }

  /* Bottom CTA: stack */
  .dwg-bottom-cta-inner { flex-direction: column; align-items: flex-start; }
}


/* ============================================================
   29. RESPONSIVE — MOBILE (max-width: 600px)
   ============================================================ */

@media (max-width: 600px) {

  /* Base */
  body { font-size: 0.9rem; }

  .dwg-container { padding-inline: var(--space-4); }

  /* Headings scale down */
  h1 { font-size: clamp(1.5rem, 7vw, 2.25rem); }
  h2 { font-size: clamp(1.25rem, 5vw, 1.75rem); }

  /* Nav */
  .site-header .site-branding .site-title { font-size: 1.1rem !important; }

  /* Article title */
  .single-post h1.entry-title {
    font-size: clamp(1.5rem, 6vw, 2rem) !important;
  }

  /* Meta bar: tighter */
  .single-post .entry-meta { gap: var(--space-3); }

  /* Silos: 1 column */
  .dwg-silos-grid { grid-template-columns: 1fr; }

  /* Picks: 1 column */
  .dwg-picks-grid { grid-template-columns: 1fr; }

  /* Archive: 1 column */
  .archive .kadence-loop-wrapper,
  .archive .post-loop-wrap {
    grid-template-columns: 1fr;
    padding:               var(--space-4);
    gap:                   var(--space-4);
  }

  /* Pros/cons: stack */
  .dwg-pros-cons {
    grid-template-columns: 1fr;
    gap:                   var(--space-3);
  }

  /* Review hero meta: wrap */
  .dwg-review-meta { gap: var(--space-2); }

  /* Footer: 1 column */
  .footer-widgets-area,
  .dwg-footer-widgets {
    grid-template-columns: 1fr;
    gap:                   var(--space-6);
    padding:               var(--space-8) var(--space-4);
  }
  .footer-bottom { flex-direction: column; gap: var(--space-2); text-align: center; }

  /* Conversion form: stack */
  .dwg-conversion-form {
    flex-direction: column;
    border-radius:  var(--radius-md);
    padding:        var(--space-3);
    gap:            var(--space-2);
  }
  .dwg-conversion-form button,
  .dwg-conversion-form .dwg-btn {
    border-radius: var(--radius-md) !important;
    width:         100%;
  }

  /* Trust bar: hide on mobile to save space */
  .dwg-trust-bar { display: none; }

  /* Comparison table: horizontal scroll */
  .tablepress-table-wrapper { overflow-x: auto; }
  .tablepress { min-width: 540px; }

  /* Bottom CTA: full width button */
  .dwg-cta-btn { width: 100%; text-align: center; }
  .dwg-review-bottom-cta { padding: var(--space-6) 0; }

  /* Author bio: tighter */
  .dwg-author-bio { flex-direction: column; }
  .dwg-author-avatar { width: 48px; height: 48px; }

  /* Hero buttons stack */
  .dwg-hero-btns { flex-direction: column; }
  .dwg-hero-stats { gap: var(--space-5); }
}

/* ════════════════════════════════════════════════════════
   FRESH FROM THE BLOG — Complete CSS
   Target: 3 columns, first card taller, category pill
   ON the image, cards 2+3 shorter with no excerpt
   Confirmed selector: ul.kb-posts
   ════════════════════════════════════════════════════════ */

/* 1. Force 3 equal columns */
.dwg-posts-section ul.kb-posts {
  display:               grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap:                   24px !important;
  list-style:            none !important;
  padding:               0 !important;
  margin:                0 !important;
  align-items:           start !important;
}

/* 2. Each card */
.dwg-posts-section ul.kb-posts li.kb-post {
  list-style:    none !important;
  background:    #ffffff !important;
  border-radius: 16px !important;
  overflow:      hidden !important;
  border:        1px solid #E8E2D8 !important;
  transition:    transform 0.25s, box-shadow 0.25s !important;
  position:      relative !important;
  padding:       0 !important;
  margin:        0 !important;
}
.dwg-posts-section ul.kb-posts li.kb-post:hover {
  transform:  translateY(-3px) !important;
  box-shadow: 0 10px 32px rgba(0,0,0,0.09) !important;
}

/* 3. Image wrapper — position relative for the pill overlay */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-image-link,
.dwg-posts-section ul.kb-posts li.kb-post .post-thumbnail {
  display:  block !important;
  position: relative !important;
  overflow: hidden !important;
  margin:   0 !important;
}

/* 4. All images — consistent height, cover crop */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-image-link img,
.dwg-posts-section ul.kb-posts li.kb-post .post-thumbnail img {
  width:      100% !important;
  height:     200px !important;
  object-fit: cover !important;
  display:    block !important;
  transition: transform 0.4s ease !important;
}
.dwg-posts-section ul.kb-posts li.kb-post:hover .kb-post-image-link img {
  transform: scale(1.03) !important;
}

/* 5. First card image — taller */
.dwg-posts-section ul.kb-posts li.kb-post:first-child .kb-post-image-link img,
.dwg-posts-section ul.kb-posts li.kb-post:first-child .post-thumbnail img {
  height: 300px !important;
}

/* 6. Category pill — positioned ON TOP of the image */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-category,
.dwg-posts-section ul.kb-posts li.kb-post .cat-links {
  position: absolute !important;
  top:      16px !important;
  left:     16px !important;
  z-index:  2 !important;
  margin:   0 !important;
}
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-category a,
.dwg-posts-section ul.kb-posts li.kb-post .cat-links a {
  display:         inline-block !important;
  background:      rgba(255, 255, 255, 0.92) !important;
  color:           #8C5A3F !important;
  font-size:       10px !important;
  font-weight:     600 !important;
  letter-spacing:  1.5px !important;
  text-transform:  uppercase !important;
  padding:         5px 12px !important;
  border-radius:   999px !important;
  text-decoration: none !important;
  backdrop-filter: blur(4px) !important;
}

/* 7. Post body — padding */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-content,
.dwg-posts-section ul.kb-posts li.kb-post .kb-posts-content {
  padding: 18px 20px 20px !important;
}

/* 8. Post title */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-title,
.dwg-posts-section ul.kb-posts li.kb-post h2,
.dwg-posts-section ul.kb-posts li.kb-post h3 {
  margin: 0 0 10px !important;
}
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-title a,
.dwg-posts-section ul.kb-posts li.kb-post h2 a,
.dwg-posts-section ul.kb-posts li.kb-post h3 a {
  font-family:     'Playfair Display', serif !important;
  font-size:       17px !important;
  font-weight:     700 !important;
  color:           #1E1E1E !important;
  line-height:     1.3 !important;
  text-decoration: none !important;
}
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-title a:hover {
  color: #C4896A !important;
}

/* 9. First card — larger title */
.dwg-posts-section ul.kb-posts li.kb-post:first-child .kb-post-title a,
.dwg-posts-section ul.kb-posts li.kb-post:first-child h2 a {
  font-size: 21px !important;
}

/* 10. Excerpt — show on first card, hide on cards 2 and 3 */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-excerpt {
  font-size:   13px !important;
  color:       #666666 !important;
  line-height: 1.65 !important;
  font-weight: 300 !important;
  margin:      0 0 12px !important;
}
.dwg-posts-section ul.kb-posts li.kb-post:not(:first-child) .kb-post-excerpt {
  display: none !important;
}

/* 11. Meta row — read time, date, read more */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-meta,
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-footer {
  display:     flex !important;
  align-items: center !important;
  gap:         6px !important;
  font-size:   12px !important;
  color:       #888888 !important;
  font-weight: 300 !important;
  margin:      0 !important;
  flex-wrap:   wrap !important;
}

/* Dot separator */
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-meta::before,
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-footer span + span::before {
  content:       '•' !important;
  color:         #CCCCCC !important;
  font-size:     10px !important;
}

/* 12. Read more link */
.dwg-posts-section ul.kb-posts li.kb-post .kb-posts-list-read-more a,
.dwg-posts-section ul.kb-posts li.kb-post .more-link,
.dwg-posts-section ul.kb-posts li.kb-post .kb-post-read-more a {
  font-size:       12px !important;
  font-weight:     500 !important;
  color:           #C4896A !important;
  text-decoration: none !important;
  display:         inline-flex !important;
  align-items:     center !important;
  gap:             4px !important;
}
.dwg-posts-section ul.kb-posts li.kb-post .kb-posts-list-read-more a:hover {
  color: #8C5A3F !important;
}

/* 13. Remove Kadence boxed style overrides */
.dwg-posts-section ul.kb-posts.kb-posts-style-boxed li.kb-post {
  padding: 0 !important;
}
.dwg-posts-section ul.kb-posts.kb-posts-style-boxed li.kb-post .kb-post-content {
  padding: 18px 20px 20px !important;
}

/* 14. Tablet — 2 columns */
@media (max-width: 900px) {
  .dwg-posts-section ul.kb-posts {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .dwg-posts-section ul.kb-posts li.kb-post:not(:first-child) .kb-post-excerpt {
    display: block !important;
  }
}

/* 15. Mobile — 1 column */
@media (max-width: 600px) {
  .dwg-posts-section ul.kb-posts {
    grid-template-columns: 1fr !important;
  }
}