/* =========================================================
   SUPERMARKT DIGITAL – EXACT SINGLE POST V4
   Based directly on the supplied original single-page source.
   ========================================================= */


/* =========================================================
   ASTRA CONTENT WRAPPER ONLY
   Header/footer containers are NOT touched.
   ========================================================= */

body.single-post {
  margin: 0 !important;
  background: #FAF7F2 !important;
}

body.single-post #content,
body.single-post .site-content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #FAF7F2 !important;
}

body.single-post #content > .ast-container,
body.single-post .site-content > .ast-container {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.single-post #secondary {
  display: none !important;
}


/* =========================================================
   ROOT
   ========================================================= */

#smd-single-post-v4.smd-single-post-v4 {
  --smd-v4-brand-50: #FFF3EC;
  --smd-v4-brand-100: #FFE2D2;
  --smd-v4-brand-200: #FFC4A3;
  --smd-v4-brand-300: #FF9A5A;
  --smd-v4-brand-400: #FF7A3C;
  --smd-v4-brand-500: #FF4D00;
  --smd-v4-brand-600: #E85A1C;
  --smd-v4-navy: #101828;
  --smd-v4-cream: #FAF7F2;
  --smd-v4-sand: #EDE3D8;

  position: relative !important;
  isolation: isolate !important;

  display: block !important;

  width: 100% !important;
  max-width: none !important;

  min-height: 100vh !important;

  margin: 0 !important;
  padding: 0 !important;

  overflow: visible !important;

  background: var(--smd-v4-cream) !important;
  color: var(--smd-v4-navy) !important;

  font-family:
    "DM Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 16px !important;
  line-height: 1.5 !important;

  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;

  box-sizing: border-box !important;
}

#smd-single-post-v4.smd-single-post-v4 *,
#smd-single-post-v4.smd-single-post-v4 *::before,
#smd-single-post-v4.smd-single-post-v4 *::after {
  box-sizing: border-box !important;
}

#smd-single-post-v4.smd-single-post-v4 h1,
#smd-single-post-v4.smd-single-post-v4 h2,
#smd-single-post-v4.smd-single-post-v4 h3,
#smd-single-post-v4.smd-single-post-v4 h4,
#smd-single-post-v4.smd-single-post-v4 p,
#smd-single-post-v4.smd-single-post-v4 figure,
#smd-single-post-v4.smd-single-post-v4 blockquote,
#smd-single-post-v4.smd-single-post-v4 ul,
#smd-single-post-v4.smd-single-post-v4 ol {
  margin: 0 !important;
  padding: 0 !important;
}

#smd-single-post-v4.smd-single-post-v4 ul,
#smd-single-post-v4.smd-single-post-v4 ol {
  list-style: none !important;
}

#smd-single-post-v4.smd-single-post-v4 img {
  max-width: 100% !important;
}

#smd-single-post-v4.smd-single-post-v4 a {
  text-decoration: none !important;
}

#smd-single-post-v4.smd-single-post-v4 button {
  font-family:
    "DM Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;
}


/* =========================================================
   GLOBAL SOURCE REVEAL
   Exact original:
   opacity 0, translateY(24px), 700ms cubic-bezier.
   ========================================================= */

#smd-single-post-v4 .smd-reveal {
  opacity: 0 !important;
  transform: translateY(24px) !important;
  will-change: opacity, transform !important;

  transition:
    opacity .7s cubic-bezier(.16,1,.3,1),
    transform .7s cubic-bezier(.16,1,.3,1) !important;
}

#smd-single-post-v4 .smd-reveal.is-visible {
  opacity: 1 !important;
  transform: none !important;
}


