/**
 * Customer story pages (/stories/*) — centered reading layout.
 * Works with injected .cb-story-article wrapper from process pipeline.
 */

/* -------------------------------------------------------------------------- */
/* Page shell                                                                 */
/* -------------------------------------------------------------------------- */
.single-fw-portfolio .content-wrapper {
  background: #fafafa !important;
}

.single-fw-portfolio #primary .container {
  max-width: 1040px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
  box-sizing: border-box !important;
}

.single-fw-portfolio #primary .row,
.single-fw-portfolio #primary .row.medium-padding30 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.single-fw-portfolio #primary [class*="col-"] {
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

.single-fw-portfolio.skew-rows .content-wrapper {
  transform: none !important;
}

/* -------------------------------------------------------------------------- */
/* Article column                                                             */
/* -------------------------------------------------------------------------- */
.single-fw-portfolio main.site-main.cb-story-article {
  display: block !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

.single-fw-portfolio .cb-story-breadcrumbs {
  max-width: 720px !important;
  margin: 0 auto 1.25rem !important;
  padding: clamp(1.75rem, 4vw, 2.5rem) 0 0 !important;
}

.single-fw-portfolio .cb-story-article__body {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 0 0 clamp(2.5rem, 6vw, 3.5rem) !important;
  font-family: Ubuntu, system-ui, sans-serif !important;
  font-size: 1.0625rem !important;
  line-height: 1.7 !important;
  color: #334155 !important;
}

/* Injected title (pages without a heading block) */
.single-fw-portfolio .cb-story-article__title {
  margin: 0 0 2rem !important;
  text-align: center !important;
  font-family: Ubuntu, system-ui, sans-serif !important;
  font-size: clamp(1.5rem, 4vw, 2rem) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
}

/* First block heading acts as page title */
.single-fw-portfolio .cb-story-article__body > .wp-block-heading:first-child,
.single-fw-portfolio .cb-story-article__body > h2.wp-block-heading:first-child,
.single-fw-portfolio .cb-story-article__body > h3.wp-block-heading:first-child {
  margin: 0 0 2rem !important;
  text-align: center !important;
  font-family: Ubuntu, system-ui, sans-serif !important;
  font-size: clamp(1.5rem, 4vw, 2rem) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
}

.single-fw-portfolio .cb-story-article__body > .wp-block-heading:not(:first-child),
.single-fw-portfolio .cb-story-article__body > h2.wp-block-heading:not(:first-child),
.single-fw-portfolio .cb-story-article__body > h3.wp-block-heading:not(:first-child) {
  margin: 2.25rem 0 0.85rem !important;
  font-size: 1.25rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: #0f172a !important;
}

.single-fw-portfolio .cb-story-article__body p {
  margin: 0 0 1.25rem !important;
}

.single-fw-portfolio .cb-story-article__body p:last-child {
  margin-bottom: 0 !important;
}

.single-fw-portfolio .cb-story-article__body a:not(.btn) {
  color: #1dbb99 !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

.single-fw-portfolio .cb-story-article__body a:not(.btn):hover {
  color: #17a885 !important;
  text-decoration: underline !important;
}

/* -------------------------------------------------------------------------- */
/* Images & media                                                             */
/* -------------------------------------------------------------------------- */
.single-fw-portfolio .cb-story-article__body figure,
.single-fw-portfolio .cb-story-article__body .wp-block-image {
  margin: 2rem auto !important;
  max-width: 100% !important;
  text-align: center !important;
}

.single-fw-portfolio .cb-story-article__body figure img,
.single-fw-portfolio .cb-story-article__body .wp-block-image img {
  display: block !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08) !important;
}

.single-fw-portfolio .cb-story-article__body figcaption {
  margin-top: 0.65rem !important;
  font-size: 0.875rem !important;
  line-height: 1.45 !important;
  color: #64748b !important;
  text-align: center !important;
}

.single-fw-portfolio .cb-story-article__body .wp-block-media-text {
  display: grid !important;
  gap: 1.25rem !important;
  margin: 2rem 0 !important;
  max-width: 100% !important;
}

.single-fw-portfolio .cb-story-article__body .wp-block-media-text__media img {
  border-radius: 12px !important;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08) !important;
}

.single-fw-portfolio .cb-story-article__body .wp-block-media-text__content {
  padding: 0 !important;
  align-self: center !important;
}

/* -------------------------------------------------------------------------- */
/* Quotes & callouts                                                          */
/* -------------------------------------------------------------------------- */
.single-fw-portfolio .cb-story-article__body blockquote,
.single-fw-portfolio .cb-story-article__body .wp-block-quote {
  margin: 2rem 0 !important;
  padding: 1.25rem 1.5rem !important;
  border-left: 4px solid #1dbb99 !important;
  background: #f0fdfa !important;
  border-radius: 0 12px 12px 0 !important;
  font-style: italic !important;
  color: #0f172a !important;
}

.single-fw-portfolio .cb-story-article__body blockquote p,
.single-fw-portfolio .cb-story-article__body .wp-block-quote p {
  margin: 0 !important;
}

.single-fw-portfolio .cb-story-article__body p.has-background {
  padding: 1rem 1.25rem !important;
  border-radius: 12px !important;
}

/* -------------------------------------------------------------------------- */
/* Footer back link                                                           */
/* -------------------------------------------------------------------------- */
.single-fw-portfolio .cb-story-article__footer {
  max-width: 720px !important;
  margin: 0 auto !important;
  padding: 2rem 0 clamp(2.5rem, 6vw, 3.5rem) !important;
  border-top: 1px solid #e2e8f0 !important;
}

.single-fw-portfolio .cb-story-back {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  font-family: Ubuntu, system-ui, sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: #1dbb99 !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

.single-fw-portfolio .cb-story-back:hover {
  color: #17a885 !important;
  text-decoration: underline !important;
}

@media (max-width: 768px) {
  .single-fw-portfolio #primary .container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }

  .single-fw-portfolio .cb-story-article__body {
    font-size: 1rem !important;
  }

  .single-fw-portfolio .cb-story-breadcrumbs {
    padding-top: 1.25rem !important;
  }

  .single-fw-portfolio .cb-story-article__body figure,
  .single-fw-portfolio .cb-story-article__body .wp-block-image {
    margin: 1.5rem auto !important;
  }
}
