/*
 * Standard Post layout consistency.
 *
 * Standard Posts use a small set of centered content rails. Body copy and
 * compact semantic components use the reading rail. Media, true two-column
 * layouts and selected editorial components may use the wider rail. Text stays
 * left aligned inside those centered containers.
 */

:root {
  --isp-post-width-reading: var(--isp-article-width-reading, 820px);
  --isp-post-width-wide: var(--isp-article-width-wide, 960px);
  --isp-post-width-discovery: var(--isp-article-width-discovery, 1120px);
}

/* Main article canvas and hero rail. */
.single-post-layout .entry-content {
  width: 100%;
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-breadcrumbs,
.single-post-layout .single-entry-header,
.single-post-layout .entry-featured-image {
  width: min(calc(100% - 40px), var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

/* Standard Gutenberg reading content. */
.single-post-layout .entry-content > p,
.single-post-layout .entry-content > ul,
.single-post-layout .entry-content > ol,
.single-post-layout .entry-content > h2,
.single-post-layout .entry-content > h3,
.single-post-layout .entry-content > h4,
.single-post-layout .entry-content > h5,
.single-post-layout .entry-content > h6,
.single-post-layout .entry-content > blockquote,
.single-post-layout .entry-content > pre,
.single-post-layout .entry-content > table,
.single-post-layout .entry-content > .wp-block-quote,
.single-post-layout .entry-content > .wp-block-list,
.single-post-layout .entry-content > .wp-block-table,
.single-post-layout .entry-content > .wp-block-code,
.single-post-layout .entry-content > .wp-block-pullquote,
.single-post-layout .entry-content > .wp-block-details,
.single-post-layout .entry-content > .wp-block-buttons,
.single-post-layout .entry-content > .wp-block-separator,
.single-post-layout .entry-content > .wp-block-embed,
.single-post-layout .entry-content > .wp-block-gallery,
.single-post-layout .entry-content > .wp-block-media-text:not(.alignwide):not(.alignfull),
.single-post-layout .entry-content > .wp-block-columns:not(.alignwide):not(.alignfull),
.single-post-layout .entry-content > .wp-block-image:not(.alignwide):not(.alignfull) {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .entry-content > .alignwide {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

/* Compact semantic components share the reading rail. */
.single-post-layout .entry-content .isp-quick-action,
.single-post-layout .entry-content .isp-safety,
.single-post-layout .entry-content .isp-callout,
.single-post-layout .entry-content .isp-faq,
.single-post-layout .entry-content .wp-block-rank-math-toc-block,
.single-post-layout .entry-content .wp-block-rank-math-toc,
.single-post-layout .entry-content .rank-math-block,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .entry-content .isp-quick-action__header,
.single-post-layout .entry-content .isp-quick-action__title,
.single-post-layout .entry-content .isp-quick-action__content,
.single-post-layout .entry-content .isp-safety__header,
.single-post-layout .entry-content .isp-safety__title,
.single-post-layout .entry-content .isp-safety__content {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Legacy note styles follow the same centered reading rail. */
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note {
  padding: var(--isp-article-padding-callout, clamp(1.25rem, 2.5vw, 1.5rem));
  border: 1px solid var(--isp-article-color-border-strong, #dfe3e6);
  border-left-width: 3px;
  border-radius: var(--isp-article-radius-callout, 16px);
  box-shadow: none;
  color: var(--isp-article-color-body, #4f4c4e);
}

.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue {
  border-left-color: var(--isp-article-color-link, #2378aa) !important;
  background: color-mix(in srgb, var(--isp-article-color-link, #2378aa) 3.5%, #fff) !important;
  background-color: var(--isp-article-color-surface-soft, #f7fbfd) !important;
}

.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note {
  border-left-color: var(--isp-accent, #ebbf7a) !important;
  background: color-mix(in srgb, var(--isp-accent, #ebbf7a) 7%, #fff) !important;
}

.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink > *,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue > *,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note > * {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink > :first-child,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue > :first-child,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note > :first-child {
  margin-top: 0;
}

.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink > :last-child,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue > :last-child,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note > :last-child {
  margin-bottom: 0;
}

/*
 * Structured Sections use a wide shell but one stable reading axis. The header,
 * metadata and stacked content align to 820px. Only media and genuine two-column
 * content use 960px.
 */
.single-post-layout .entry-content .isp-structured-section {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-top: clamp(3.25rem, 5vw, 4rem);
  margin-left: auto;
  margin-right: auto;
  padding-top: var(--isp-article-space-4, 1.5rem);
}

.single-post-layout .entry-content .isp-structured-section__header,
.single-post-layout .entry-content .isp-structured-section__eyebrow,
.single-post-layout .entry-content .isp-structured-section__heading,
.single-post-layout .entry-content .isp-structured-section__intro,
.single-post-layout .entry-content .isp-structured-section__facts,
.single-post-layout .entry-content .isp-structured-section__content {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

/* Prevent global article heading margins from creating a large empty gap here. */
.single-post-layout .entry-content .isp-structured-section__heading > h2,
.single-post-layout .entry-content .isp-structured-section__heading > h3 {
  width: 100%;
  max-width: none;
  margin: 0 !important;
}

.single-post-layout .entry-content .isp-structured-section__intro {
  margin-top: var(--isp-article-space-3, 1rem);
}

/* Facts remain one editorial rail regardless of how many values are present. */
.single-post-layout .entry-content .isp-structured-section__facts {
  margin-top: var(--isp-article-space-4, 1.5rem);
  padding: var(--isp-article-space-3, 1rem) 0;
  border-top: var(--isp-article-border, 1px solid #eae9ea);
  border-right: 0;
  border-bottom: var(--isp-article-border, 1px solid #eae9ea);
  border-left: 0;
  border-radius: 0;
  background: transparent;
}

.single-post-layout .isp-structured-section__facts:has(.isp-structured-section__fact:only-child) {
  grid-template-columns: minmax(0, 1fr);
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
}

.single-post-layout .isp-structured-section__facts:has(.isp-structured-section__fact:first-child:nth-last-child(2)) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
}

.single-post-layout .entry-content .isp-structured-section__media {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin: var(--isp-article-space-5, 2rem) auto 0;
}

.single-post-layout .entry-content .isp-structured-section__content {
  margin-top: var(--isp-article-space-5, 2rem);
}

.single-post-layout .entry-content .isp-structured-section__facts + .isp-structured-section__content {
  margin-top: var(--isp-article-space-5, 2rem);
}

.single-post-layout .entry-content .isp-structured-section--layout-columns .isp-structured-section__content {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
}

.single-post-layout .entry-content .isp-structured-section--layout-stacked .isp-structured-section__content {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
}

/* Checklist and numbered-step groups share one marker column. */
.single-post-layout .isp-section-group__list--checklist li {
  grid-template-columns: 2rem minmax(0, 1fr);
  gap: var(--isp-article-space-3, 1rem);
}

.single-post-layout .isp-section-group__list--checklist li > span:first-child {
  display: flex;
  width: 2rem;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Legacy Activity block follows the same rail logic. */
.single-post-layout .entry-content .isp-activity {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .entry-content .isp-activity__header,
.single-post-layout .entry-content .isp-activity__meta {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .entry-content .isp-activity__heading > h2,
.single-post-layout .entry-content .isp-activity__heading > h3 {
  margin: 0 !important;
}

.single-post-layout .entry-content .isp-activity__media,
.single-post-layout .entry-content .isp-activity__instructions {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .entry-content .isp-activity--stacked .isp-activity__instructions {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
}

/* At a Glance stays wide, with supporting copy on the reading rail. */
.single-post-layout .isp-post-component--at-a-glance {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-component--at-a-glance .isp-glance {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.single-post-layout .isp-glance__best-for,
.single-post-layout .isp-glance__summary {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

/* Conclusion returns to the reading rail before conversion and discovery. */
.single-post-layout .isp-post-component--conclusion {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-component--conclusion .isp-article-conclusion {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

/* Post-ending hierarchy: conversion, trust, discovery, utility, comments. */
.single-post-layout .isp-post-end .isp-resource-cta,
.single-post-layout .isp-post-end .isp-author-trust {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-end .isp-related-posts {
  width: min(100%, var(--isp-post-width-discovery));
  max-width: var(--isp-post-width-discovery);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-end .single-post-navigation {
  width: min(100%, var(--isp-post-width-wide));
  max-width: var(--isp-post-width-wide);
  margin-left: auto;
  margin-right: auto;
}

.single-post-layout .isp-post-end .comments-area,
.single-post-layout .post-tags,
.single-post-layout .isp-post-author {
  width: min(100%, var(--isp-post-width-reading));
  max-width: var(--isp-post-width-reading);
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1024px) {
  .single-post-layout .isp-post-breadcrumbs,
  .single-post-layout .single-entry-header,
  .single-post-layout .entry-featured-image {
    width: min(calc(100% - 36px), 900px);
    max-width: 900px;
  }
}

@media (max-width: 700px) {
  .single-post-layout .isp-post-breadcrumbs,
  .single-post-layout .single-entry-header,
  .single-post-layout .entry-featured-image {
    width: min(calc(100% - 24px), 820px);
    max-width: 820px;
  }

  .single-post-layout .entry-content > p,
  .single-post-layout .entry-content > ul,
  .single-post-layout .entry-content > ol,
  .single-post-layout .entry-content > h2,
  .single-post-layout .entry-content > h3,
  .single-post-layout .entry-content > h4,
  .single-post-layout .entry-content > h5,
  .single-post-layout .entry-content > h6,
  .single-post-layout .entry-content > blockquote,
  .single-post-layout .entry-content > pre,
  .single-post-layout .entry-content > table,
  .single-post-layout .entry-content > .wp-block-quote,
  .single-post-layout .entry-content > .wp-block-list,
  .single-post-layout .entry-content > .wp-block-table,
  .single-post-layout .entry-content > .wp-block-code,
  .single-post-layout .entry-content > .wp-block-pullquote,
  .single-post-layout .entry-content > .wp-block-details,
  .single-post-layout .entry-content > .wp-block-buttons,
  .single-post-layout .entry-content > .wp-block-separator,
  .single-post-layout .entry-content > .wp-block-embed,
  .single-post-layout .entry-content > .wp-block-gallery,
  .single-post-layout .entry-content > .wp-block-media-text:not(.alignwide):not(.alignfull),
  .single-post-layout .entry-content > .wp-block-columns:not(.alignwide):not(.alignfull),
  .single-post-layout .entry-content > .wp-block-image:not(.alignwide):not(.alignfull),
  .single-post-layout .entry-content .isp-quick-action,
  .single-post-layout .entry-content .isp-safety,
  .single-post-layout .entry-content .isp-callout,
  .single-post-layout .entry-content .isp-faq,
  .single-post-layout .entry-content .wp-block-rank-math-toc-block,
  .single-post-layout .entry-content .wp-block-rank-math-toc,
  .single-post-layout .entry-content .rank-math-block,
  .single-post-layout .entry-content .isp-structured-section,
  .single-post-layout .entry-content .isp-structured-section__header,
  .single-post-layout .entry-content .isp-structured-section__eyebrow,
  .single-post-layout .entry-content .isp-structured-section__heading,
  .single-post-layout .entry-content .isp-structured-section__intro,
  .single-post-layout .entry-content .isp-structured-section__facts,
  .single-post-layout .entry-content .isp-structured-section__media,
  .single-post-layout .entry-content .isp-structured-section__content,
  .single-post-layout .entry-content .isp-structured-section--layout-columns .isp-structured-section__content,
  .single-post-layout .entry-content .isp-structured-section--layout-stacked .isp-structured-section__content,
  .single-post-layout .entry-content .isp-activity,
  .single-post-layout .entry-content .isp-activity__header,
  .single-post-layout .entry-content .isp-activity__meta,
  .single-post-layout .entry-content .isp-activity__media,
  .single-post-layout .entry-content .isp-activity__instructions,
  .single-post-layout .entry-content .isp-activity--stacked .isp-activity__instructions,
  .single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink,
  .single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue,
  .single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note,
  .single-post-layout .isp-post-component--at-a-glance,
  .single-post-layout .isp-post-component--conclusion,
  .single-post-layout .isp-post-component--conclusion .isp-article-conclusion,
  .single-post-layout .isp-post-end .isp-resource-cta,
  .single-post-layout .isp-post-end .isp-author-trust,
  .single-post-layout .isp-post-end .isp-related-posts,
  .single-post-layout .isp-post-end .single-post-navigation,
  .single-post-layout .isp-post-end .comments-area,
  .single-post-layout .post-tags,
  .single-post-layout .isp-post-author {
    width: 100%;
    max-width: 100%;
  }

  .single-post-layout .isp-structured-section__facts:has(.isp-structured-section__fact:only-child),
  .single-post-layout .isp-structured-section__facts:has(.isp-structured-section__fact:first-child:nth-last-child(2)) {
    width: 100%;
    max-width: 100%;
  }
}