/* =========================================================
   SOURCE CONTAINERS
   max-w-6xl = 72rem = 1152px
   max-w-7xl = 80rem = 1280px
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__section-padding {
  width: 100% !important;
  margin: 0 !important;
  padding-right: 20px !important;
  padding-left: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__container {
  width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
}

#smd-single-post-v4 .smd-single-post-v4__container--article {
  max-width: 1152px !important;
}

#smd-single-post-v4 .smd-single-post-v4__container--wide {
  max-width: 1280px !important;
}


/* =========================================================
   READING PROGRESS
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__progress {
  position: fixed !important;
  z-index: 60 !important;

  top: 0 !important;
  right: 0 !important;
  left: 0 !important;

  height: 4px !important;

  background: transparent !important;

  pointer-events: none !important;
}

#smd-single-post-v4 .smd-single-post-v4__progress-bar {
  display: block !important;

  width: 0;
  height: 100% !important;

  background:
    linear-gradient(
      to right,
      var(--smd-v4-brand-500),
      var(--smd-v4-brand-300)
    ) !important;

  transition: width 150ms !important;
}

body.admin-bar #smd-single-post-v4 .smd-single-post-v4__progress {
  top: 32px !important;
}


/* =========================================================
   HERO
   original: pt-28 pb-8, sm:pt-32
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__hero {
  position: relative !important;

  width: 100% !important;

  margin: 0 !important;
  padding-top: var(--smd-v4-hero-top, 40px) !important;
  padding-bottom: 32px !important;

  overflow: hidden !important;

  background: transparent !important;
}

#smd-single-post-v4 .smd-single-post-v4__hero-background {
  position: absolute !important;
  z-index: -1 !important;

  inset: 0 !important;

  pointer-events: none !important;
}

#smd-single-post-v4 .smd-single-post-v4__hero-glow {
  position: absolute !important;

  top: -96px !important;
  right: -8% !important;

  width: 420px !important;
  height: 420px !important;

  border-radius: 9999px !important;

  background: rgba(255, 196, 163, .40) !important;

  filter: blur(64px) !important;
}


/* Breadcrumb */

#smd-single-post-v4 .smd-single-post-v4__breadcrumb {
  display: flex !important;

  align-items: center !important;

  gap: 8px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;
  font-weight: 400 !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__breadcrumb-link {
  display: inline-flex !important;

  align-items: center !important;

  gap: 4px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;
  font-weight: 400 !important;

  line-height: 20px !important;

  transition: color .15s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__breadcrumb-link:hover {
  color: var(--smd-v4-navy) !important;
}

#smd-single-post-v4 .smd-single-post-v4__breadcrumb-link svg {
  display: block !important;

  width: 16px !important;
  height: 16px !important;

  flex: 0 0 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__breadcrumb-current {
  color: var(--smd-v4-navy) !important;
  font-weight: 500 !important;
}


/* Meta */

#smd-single-post-v4 .smd-single-post-v4__meta {
  display: flex !important;

  flex-wrap: wrap !important;

  align-items: center !important;

  gap: 12px !important;

  margin-top: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__category {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  padding: 4px 12px !important;

  border-radius: 9999px !important;

  font-size: 12px !important;
  font-weight: 600 !important;

  line-height: 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__category--gradient {
  background:
    linear-gradient(
      to right,
      var(--smd-v4-brand-500),
      var(--smd-v4-brand-300)
    ) !important;

  color: #FFFFFF !important;
}

#smd-single-post-v4 .smd-single-post-v4__category--soft {
  align-self: flex-start !important;

  background: var(--smd-v4-brand-50) !important;
  color: var(--smd-v4-brand-600) !important;
}

#smd-single-post-v4 .smd-single-post-v4__meta-item {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;
  font-weight: 400 !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__meta-item svg {
  display: block !important;

  width: 16px !important;
  height: 16px !important;

  flex: 0 0 16px !important;
}


/* H1 */

#smd-single-post-v4 .smd-single-post-v4__title {
  width: 100% !important;
  max-width: 768px !important;

  margin-top: 16px !important;

  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 30px !important;
  font-weight: 800 !important;

  line-height: 1.12 !important;

  letter-spacing: -.025em !important;

  text-transform: none !important;
}


/* Author */

#smd-single-post-v4 .smd-single-post-v4__author {
  display: flex !important;

  align-items: center !important;

  gap: 12px !important;

  margin-top: 24px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-avatar {
  display: block !important;

  width: 44px !important;
  height: 44px !important;

  flex: 0 0 44px !important;

  overflow: hidden !important;

  border-radius: 9999px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-image,
#smd-single-post-v4 .smd-single-post-v4__author-avatar img {
  display: block !important;

  width: 44px !important;
  height: 44px !important;

  margin: 0 !important;

  border: 0 !important;
  border-radius: 9999px !important;

  object-fit: cover !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-copy {
  display: block !important;

  font-size: 14px !important;
  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-name {
  display: block !important;

  color: var(--smd-v4-navy) !important;

  font-size: 14px !important;
  font-weight: 600 !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-role {
  display: block !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;
  font-weight: 400 !important;

  line-height: 20px !important;
}


/* =========================================================
   FEATURED IMAGE
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__featured-section {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
}

#smd-single-post-v4 .smd-single-post-v4__featured {
  width: 100% !important;
  aspect-ratio: 16 / 9 !important;

  overflow: hidden !important;

  border-radius: 32px !important;

  box-shadow:
    0 1px 2px rgba(16, 24, 40, .04),
    0 12px 32px -12px rgba(16, 24, 40, .12) !important;
}

#smd-single-post-v4 .smd-single-post-v4__featured-image {
  display: block !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  object-fit: cover !important;
}


/* =========================================================
   ARTICLE GRID
   original py-12 sm:py-16, gap-12,
   lg: [minmax(0,1fr) 260px]
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__article-section {
  width: 100% !important;

  margin: 0 !important;
  padding-top: 48px !important;
  padding-bottom: 48px !important;

  background: transparent !important;
}

#smd-single-post-v4 .smd-single-post-v4__article-grid {
  display: grid !important;

  grid-template-columns: minmax(0, 1fr) !important;

  gap: 48px !important;

  align-items: start !important;
}

#smd-single-post-v4 .smd-single-post-v4__article {
  width: 100% !important;
  max-width: 68ch !important;

  min-width: 0 !important;
}


/* =========================================================
   ARTICLE SOURCE BLOCK FLOW
   original: flex flex-col gap-7
   ========================================================= */

#smd-single-post-v4 .smd-post-v4__flow {
  display: flex !important;

  flex-direction: column !important;

  gap: 28px !important;

  width: 100% !important;
}


/* Lead */

#smd-single-post-v4 .smd-post-v4__lead {
  color: rgba(16, 24, 40, .80) !important;

  font-family:
    "DM Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 20px !important;
  font-weight: 400 !important;

  line-height: 1.625 !important;
}

#smd-single-post-v4 .smd-post-v4__lead::first-letter {
  float: left !important;

  margin-right: 12px !important;

  color: var(--smd-v4-brand-500) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 60px !important;
  font-weight: 800 !important;

  line-height: .8 !important;
}


/* Paragraph */

#smd-single-post-v4 .smd-post-v4__paragraph {
  color: rgba(16, 24, 40, .75) !important;

  font-family:
    "DM Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 17px !important;
  font-weight: 400 !important;

  line-height: 1.85 !important;
}

#smd-single-post-v4 .smd-post-v4__lead strong,
#smd-single-post-v4 .smd-post-v4__paragraph strong,
#smd-single-post-v4 .smd-post-v4__ul strong,
#smd-single-post-v4 .smd-post-v4__ol strong {
  color: var(--smd-v4-navy) !important;
  font-weight: 600 !important;
}

#smd-single-post-v4 .smd-post-v4__lead a,
#smd-single-post-v4 .smd-post-v4__paragraph a,
#smd-single-post-v4 .smd-post-v4__ul a,
#smd-single-post-v4 .smd-post-v4__ol a {
  color: var(--smd-v4-brand-600) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}


/* H2 / H3 */

#smd-single-post-v4 .smd-post-v4__h2 {
  scroll-margin-top: 112px !important;

  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 24px !important;
  font-weight: 800 !important;

  line-height: 32px !important;

  letter-spacing: -.025em !important;
}

#smd-single-post-v4 .smd-post-v4__h3 {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 20px !important;
  font-weight: 700 !important;

  line-height: 28px !important;
}

#smd-single-post-v4 .smd-post-v4__generic-heading {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-weight: 700 !important;
}


/* UL exact source */

#smd-single-post-v4 .smd-post-v4__ul {
  display: flex !important;

  flex-direction: column !important;

  gap: 12px !important;
}

#smd-single-post-v4 .smd-post-v4__ul-item {
  display: flex !important;

  gap: 12px !important;

  color: rgba(16, 24, 40, .75) !important;

  font-size: 17px !important;

  line-height: 1.625 !important;
}

#smd-single-post-v4 .smd-post-v4__bullet {
  width: 6px !important;
  height: 6px !important;

  flex: 0 0 6px !important;

  margin-top: 10px !important;

  border-radius: 9999px !important;

  background: var(--smd-v4-brand-500) !important;
}


/* OL exact source */

#smd-single-post-v4 .smd-post-v4__ol {
  display: flex !important;

  flex-direction: column !important;

  gap: 12px !important;
}

#smd-single-post-v4 .smd-post-v4__ol-item {
  display: flex !important;

  gap: 12px !important;

  color: rgba(16, 24, 40, .75) !important;

  font-size: 17px !important;

  line-height: 1.625 !important;
}

#smd-single-post-v4 .smd-post-v4__number {
  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  width: 28px !important;
  height: 28px !important;

  flex: 0 0 28px !important;

  border-radius: 9999px !important;

  background: var(--smd-v4-brand-50) !important;

  color: var(--smd-v4-brand-600) !important;

  font-size: 14px !important;
  font-weight: 700 !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-post-v4__ol-copy {
  padding-top: 2px !important;
}


/* Quote exact source */

#smd-single-post-v4 .smd-post-v4__quote {
  position: relative !important;

  padding: 28px !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 24px !important;

  background: rgba(250, 247, 242, .60) !important;
}

#smd-single-post-v4 .smd-post-v4__quote-icon {
  position: absolute !important;

  top: -12px !important;
  left: 28px !important;

  width: 28px !important;
  height: 28px !important;

  padding: 6px !important;

  border-radius: 9999px !important;

  background: var(--smd-v4-brand-500) !important;
  color: #FFFFFF !important;
}

#smd-single-post-v4 .smd-post-v4__quote-text {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 20px !important;
  font-weight: 600 !important;

  line-height: 1.375 !important;
}

#smd-single-post-v4 .smd-post-v4__quote-cite {
  display: block !important;

  margin-top: 12px !important;

  color: rgba(16, 24, 40, .55) !important;

  font-size: 14px !important;
  font-style: normal !important;

  line-height: 20px !important;
}


/* Callout exact source */

#smd-single-post-v4 .smd-post-v4__callout {
  display: flex !important;

  gap: 16px !important;

  padding: 24px !important;

  border: 1px solid var(--smd-v4-brand-200) !important;
  border-radius: 24px !important;

  background: rgba(255, 243, 236, .60) !important;
}

#smd-single-post-v4 .smd-post-v4__callout-icon {
  width: 24px !important;
  height: 24px !important;

  flex: 0 0 24px !important;

  color: var(--smd-v4-brand-500) !important;
}

#smd-single-post-v4 .smd-post-v4__callout-title {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-weight: 700 !important;
}

#smd-single-post-v4 .smd-post-v4__callout-text {
  margin-top: 4px !important;

  color: rgba(16, 24, 40, .70) !important;

  font-size: 17px !important;

  line-height: 1.625 !important;
}


/* Stats exact source */

#smd-single-post-v4 .smd-post-v4__stats {
  display: grid !important;

  grid-template-columns: 1fr !important;

  gap: 16px !important;

  padding: 8px !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 24px !important;

  background: #FFFFFF !important;

  box-shadow:
    0 1px 2px rgba(16, 24, 40, .04),
    0 12px 32px -12px rgba(16, 24, 40, .12) !important;
}

#smd-single-post-v4 .smd-post-v4__stat {
  padding: 20px !important;

  border-radius: 16px !important;

  text-align: center !important;
}

#smd-single-post-v4 .smd-post-v4__stat-value {
  background:
    linear-gradient(
      135deg,
      var(--smd-v4-brand-500),
      var(--smd-v4-brand-300)
    ) !important;

  color: transparent !important;

  -webkit-background-clip: text !important;
  background-clip: text !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 30px !important;
  font-weight: 800 !important;

  line-height: 36px !important;
}

#smd-single-post-v4 .smd-post-v4__stat-label {
  margin-top: 8px !important;

  color: rgba(16, 24, 40, .60) !important;

  font-size: 14px !important;

  line-height: 1.375 !important;
}


/* Content image exact source */

#smd-single-post-v4 .smd-post-v4__image-figure,
#smd-single-post-v4 .wp-block-image {
  width: 100% !important;
}

#smd-single-post-v4 .smd-post-v4__content-image,
#smd-single-post-v4 .wp-block-image img {
  display: block !important;

  width: 100% !important;
  height: auto !important;

  border: 0 !important;
  border-radius: 24px !important;

  object-fit: cover !important;
}

#smd-single-post-v4 .wp-element-caption,
#smd-single-post-v4 figcaption {
  margin-top: 8px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;

  line-height: 20px !important;

  text-align: center !important;
}


/* CTA exact source */

#smd-single-post-v4 .smd-post-v4__cta {
  position: relative !important;

  padding: 28px !important;

  overflow: hidden !important;

  border-radius: 24px !important;

  background: var(--smd-v4-navy) !important;

  color: #FFFFFF !important;
}

#smd-single-post-v4 .smd-post-v4__cta-glow {
  position: absolute !important;

  top: -48px !important;
  right: -48px !important;

  width: 176px !important;
  height: 176px !important;

  border-radius: 9999px !important;

  background: rgba(255, 77, 0, .30) !important;

  filter: blur(64px) !important;

  pointer-events: none !important;
}

#smd-single-post-v4 .smd-post-v4__cta-title {
  position: relative !important;

  color: #FFFFFF !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 20px !important;
  font-weight: 800 !important;

  line-height: 28px !important;
}

#smd-single-post-v4 .smd-post-v4__cta-text {
  position: relative !important;

  margin-top: 8px !important;

  color: rgba(255, 255, 255, .75) !important;

  font-size: 16px !important;

  line-height: 24px !important;
}

#smd-single-post-v4 .smd-post-v4__cta-button {
  position: relative !important;

  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  gap: 8px !important;

  margin-top: 20px !important;

  padding: 14px 28px !important;

  border-radius: 9999px !important;

  background:
    linear-gradient(
      to right,
      var(--smd-v4-brand-500),
      var(--smd-v4-brand-300)
    ) !important;

  color: #FFFFFF !important;

  box-shadow:
    0 8px 24px -8px
    rgba(255, 77, 0, .50) !important;

  font-size: 16px !important;
  font-weight: 600 !important;

  line-height: 24px !important;

  transition:
    transform .2s ease,
    box-shadow .2s ease !important;
}

#smd-single-post-v4 .smd-post-v4__cta-button:hover {
  color: #FFFFFF !important;

  transform: translateY(-2px) !important;

  box-shadow:
    0 12px 32px -8px
    rgba(255, 77, 0, .60) !important;
}

#smd-single-post-v4 .smd-post-v4__cta-button svg {
  width: 16px !important;
  height: 16px !important;
}


/* Generic Gutenberg media */

#smd-single-post-v4 .smd-post-v4__media-block iframe,
#smd-single-post-v4 .smd-post-v4__media-block video {
  max-width: 100% !important;
}

#smd-single-post-v4 .smd-post-v4__media-block .wp-block-gallery {
  margin: 0 !important;
}


/* =========================================================
   FAQ
   exact source: mt-14, title, mt-6 white rounded-3xl list
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__faq {
  margin-top: 56px !important;
}

#smd-single-post-v4 .smd-single-post-v4__faq-title {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 24px !important;
  font-weight: 800 !important;

  line-height: 32px !important;

  letter-spacing: -.025em !important;
}

#smd-single-post-v4 .smd-single-post-v4__faq-list {
  margin-top: 24px !important;

  overflow: hidden !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 24px !important;

  background: #FFFFFF !important;
}

#smd-single-post-v4 .smd-post-v4__faq-item {
  margin: 0 !important;
  padding: 24px !important;

  border: 0 !important;
  border-bottom: 1px solid var(--smd-v4-sand) !important;

  background: #FFFFFF !important;
}

#smd-single-post-v4 .smd-post-v4__faq-item:last-child {
  border-bottom: 0 !important;
}

#smd-single-post-v4 .smd-post-v4__faq-question {
  display: flex !important;

  align-items: center !important;
  justify-content: space-between !important;

  gap: 16px !important;

  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 16px !important;
  font-weight: 700 !important;

  line-height: 24px !important;

  cursor: pointer !important;

  list-style: none !important;
}

#smd-single-post-v4 .smd-post-v4__faq-question::-webkit-details-marker {
  display: none !important;
}

/* V4.1 FAQ text hardening. The imported question lives as the direct text node
   of summary. These rules prevent Astra/Elementor summary/link styling from
   changing its visibility, opacity, decoration, or text transform. */
#smd-single-post-v4 summary.smd-post-v4__faq-question {
  visibility: visible !important;
  opacity: 1 !important;
  -webkit-text-fill-color: var(--smd-v4-navy) !important;
  text-shadow: none !important;
  text-transform: none !important;
  text-decoration: none !important;
}

#smd-single-post-v4 summary.smd-post-v4__faq-question::marker {
  content: "" !important;
  font-size: 0 !important;
}

#smd-single-post-v4 .smd-post-v4__faq-plus {
  color: var(--smd-v4-brand-500) !important;

  font-family:
    "DM Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 20px !important;
  font-weight: 400 !important;

  line-height: 1 !important;

  transition: transform .15s ease !important;
}

#smd-single-post-v4 .smd-post-v4__faq-item[open]
  .smd-post-v4__faq-plus {
  transform: rotate(45deg) !important;
}

#smd-single-post-v4 .smd-post-v4__faq-answer {
  margin-top: 12px !important;

  color: rgba(16, 24, 40, .70) !important;

  font-size: 16px !important;

  line-height: 1.625 !important;
}

#smd-single-post-v4 .smd-post-v4__faq-answer p {
  margin: 0 !important;

  color: inherit !important;

  font-size: inherit !important;

  line-height: inherit !important;
}


/* =========================================================
   TAGS + SHARE
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__post-footer {
  display: flex !important;

  flex-direction: column !important;

  gap: 20px !important;

  margin-top: 48px !important;
  padding-top: 32px !important;

  border-top: 1px solid var(--smd-v4-sand) !important;
}

#smd-single-post-v4 .smd-single-post-v4__tags {
  display: flex !important;

  flex-wrap: wrap !important;

  gap: 8px !important;
}

#smd-single-post-v4 .smd-single-post-v4__tag {
  display: inline-flex !important;

  align-items: center !important;

  padding: 4px 12px !important;

  border-radius: 9999px !important;

  background: var(--smd-v4-cream) !important;

  color: rgba(16, 24, 40, .60) !important;

  font-size: 12px !important;
  font-weight: 500 !important;

  line-height: 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__share {
  display: flex !important;

  align-items: center !important;

  gap: 8px !important;
}

#smd-single-post-v4 .smd-single-post-v4__share-label {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 14px !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__share-label svg {
  width: 16px !important;
  height: 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__copy {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  min-height: 38px !important;

  margin: 0 !important;
  padding: 8px 14px !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 9999px !important;

  background: #FFFFFF !important;

  color: rgba(16, 24, 40, .70) !important;

  box-shadow: none !important;

  font-size: 14px !important;
  font-weight: 600 !important;

  line-height: 20px !important;

  cursor: pointer !important;

  transition:
    border-color .15s ease,
    color .15s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__copy:hover {
  border-color: var(--smd-v4-brand-300) !important;
  color: var(--smd-v4-navy) !important;
}

#smd-single-post-v4 .smd-single-post-v4__copy > span {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;
}

#smd-single-post-v4 .smd-single-post-v4__copy svg {
  width: 16px !important;
  height: 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__copy-check {
  color: var(--smd-v4-brand-600) !important;
}


/* =========================================================
   AUTHOR CARD
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__author-card {
  display: flex !important;

  align-items: center !important;

  gap: 16px !important;

  margin-top: 32px !important;
  padding: 24px !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 24px !important;

  background: rgba(250, 247, 242, .50) !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-card-avatar {
  width: 56px !important;
  height: 56px !important;

  flex: 0 0 56px !important;

  overflow: hidden !important;

  border-radius: 9999px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-card-image,
#smd-single-post-v4 .smd-single-post-v4__author-card-avatar img {
  display: block !important;

  width: 56px !important;
  height: 56px !important;

  margin: 0 !important;

  border: 0 !important;
  border-radius: 9999px !important;

  object-fit: cover !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-card-label {
  color: var(--smd-v4-brand-600) !important;

  font-size: 12px !important;
  font-weight: 700 !important;

  line-height: 16px !important;

  letter-spacing: .05em !important;

  text-transform: uppercase !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-card-name {
  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 18px !important;
  font-weight: 700 !important;

  line-height: 28px !important;
}

#smd-single-post-v4 .smd-single-post-v4__author-card-role {
  color: rgba(16, 24, 40, .55) !important;

  font-size: 14px !important;

  line-height: 20px !important;
}


/* =========================================================
   STICKY TABLE OF CONTENTS
   Source has no active-section decoration; only hover.
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__toc {
  display: none !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-sticky {
  position: sticky !important;

  top: 112px !important;
}

body.admin-bar #smd-single-post-v4 .smd-single-post-v4__toc-sticky {
  top: 144px !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-title {
  display: flex !important;

  align-items: center !important;

  gap: 8px !important;

  color: rgba(16, 24, 40, .50) !important;

  font-size: 12px !important;
  font-weight: 700 !important;

  line-height: 16px !important;

  letter-spacing: .05em !important;

  text-transform: uppercase !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-title svg {
  width: 16px !important;
  height: 16px !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-nav {
  display: flex !important;

  flex-direction: column !important;

  gap: 10px !important;

  margin-top: 16px !important;
  padding-left: 16px !important;

  border-left: 1px solid var(--smd-v4-sand) !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-link {
  color: rgba(16, 24, 40, .55) !important;

  font-size: 14px !important;

  line-height: 1.375 !important;

  transition: color .15s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-link:hover {
  color: var(--smd-v4-brand-600) !important;
}


/* =========================================================
   RELATED POSTS
   source: border-t, py-16 sm:py-20, max-w-7xl
   ========================================================= */

#smd-single-post-v4 .smd-single-post-v4__related-section {
  width: 100% !important;

  margin: 0 !important;
  padding-top: 64px !important;
  padding-bottom: 64px !important;

  border-top: 1px solid var(--smd-v4-sand) !important;

  background: transparent !important;
}

#smd-single-post-v4 .smd-single-post-v4__eyebrow {
  display: inline-flex !important;

  align-items: center !important;

  gap: 8px !important;

  color: var(--smd-v4-brand-600) !important;

  font-size: 12px !important;
  font-weight: 700 !important;

  line-height: 16px !important;

  letter-spacing: .18em !important;

  text-transform: uppercase !important;
}

#smd-single-post-v4 .smd-single-post-v4__eyebrow > span {
  display: block !important;

  width: 24px !important;
  height: 1px !important;

  background: var(--smd-v4-brand-500) !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-title {
  margin-top: 12px !important;

  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 24px !important;
  font-weight: 800 !important;

  line-height: 32px !important;

  letter-spacing: -.025em !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-grid {
  display: grid !important;

  grid-template-columns: 1fr !important;

  gap: 24px !important;

  margin-top: 40px !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-item {
  height: 100% !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card {
  display: flex !important;

  flex-direction: column !important;

  height: 100% !important;

  overflow: hidden !important;

  border: 1px solid var(--smd-v4-sand) !important;
  border-radius: 24px !important;

  background: #FFFFFF !important;

  box-shadow:
    0 1px 2px rgba(16, 24, 40, .04),
    0 12px 32px -12px rgba(16, 24, 40, .12) !important;

  transition:
    transform .3s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card:hover {
  transform: translateY(-4px) !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-media {
  display: block !important;

  width: 100% !important;
  aspect-ratio: 16 / 10 !important;

  overflow: hidden !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-image {
  display: block !important;

  width: 100% !important;
  height: 100% !important;

  margin: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  object-fit: cover !important;

  transition:
    transform .5s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card:hover
  .smd-single-post-v4__related-image {
  transform: scale(1.05) !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-body {
  display: flex !important;

  flex: 1 1 auto !important;
  flex-direction: column !important;

  padding: 24px !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card-title {
  flex: 1 1 auto !important;

  margin-top: 12px !important;

  color: var(--smd-v4-navy) !important;

  font-family:
    "Plus Jakarta Sans",
    ui-sans-serif,
    system-ui,
    sans-serif !important;

  font-size: 16px !important;
  font-weight: 700 !important;

  line-height: 1.375 !important;

  transition: color .15s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card:hover
  .smd-single-post-v4__related-card-title {
  color: var(--smd-v4-brand-600) !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-more {
  display: inline-flex !important;

  align-items: center !important;

  gap: 6px !important;

  margin-top: 16px !important;

  color: var(--smd-v4-brand-600) !important;

  font-size: 14px !important;
  font-weight: 600 !important;

  line-height: 20px !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-more svg {
  width: 16px !important;
  height: 16px !important;

  transition: transform .15s ease !important;
}

#smd-single-post-v4 .smd-single-post-v4__related-card:hover
  .smd-single-post-v4__related-more svg {
  transform: translate(.5px, -.5px) !important;
}


/* =========================================================
   RESPONSIVE – mirrors source breakpoints
   ========================================================= */

@media (min-width: 640px) {

  #smd-single-post-v4 .smd-single-post-v4__section-padding {
    padding-right: 24px !important;
    padding-left: 24px !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__hero {
    padding-top: var(--smd-v4-hero-top, 56px) !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__title {
    font-size: 43.2px !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__article-section {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  #smd-single-post-v4 .smd-post-v4__h2,
  #smd-single-post-v4 .smd-single-post-v4__faq-title,
  #smd-single-post-v4 .smd-single-post-v4__related-title {
    font-size: 30px !important;
    line-height: 36px !important;
  }

  #smd-single-post-v4 .smd-post-v4__quote {
    padding: 32px !important;
  }

  #smd-single-post-v4 .smd-post-v4__stats {
    grid-template-columns:
      repeat(3, minmax(0, 1fr)) !important;
  }

  #smd-single-post-v4 .smd-post-v4__cta {
    padding: 36px !important;
  }

  #smd-single-post-v4 .smd-post-v4__cta-title {
    font-size: 24px !important;
    line-height: 32px !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__post-footer {
    flex-direction: row !important;

    align-items: center !important;
    justify-content: space-between !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__related-section {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
  }
}


@media (min-width: 768px) {

  #smd-single-post-v4 .smd-single-post-v4__related-grid {
    grid-template-columns:
      repeat(3, minmax(0, 1fr)) !important;
  }

}


@media (min-width: 1024px) {

  #smd-single-post-v4 .smd-single-post-v4__article-grid {
    grid-template-columns:
      minmax(0, 1fr)
      260px !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__toc {
    display: block !important;
  }

}


/* WordPress admin bar on mobile */
@media (max-width: 782px) {

  body.admin-bar #smd-single-post-v4
    .smd-single-post-v4__progress {
    top: 46px !important;
  }

}


/* =========================================================
   ACCESSIBILITY / MOTION
   ========================================================= */

#smd-single-post-v4 a:focus-visible,
#smd-single-post-v4 button:focus-visible,
#smd-single-post-v4 summary:focus-visible {
  outline:
    2px solid
    var(--smd-v4-brand-500) !important;

  outline-offset: 2px !important;
}

@media (prefers-reduced-motion: reduce) {

  #smd-single-post-v4 .smd-reveal {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  #smd-single-post-v4 .smd-single-post-v4__progress-bar,
  #smd-single-post-v4 .smd-post-v4__faq-plus,
  #smd-single-post-v4 .smd-post-v4__cta-button,
  #smd-single-post-v4 .smd-single-post-v4__related-card,
  #smd-single-post-v4 .smd-single-post-v4__related-image,
  #smd-single-post-v4 .smd-single-post-v4__related-more svg {
    transition: none !important;
  }

}

/* V4: sticky TOC requires every ancestor in the article path to remain visible. */
body.single-post #content,
body.single-post .site-content,
body.single-post #content > .ast-container,
body.single-post .site-content > .ast-container {
  overflow: visible !important;
}


/* =========================================================
   V4 EXACT WORDPRESS HEADER OFFSET + STICKY TOC HARDENING
   Original source header is fixed. The WordPress header on this site occupies
   normal document flow, so the hero top padding must subtract its height.
   JavaScript refines --smd-v4-hero-top from the real header height.
   ========================================================= */

#smd-single-post-v4.smd-single-post-v4 {
  --smd-v4-hero-top: 40px;
}

#smd-single-post-v4 .smd-single-post-v4__article-section,
#smd-single-post-v4 .smd-single-post-v4__article-section > .smd-single-post-v4__section-padding,
#smd-single-post-v4 .smd-single-post-v4__article-section .smd-single-post-v4__container,
#smd-single-post-v4 .smd-single-post-v4__article-grid {
  overflow: visible !important;
}

#smd-single-post-v4 .smd-single-post-v4__article-grid {
  position: relative !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc {
  position: relative !important;
  align-self: stretch !important;
  min-height: 100% !important;
  overflow: visible !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-sticky {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 112px !important;
  width: 100% !important;
  height: max-content !important;
  max-height: calc(100vh - 136px) !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-width: none !important;
}

#smd-single-post-v4 .smd-single-post-v4__toc-sticky::-webkit-scrollbar {
  display: none !important;
}

body.admin-bar #smd-single-post-v4 .smd-single-post-v4__toc-sticky {
  top: 144px !important;
  max-height: calc(100vh - 168px) !important;
}

@media (min-width: 640px) {
  #smd-single-post-v4.smd-single-post-v4 {
    --smd-v4-hero-top: 56px;
  }
}

@media (max-width: 782px) {
  body.admin-bar #smd-single-post-v4 .smd-single-post-v4__toc-sticky {
    top: 158px !important;
  }
}