/*
 * Blueprint To Progress — Career Article System
 * V8.0 CLEAN PRODUCTION CSS
 *
 * Production freeze based on the verified V7.15 responsive stylesheet.
 *
 * IMPORTANT:
 * - Visual rules are preserved to avoid regressions in the verified desktop,
 *   iPad Mini (768px) and iPhone SE (375px) layouts.
 * - This version is a safe production cleanup/version freeze, not a visual
 *   redesign. Do not add page-builder widget styling outside this scope.
 * - The Elementor container holding the HTML widget must remain Full Width,
 *   width: 100%, with 0 padding and 0 margin.
 */

.btp-career-development-plan {
  --btp-blue: #0077CE;
  --btp-blue-dark: #005B9E;
  --btp-blue-soft: #EAF5FC;
  --btp-text: #243B53;
  --btp-muted: #5B6B7A;
  --btp-heading: #142B49;
  --btp-border: #DCE6EE;
  --btp-surface: #F7FAFC;
  --btp-white: #FFFFFF;
  --btp-shadow: 0 8px 24px rgba(20, 55, 80, 0.07);

  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 64px;
  color: var(--btp-text);
  font-family: inherit;
  font-size: 18px;
  line-height: 1.72;
  box-sizing: border-box;
  background: #F7FAFC;
}

.btp-career-development-plan *,
.btp-career-development-plan *::before,
.btp-career-development-plan *::after {
  box-sizing: border-box;
}

.btp-career-development-plan h1,
.btp-career-development-plan h2,
.btp-career-development-plan h3,
.btp-career-development-plan h4 {
  color: var(--btp-heading);
  line-height: 1.2;
  font-weight: 700;
  margin-top: 0;
}

.btp-career-container {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}

.btp-readable-container {
  width: min(1120px, calc(100% - 48px));
}

.btp-career-development-plan p {
  margin: 0 0 20px;
}

.btp-career-development-plan a {
  color: var(--btp-blue-dark);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.btp-career-development-plan a:hover {
  color: var(--btp-blue);
}

.btp-career-development-plan ul,
.btp-career-development-plan ol {
  margin: 0 0 24px;
  padding-left: 1.35em;
}

.btp-career-development-plan li {
  margin-bottom: 8px;
}

.btp-career-development-plan blockquote {
  margin: 26px 0;
  padding: 18px 24px;
  border-left: 4px solid var(--btp-blue);
  background: var(--btp-blue-soft);
  border-radius: 0 10px 10px 0;
}

.btp-career-development-plan blockquote p:last-child {
  margin-bottom: 0;
}

/* =========================================================
   HERO — no card, no border, no shadow
   ========================================================= */

.btp-career-hero {
  width: 100%;
  background: #F7FAFC;
  padding: 28px 0 58px;
}

.btp-career-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 64px;
  align-items: center;
}

.btp-career-hero-content {
  min-width: 0;
}

.btp-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 26px;
  color: #8A9AAB;
  font-size: 0.88rem;
  line-height: 1.4;
}

.btp-breadcrumb a {
  color: var(--btp-blue-dark);
  text-decoration: none;
  font-weight: 700;
}

.btp-breadcrumb span[aria-hidden="true"] {
  color: #9BA9B7;
}

.btp-breadcrumb [aria-current="page"] {
  color: #91A0AF;
  font-weight: 600;
}

.btp-eyebrow,
.btp-cta-eyebrow,
.btp-related-kicker {
  color: var(--btp-blue);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.btp-eyebrow {
  display: inline-block;
  margin: 0 0 20px;
  padding: 7px 12px;
  border-radius: 999px;
  background: #EAF5FC;
}

.btp-career-development-plan .btp-article-title {
  max-width: 700px;
  margin: 0 0 24px;
  color: var(--btp-heading);
  font-size: clamp(3rem, 5.2vw, 4.25rem);
  line-height: 1.04;
  letter-spacing: -0.035em;
}

.btp-hero-lead {
  max-width: 700px;
  margin-bottom: 20px !important;
  color: #40566D;
  font-size: clamp(1.2rem, 2.1vw, 1.42rem);
  line-height: 1.62;
}

.btp-hero-support {
  max-width: 700px;
  color: #30475E;
}

.btp-career-hero-media {
  min-width: 0;
}

.btp-hero-image {
  margin: 0;
}

.btp-hero-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 16px;
  border: 1px solid var(--btp-border);
  box-shadow: var(--btp-shadow);
}

/* =========================================================
   INTRO — editorial flow, not a card
   ========================================================= */

.btp-career-intro-section {
  width: 100%;
  padding: 12px 0 20px;
  background: #F7FAFC;
}

.btp-career-intro-section h2 {
  max-width: 860px;
  margin: 0 0 20px;
  font-size: clamp(1.8rem, 3vw, 2.35rem);
  letter-spacing: -0.02em;
}

.btp-career-intro-section .btp-highlight-box {
  max-width: 940px;
}

/* =========================================================
   MAIN ARTICLE — broad site grid, normal sections stay flat
   ========================================================= */

.btp-career-content {
  width: 100%;
  background: #F7FAFC;
}

.btp-editorial-section {
  margin: 0;
  padding: 46px 0 10px;
  background: transparent;
}

.btp-editorial-section + .btp-editorial-section {
  padding-top: 54px;
}

.btp-editorial-section h2,
.btp-faq h2,
.btp-related-articles h2,
.btp-conclusion h2,
.btp-sources h2 {
  max-width: 980px;
  margin: 0 0 22px;
  font-size: clamp(1.8rem, 3vw, 2.45rem);
  letter-spacing: -0.025em;
}

.btp-editorial-section h3 {
  margin: 34px 0 12px;
  font-size: clamp(1.2rem, 2vw, 1.45rem);
}

.btp-editorial-section h4 {
  font-size: 1.08rem;
  margin-bottom: 14px;
}

/* Long-form reading width without shrinking the overall site grid */
.btp-editorial-section > p,
.btp-editorial-section > ul,
.btp-editorial-section > ol,
.btp-editorial-section > blockquote,
.btp-editorial-section > h3,
.btp-editorial-section > h4 {
  max-width: 900px;
}

.btp-internal-resource {
  max-width: 900px;
  margin: 30px 0;
  padding: 18px 20px;
  background: #F0F7FC;
  border-left: 3px solid var(--btp-blue);
  border-radius: 8px;
}

/* =========================================================
   SELECTIVE CARDS — only functional components
   ========================================================= */

.btp-highlight-box {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  flex-wrap: wrap;
  margin: 28px 0 30px;
  padding: 20px 22px;
  border: 1px solid #CFE6F6;
  background: var(--btp-blue-soft);
  border-radius: 12px;
  color: var(--btp-heading);
  text-align: center;
}

.btp-highlight-box span {
  color: var(--btp-blue);
  font-weight: 800;
}

.btp-source-box,
.btp-tip-box {
  max-width: 1000px;
  margin: 30px 0;
  padding: 24px 26px;
  border: 1px solid var(--btp-border);
  border-radius: 12px;
  background: var(--btp-white);
}

.btp-tip-box {
  border-left: 4px solid var(--btp-blue);
}

.btp-source-box p:last-child,
.btp-tip-box p:last-child {
  margin-bottom: 0;
}

.btp-framework {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  align-items: stretch;
  margin: 30px 0;
}

.btp-framework-step {
  min-height: 145px;
  padding: 18px 12px;
  border: 1px solid var(--btp-border);
  border-radius: 12px;
  background: var(--btp-white);
  box-shadow: 0 4px 14px rgba(20, 55, 80, 0.05);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.btp-framework-step span {
  display: block;
  color: var(--btp-blue);
  font-size: 0.82rem;
  font-weight: 800;
  margin-bottom: 7px;
}

.btp-framework-step strong {
  display: block;
  color: var(--btp-heading);
  font-size: 1rem;
  line-height: 1.25;
}

.btp-framework-step small {
  display: block;
  margin-top: 8px;
  color: var(--btp-muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.btp-framework-arrow {
  display: none;
}

.btp-comparison {
  max-width: 1000px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 28px 0;
}

.btp-comparison > div {
  padding: 22px;
  border: 1px solid var(--btp-border);
  border-radius: 12px;
  background: var(--btp-white);
}

.btp-comparison > div:last-child {
  border-color: #B9DDF3;
  background: var(--btp-blue-soft);
}

.btp-label {
  display: inline-block;
  margin-bottom: 8px;
  color: var(--btp-blue-dark);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

/* Tables are broad and horizontally scrollable on small screens */
.btp-table-wrapper {
  width: 100%;
  max-width: 1120px;
  margin: 28px 0 34px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--btp-border);
  border-radius: 10px;
  background: var(--btp-white);
}

.btp-table-wrapper table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
  background: var(--btp-white);
  font-size: 0.94rem;
  line-height: 1.5;
}

.btp-table-wrapper th {
  padding: 13px 15px;
  background: var(--btp-blue);
  color: var(--btp-white);
  text-align: left;
  font-weight: 700;
  vertical-align: top;
}

.btp-table-wrapper td {
  padding: 13px 15px;
  border-top: 1px solid var(--btp-border);
  vertical-align: top;
}

.btp-table-wrapper tbody tr:nth-child(even) td {
  background: #FAFCFD;
}

.btp-review-grid {
  max-width: 1000px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 30px 0;
}

.btp-review-grid > div {
  padding: 22px;
  border: 1px solid var(--btp-border);
  border-radius: 12px;
  background: var(--btp-white);
}

.btp-template-box {
  max-width: 1080px;
  margin: 30px 0;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid #CFE6F6;
  border-radius: 14px;
  background: #FBFDFF;
}

.btp-writing-line {
  min-height: 32px;
  margin: 0 0 22px;
  border-bottom: 1px solid #AEBCC8;
}

.btp-goal-card {
  margin: 22px 0;
  padding: 20px;
  border: 1px solid var(--btp-border);
  border-radius: 10px;
  background: var(--btp-white);
}

.btp-image-placeholder,
.btp-editorial-figure {
  max-width: 1080px;
  margin: 32px 0 42px;
  text-align: center;
}

.btp-image-placeholder img,
.btp-editorial-figure img,
.btp-framework-image img,
.btp-skills-gap-image img,
.btp-template-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 14px;
  border: 1px solid var(--btp-border);
  box-shadow: var(--btp-shadow);
}

/* =========================================================
   FAQ / RELATED / CONCLUSION / SOURCES
   ========================================================= */

.btp-faq,
.btp-related-articles,
.btp-conclusion,
.btp-sources {
  width: min(1120px, calc(100% - 48px));
  margin-left: auto;
  margin-right: auto;
}

.btp-faq {
  margin-top: 62px;
}

.btp-faq details {
  margin: 12px 0;
  border: 1px solid var(--btp-border);
  border-radius: 10px;
  background: var(--btp-white);
}

.btp-faq summary {
  position: relative;
  padding: 18px 46px 18px 20px;
  cursor: pointer;
  color: var(--btp-heading);
  font-weight: 700;
  list-style: none;
}

.btp-faq summary::-webkit-details-marker {
  display: none;
}

.btp-faq summary::after {
  content: "+";
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--btp-blue);
  font-size: 1.35rem;
  font-weight: 400;
}

.btp-faq details[open] summary::after {
  content: "−";
}

.btp-faq-answer {
  padding: 0 20px 18px;
  color: var(--btp-muted);
}

.btp-related-articles {
  margin-top: 62px;
}

.btp-related-intro {
  color: var(--btp-muted);
}

.btp-related-card {
  display: block;
  margin: 14px 0;
  padding: 24px;
  border: 1px solid var(--btp-border);
  border-radius: 12px;
  background: var(--btp-white);
  box-shadow: 0 5px 18px rgba(20, 55, 80, 0.05);
  text-decoration: none;
}

.btp-related-card h3 {
  margin: 8px 0 10px;
}

.btp-related-card h3 a {
  color: var(--btp-heading);
  text-decoration: none;
}

.btp-related-card p {
  color: var(--btp-muted);
  font-size: 0.95rem;
}

.btp-conclusion {
  margin-top: 62px;
}

.btp-final-callout {
  max-width: 900px;
  margin: 34px 0 0;
  padding: 24px;
  border: 1px solid #B9DDF3;
  border-radius: 12px;
  background: var(--btp-blue-soft);
  color: var(--btp-heading);
}

.btp-final-callout strong,
.btp-final-callout span {
  display: block;
}

.btp-final-callout span {
  margin-top: 6px;
}

.btp-sources {
  margin-top: 62px;
  padding-top: 22px;
  border-top: 1px solid var(--btp-border);
}

.btp-sources li {
  margin-bottom: 12px;
}

/* =========================================================
   CAREER HUB CTA — final page element before footer
   ========================================================= */

.btp-career-hub-cta {
  width: min(1120px, calc(100% - 48px));
  margin: 64px auto 0;
  padding: clamp(30px, 5vw, 46px);
  border-radius: 16px;
  background: var(--btp-blue);
  color: var(--btp-white);
  text-align: center;
}

.btp-career-hub-cta h2 {
  margin: 8px 0 14px;
  padding: 0;
  border: 0;
  color: var(--btp-white);
}

.btp-career-hub-cta p {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}

.btp-career-hub-cta .btp-cta-eyebrow {
  color: #DDF1FF;
}

.btp-cta-button {
  display: inline-block;
  margin-top: 8px;
  padding: 12px 22px;
  border-radius: 7px;
  background: var(--btp-white);
  color: var(--btp-blue-dark) !important;
  text-decoration: none !important;
  font-weight: 800;
}

.btp-cta-button:hover {
  background: #F2F8FC;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {
  .btp-career-hero-grid {
    grid-template-columns: 1fr 0.9fr;
    gap: 38px;
  }

  .btp-career-development-plan .btp-article-title {
    font-size: clamp(2.65rem, 5.6vw, 3.6rem);
  }

  .btp-framework {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .btp-review-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 720px) {
  .btp-career-development-plan {
    font-size: 16.5px;
    line-height: 1.7;
  }

  .btp-career-container,
  .btp-readable-container,
  .btp-faq,
  .btp-related-articles,
  .btp-conclusion,
  .btp-sources,
  .btp-career-hub-cta {
    width: min(100% - 32px, 680px);
  }

  .btp-career-hero {
    padding: 20px 0 38px;
  }

  .btp-career-hero-grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .btp-career-development-plan .btp-article-title {
    max-width: 100%;
    font-size: clamp(2.35rem, 10vw, 3.1rem);
    line-height: 1.06;
  }

  .btp-hero-lead {
    font-size: 1.16rem;
  }

  .btp-hero-image img {
    border-radius: 12px;
  }

  .btp-editorial-section {
    padding-top: 38px;
  }

  .btp-editorial-section + .btp-editorial-section {
    padding-top: 42px;
  }

  .btp-framework {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .btp-framework-step {
    min-height: auto;
    text-align: left;
    display: grid;
    grid-template-columns: 42px 1fr;
    column-gap: 10px;
    align-items: center;
  }

  .btp-framework-step span {
    grid-row: span 2;
    margin: 0;
  }

  .btp-framework-step strong,
  .btp-framework-step small {
    grid-column: 2;
  }

  .btp-comparison {
    grid-template-columns: 1fr;
  }

  .btp-highlight-box {
    align-items: flex-start;
    flex-direction: column;
    text-align: left;
  }

  .btp-highlight-box span {
    display: none;
  }

  .btp-source-box,
  .btp-tip-box,
  .btp-template-box,
  .btp-final-callout,
  .btp-career-hub-cta {
    padding: 22px 18px;
  }

  .btp-table-wrapper {
    border-radius: 8px;
  }

  .btp-table-wrapper table {
    min-width: 680px;
  }

  .btp-faq summary {
    padding: 16px 42px 16px 16px;
  }

  .btp-faq-answer {
    padding: 0 16px 16px;
  }

  .btp-related-card {
    padding: 20px 18px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btp-career-development-plan *,
  .btp-career-development-plan *::before,
  .btp-career-development-plan *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* =========================================================
   V7 MASTER LAYOUT REFINEMENT
   Blueprint To Progress — Career Article System
   Shared production stylesheet for Elementor Free HTML Embed

   Elementor outer container:
   - Full Width
   - Width: 100%
   - Padding: 0
   - Margin: 0
   - Gap: 0
   ========================================================= */

.btp-career-development-plan.btp-career-article-v7 {
  --btp-blue: #0077CE;
  --btp-blue-dark: #005B9E;
  --btp-blue-soft: #EAF5FC;
  --btp-text: #243B53;
  --btp-muted: #5B6B7A;
  --btp-heading: #142B49;
  --btp-border: #DCE6EE;
  --btp-surface: #F7FAFC;
  --btp-white: #FFFFFF;
  font-size: 18px;
  line-height: 1.72;
}

/* HERO — wide site grid, never a card */
.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1.12fr) minmax(390px, 0.88fr) !important;
  gap: 52px !important;
  align-items: center !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-content {
  width: auto !important;
  min-width: 0 !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-media {
  width: 100% !important;
  min-width: 0 !important;
  align-self: center !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-image {
  width: 100% !important;
  margin: 0 !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-image img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 1200 / 675;
  object-fit: cover;
}

/* HERO TYPOGRAPHY — reduced from V6 to prevent excessive wrapping */
.btp-career-development-plan.btp-career-article-v7 .btp-article-title {
  max-width: 720px !important;
  font-size: clamp(3rem, 4.35vw, 3.72rem) !important;
  line-height: 1.075 !important;
  letter-spacing: -0.035em !important;
  margin-bottom: 22px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-lead {
  max-width: 690px !important;
  font-size: clamp(1.16rem, 1.7vw, 1.34rem) !important;
  line-height: 1.62 !important;
  margin-bottom: 18px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-support {
  max-width: 700px !important;
}

/* OPENING FLOW — no redundant headline and no artificial card */
.btp-career-development-plan.btp-career-article-v7 .btp-career-intro-section {
  padding: 8px 0 26px !important;
}

/* MAIN ARTICLE — wider than V6, while prose remains editorially controlled */
.btp-career-development-plan.btp-career-article-v7 .btp-readable-container {
  width: min(1040px, calc(100% - 48px)) !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > blockquote,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h3,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h4 {
  max-width: 960px !important;
}

/* EDITORIAL RHYTHM — more breathing room without unnecessary page length */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
  padding-top: 50px;
  padding-bottom: 12px;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
  padding-top: 58px;
}

/* SECTION HEADINGS — closer to the Career Hub hierarchy */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h2,
.btp-career-development-plan.btp-career-article-v7 .btp-faq h2,
.btp-career-development-plan.btp-career-article-v7 .btp-related-articles h2,
.btp-career-development-plan.btp-career-article-v7 .btp-conclusion h2,
.btp-career-development-plan.btp-career-article-v7 .btp-sources h2 {
  max-width: 1040px !important;
  font-size: clamp(1.95rem, 3vw, 2.5rem) !important;
  line-height: 1.16 !important;
  margin-bottom: 24px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h3 {
  margin-top: 38px;
  margin-bottom: 14px;
  font-size: clamp(1.28rem, 1.85vw, 1.5rem);
  line-height: 1.25;
}

/* FUNCTIONAL MODULES — use the wider article grid */
.btp-career-development-plan.btp-career-article-v7 .btp-table-wrapper {
  max-width: 1040px;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework {
  gap: 12px;
  margin-top: 34px;
  margin-bottom: 34px;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework-step {
  min-height: 152px;
  padding: 20px 13px;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework-step span {
  font-size: 0.84rem;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework-step strong {
  font-size: 1.03rem;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework-step small {
  font-size: 0.8rem;
}

/* IMAGES / MODULES — avoid unnecessarily narrow sections */
.btp-career-development-plan.btp-career-article-v7 .btp-image-placeholder,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-figure,
.btp-career-development-plan.btp-career-article-v7 .btp-template-image,
.btp-career-development-plan.btp-career-article-v7 .btp-skills-gap-image,
.btp-career-development-plan.btp-career-article-v7 .btp-framework-image {
  max-width: 1040px;
}

/* RELATED / FAQ / CONCLUSION / SOURCES — consistent article width */
.btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
.btp-career-development-plan.btp-career-article-v7 .btp-faq,
.btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
.btp-career-development-plan.btp-career-article-v7 .btp-sources {
  width: min(1040px, calc(100% - 48px));
}

/* CAREER HUB CTA — final page element before the site footer */
.btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
  width: min(1040px, calc(100% - 48px));
  margin-top: 58px;
  border-radius: 14px;
}

/* TABLET — preserve two-column Hero where there is enough room */
@media (max-width: 1000px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.72fr) !important;
    gap: 34px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-article-title {
    font-size: clamp(2.65rem, 5.2vw, 3.25rem) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7 .btp-faq,
  .btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7 .btp-sources,
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
    width: min(100% - 40px, 960px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > blockquote,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h3,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h4 {
    max-width: 900px !important;
  }
}

/* MOBILE — single-column Hero and comfortable editorial typography */
@media (max-width: 760px) {
  .btp-career-development-plan.btp-career-article-v7 {
    font-size: 16px;
    line-height: 1.72;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7 .btp-faq,
  .btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7 .btp-sources,
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
    width: min(100% - 32px, 680px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero {
    padding: 20px 0 34px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-article-title {
    max-width: 100% !important;
    font-size: clamp(2.15rem, 9vw, 2.65rem) !important;
    line-height: 1.08 !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-hero-lead {
    font-size: 1.08rem !important;
    line-height: 1.62 !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
    padding-top: 40px;
    padding-bottom: 8px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
    padding-top: 46px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h2,
  .btp-career-development-plan.btp-career-article-v7 .btp-faq h2,
  .btp-career-development-plan.btp-career-article-v7 .btp-related-articles h2,
  .btp-career-development-plan.btp-career-article-v7 .btp-conclusion h2,
  .btp-career-development-plan.btp-career-article-v7 .btp-sources h2 {
    font-size: 1.85rem !important;
    line-height: 1.2 !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h3 {
    font-size: 1.25rem;
    margin-top: 32px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > blockquote,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h3,
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h4 {
    max-width: none !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-framework {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-framework-step {
    min-height: auto;
    padding: 17px 16px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-table-wrapper table {
    min-width: 680px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-related-card {
    padding: 20px 18px;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
    margin-top: 48px;
  }
}

/* VERY NARROW PHONES */
@media (max-width: 380px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-article-title {
    font-size: 2.05rem !important;
  }
}

/* ============================================================
   V7.1 HERO REFINEMENT — CAREER HUB VISUAL ALIGNMENT
   ============================================================ */
.btp-career-article-v7 .btp-career-hero{padding-top:30px;padding-bottom:42px}
.btp-career-article-v7 .btp-career-hero-grid{width:min(1180px,calc(100% - 48px));max-width:1180px;margin-inline:auto;display:grid;grid-template-columns:minmax(0,53%) minmax(0,47%);column-gap:30px;align-items:center}
.btp-career-article-v7 .btp-career-hero-content{min-width:0;max-width:none}
.btp-career-article-v7 .btp-career-hero-content h1{max-width:650px;margin-bottom:24px;letter-spacing:-.035em}
.btp-career-article-v7 .btp-career-hero-lead,.btp-career-article-v7 .btp-career-hero-content>p{max-width:640px}
.btp-career-article-v7 .btp-career-hero-media{width:100%;max-width:100%;align-self:center}
.btp-career-article-v7 .btp-career-hero-media img{display:block;width:100%;height:auto;max-width:100%;border-radius:16px}
.btp-career-article-v7 .btp-career-hero-intro{width:min(1040px,calc(100% - 48px));max-width:1040px;margin:0 auto}
.btp-career-article-v7 .btp-career-hero-intro>*:first-child{margin-top:0}
.btp-career-article-v7 .btp-career-hero-intro>*{margin-bottom:20px}
.btp-career-article-v7 .btp-career-hero-intro .btp-roadmap-callout{margin-top:26px;margin-bottom:28px}
@media (min-width:1100px){
.btp-career-article-v7 .btp-career-hero-grid{grid-template-columns:minmax(0,53.5%) minmax(0,46.5%);column-gap:28px}
.btp-career-article-v7 .btp-career-hero-content h1{font-size:clamp(3.35rem,4vw,4.15rem);line-height:.98}
}
@media (min-width:768px) and (max-width:1099px){
.btp-career-article-v7 .btp-career-hero-grid{width:min(100%,calc(100% - 40px));grid-template-columns:minmax(0,52%) minmax(0,48%);column-gap:22px}
.btp-career-article-v7 .btp-career-hero-content h1{font-size:clamp(2.65rem,5vw,3.45rem);line-height:1.02}
.btp-career-article-v7 .btp-career-hero-intro{width:min(100%,calc(100% - 40px))}
}
@media (max-width:767px){
.btp-career-article-v7 .btp-career-hero{padding-top:22px;padding-bottom:30px}
.btp-career-article-v7 .btp-career-hero-grid{width:min(100%,calc(100% - 32px));grid-template-columns:1fr;gap:24px}
.btp-career-article-v7 .btp-career-hero-content h1{max-width:none;font-size:clamp(2.35rem,10vw,3.05rem);line-height:1.02;letter-spacing:-.025em}
.btp-career-article-v7 .btp-career-hero-media{order:2}
.btp-career-article-v7 .btp-career-hero-intro{width:min(100%,calc(100% - 32px))}
}
/* ============================================================
   V7.2 FINAL VISUAL ALIGNMENT
   Goal: match the Career Hub's open, wide editorial layout.
   - No hero card/container treatment
   - Larger/taller Hero image
   - Article H1 fits in ~3 lines on desktop
   - Reduced vertical dead space after Hero
   - Wider article grid aligned with Career Hub
   ============================================================ */

/* Keep the article as a full-width editorial canvas. */
.btp-career-development-plan.btp-career-article-v7 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 64px;
  background: #F7FAFC;
}

/* Wide site grid: aligned with the Career Hub rather than a narrow reading card. */
.btp-career-development-plan.btp-career-article-v7 .btp-career-container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------------- HERO ---------------- */
.btp-career-development-plan.btp-career-article-v7 .btp-career-hero {
  padding: 30px 0 20px !important;
  background: #F7FAFC;
}

/* Give the text enough width for a 3-line desktop H1 and make the visual column larger. */
.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  grid-template-columns: minmax(0, 55%) minmax(0, 45%) !important;
  column-gap: 30px !important;
  align-items: center !important;
}

/* Desktop H1: retain the SEO title, but use a controlled size/width so it does not
   create an unnecessary fourth line at normal desktop widths. */
.btp-career-development-plan.btp-career-article-v7 .btp-article-title {
  max-width: 690px !important;
  margin-bottom: 20px !important;
  font-size: clamp(3rem, 3.55vw, 3.45rem) !important;
  line-height: 1.04 !important;
  letter-spacing: -0.035em !important;
}

/* Hero lead/support remain readable without making the Hero excessively tall. */
.btp-career-development-plan.btp-career-article-v7 .btp-hero-lead {
  max-width: 660px !important;
  margin-bottom: 16px !important;
  font-size: clamp(1.14rem, 1.55vw, 1.28rem) !important;
  line-height: 1.6 !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-support {
  max-width: 660px !important;
  margin-bottom: 0 !important;
  line-height: 1.65 !important;
}

/* Increase Hero image height while preserving the supplied 16:9 source as a crop. */
.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-media {
  width: 100% !important;
  max-width: 100% !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-image {
  width: 100% !important;
  margin: 0 !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-hero-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: clamp(300px, 24vw, 345px) !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 16px !important;
}

/* ---------------- INTRO / SECTION RHYTHM ---------------- */
/* The first intro paragraph should follow the Hero closely. */
.btp-career-development-plan.btp-career-article-v7 .btp-career-intro-section {
  padding: 0 0 12px !important;
  background: #F7FAFC;
}

/* Align intro/main content with the same broad site grid as the Hero. */
.btp-career-development-plan.btp-career-article-v7 .btp-readable-container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
}

/* Keep prose comfortable to read while allowing tables/functional modules to use the grid. */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > blockquote,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h3,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > h4 {
  max-width: 920px !important;
}

/* Reduce unnecessary vertical separation between major sections. */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
  padding-top: 34px !important;
  padding-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
  padding-top: 44px !important;
}

/* Tables/images can use more of the site's horizontal grid. */
.btp-career-development-plan.btp-career-article-v7 .btp-table-wrapper,
.btp-career-development-plan.btp-career-article-v7 .btp-template-box,
.btp-career-development-plan.btp-career-article-v7 .btp-image-placeholder,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-figure,
.btp-career-development-plan.btp-career-article-v7 .btp-template-image,
.btp-career-development-plan.btp-career-article-v7 .btp-skills-gap-image,
.btp-career-development-plan.btp-career-article-v7 .btp-framework-image {
  max-width: 1120px !important;
}

/* ---------------- TABLET ---------------- */
@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-readable-container {
    width: min(100% - 40px, 1000px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    width: min(100% - 40px, 1000px) !important;
    grid-template-columns: minmax(0, 54%) minmax(0, 46%) !important;
    column-gap: 22px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-article-title {
    max-width: 100% !important;
    font-size: clamp(2.55rem, 4.7vw, 3.2rem) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-media img,
  .btp-career-development-plan.btp-career-article-v7 .btp-hero-image img {
    height: clamp(260px, 27vw, 315px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
    padding-top: 30px !important;
  }
}

/* ---------------- MOBILE ---------------- */
@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7 .btp-faq,
  .btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7 .btp-sources,
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
    width: min(100% - 32px, 680px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero {
    padding: 22px 0 18px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    width: min(100% - 32px, 680px) !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-article-title {
    max-width: none !important;
    font-size: clamp(2.2rem, 9.5vw, 2.8rem) !important;
    line-height: 1.04 !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-hero-lead {
    font-size: 1.08rem !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-hero-image img {
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-intro-section {
    padding-bottom: 8px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
    padding-top: 28px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
    padding-top: 36px !important;
  }
}

/* =========================================================
   V7.3 — GLOBAL EDITORIAL RHYTHM CORRECTION
   Reduce excessive vertical dead space consistently across
   the entire article, not just the Hero transition.
   ========================================================= */

.btp-career-development-plan.btp-career-article-v7 {
  padding-bottom: 42px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hero {
  padding-top: 28px !important;
  padding-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-intro-section {
  padding-top: 0 !important;
  padding-bottom: 4px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-intro > * {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hero-intro > *:last-child {
  margin-bottom: 0 !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-roadmap-callout {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}

/* Main editorial rhythm */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
  padding-top: 22px !important;
  padding-bottom: 2px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
  padding-top: 28px !important;
}

/* Headings */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h2,
.btp-career-development-plan.btp-career-article-v7 .btp-faq h2,
.btp-career-development-plan.btp-career-article-v7 .btp-related-articles h2,
.btp-career-development-plan.btp-career-article-v7 .btp-conclusion h2,
.btp-career-development-plan.btp-career-article-v7 .btp-sources h2 {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h3 {
  margin-top: 24px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h4 {
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}

/* Paragraph/list rhythm */
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > p:last-child,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ul:last-child,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-section > ol:last-child {
  margin-bottom: 0 !important;
}

/* Functional modules */
.btp-career-development-plan.btp-career-article-v7 .btp-internal-resource {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-highlight-box {
  margin-top: 18px !important;
  margin-bottom: 20px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-table-wrapper {
  margin-top: 20px !important;
  margin-bottom: 22px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-framework {
  margin-top: 20px !important;
  margin-bottom: 22px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-template-box {
  margin-top: 20px !important;
  margin-bottom: 22px !important;
}

/* Images/figures */
.btp-career-development-plan.btp-career-article-v7 .btp-image-placeholder,
.btp-career-development-plan.btp-career-article-v7 .btp-editorial-figure {
  margin-top: 20px !important;
  margin-bottom: 24px !important;
}

/* Later-page modules */
.btp-career-development-plan.btp-career-article-v7 .btp-faq,
.btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
.btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
.btp-career-development-plan.btp-career-article-v7 .btp-sources {
  margin-top: 34px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-faq details {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-related-card {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
  margin-top: 40px !important;
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
    padding-top: 20px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
    padding-top: 24px !important;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero {
    padding-top: 18px !important;
    padding-bottom: 6px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section {
    padding-top: 18px !important;
    padding-bottom: 0 !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section + .btp-editorial-section {
    padding-top: 22px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h2 {
    margin-bottom: 12px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-editorial-section h3 {
    margin-top: 20px !important;
    margin-bottom: 7px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-faq,
  .btp-career-development-plan.btp-career-article-v7 .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7 .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7 .btp-sources {
    margin-top: 28px !important;
  }

  .btp-career-development-plan.btp-career-article-v7 .btp-career-hub-cta {
    margin-top: 32px !important;
  }
}

/* =========================================================
   V7.4 — FINAL WIDTH, ALIGNMENT & HERO RHYTHM CORRECTION

   Goals:
   1. H1 fits cleanly in approximately three desktop lines.
   2. Restore a deliberate gap between Hero and intro text.
   3. Make the roadmap callout wider, centered and evenly balanced.
   4. Give body sections a consistent broad content width.
   5. Center all functional cards, tables and comparison grids.
   6. Center all editorial images.
   7. Remove left/right width inconsistencies throughout the article.
   ========================================================= */

/* ---------- GLOBAL ARTICLE GRID ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-career-container,
.btp-career-development-plan.btp-career-article-v7
.btp-readable-container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Main editorial reading area follows the same broad site grid. */
.btp-career-development-plan.btp-career-article-v7
.btp-career-content > .btp-career-container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
}

/* ---------- HERO ---------- */

@media (min-width: 1100px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: 100% !important;
    max-width: 1180px !important;
    grid-template-columns: minmax(0, 53.5%) minmax(0, 46.5%) !important;
    column-gap: 28px !important;
  }

  /* The shorter production H1 is intentionally sized for a
     clean three-line editorial lockup. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    max-width: 700px !important;
    font-size: clamp(3rem, 3.65vw, 3.55rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.035em !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}

/* ---------- HERO → INTRO TRANSITION ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section {
  padding-top: 24px !important;
  padding-bottom: 8px !important;
}

/* ---------- ROADMAP CALLOUT ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section .btp-highlight-box {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  justify-content: center !important;
  text-align: center !important;
}

/* ---------- BODY SECTION WIDTH ---------- */

/* Every direct editorial content element gets the same centered
   broad width. This eliminates the recurring narrow-right-column
   appearance visible in the screenshots. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > * {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Keep vertical margins under explicit control after centering. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h2 {
  margin-top: 0 !important;
  margin-bottom: 14px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h3 {
  margin-top: 24px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h4 {
  margin-top: 18px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* ---------- CENTERED FUNCTIONAL COMPONENTS ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-comparison,
.btp-career-development-plan.btp-career-article-v7
.btp-review-grid,
.btp-career-development-plan.btp-career-article-v7
.btp-framework,
.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper,
.btp-career-development-plan.btp-career-article-v7
.btp-template-box,
.btp-career-development-plan.btp-career-article-v7
.btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-tip-box,
.btp-career-development-plan.btp-career-article-v7
.btp-goal-card {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Comparison cards: genuinely equal columns and centered. */
.btp-career-development-plan.btp-career-article-v7
.btp-comparison {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

/* Three review cards: equal columns. */
.btp-career-development-plan.btp-career-article-v7
.btp-review-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

/* Six-step framework remains evenly distributed. */
.btp-career-development-plan.btp-career-article-v7
.btp-framework {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

/* ---------- IMAGES ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-figure,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder img,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-figure img,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image img {
  display: block !important;
  width: 100% !important;
  max-width: 1080px !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------- RESOURCE / CALLOUT WIDTH ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-highlight-box,
.btp-career-development-plan.btp-career-article-v7
.btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-tip-box {
  box-sizing: border-box !important;
}

/* ---------- LATER-PAGE CONTAINERS ---------- */

.btp-career-development-plan.btp-career-article-v7
.btp-faq,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion,
.btp-career-development-plan.btp-career-article-v7
.btp-sources {
  width: min(1120px, calc(100% - 48px)) !important;
  max-width: 1120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ---------- TABLET ---------- */

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    font-size: clamp(2.55rem, 4.4vw, 3.15rem) !important;
    line-height: 1.02 !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > *,
  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box {
    width: 100% !important;
    max-width: 1000px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-framework {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

/* ---------- MOBILE ---------- */

@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 18px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > *,
  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-internal-resource,
  .btp-career-development-plan.btp-career-article-v7
  .btp-source-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-tip-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-goal-card,
  .btp-career-development-plan.btp-career-article-v7
  .btp-image-placeholder,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-figure {
    width: 100% !important;
    max-width: 100% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison {
    grid-template-columns: 1fr !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid {
    grid-template-columns: 1fr !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-framework {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* ============================================================
   V7.5 — PRODUCTION HERO + WIDTH REFINEMENT
   Blueprint To Progress — Career Article System

   Purpose:
   - Match the Career Hub Hero geometry more closely.
   - Preserve the original Article 1 H1 wording.
   - Keep the H1 at a controlled three-line desktop size.
   - Increase the Hero image to approximately 568px wide.
   - Keep the article's major content systems centered.
   - Avoid changing the established article content/design unnecessarily.
   ============================================================ */

@media (min-width: 1100px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    width: 1180px !important;
    max-width: 1180px !important;
    grid-template-columns: minmax(0, 564px) minmax(0, 568px) !important;
    column-gap: 48px !important;
    align-items: center !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 564px !important;
    max-width: 564px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    max-width: 564px !important;
    font-size: 52px !important;
    line-height: 1.03 !important;
    letter-spacing: -0.035em !important;
    margin-bottom: 24px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 568px !important;
    max-width: 568px !important;
    justify-self: end !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    width: 568px !important;
    max-width: 568px !important;
    height: auto !important;
  }

  /* Keep major body systems aligned to the same site grid. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: min(1180px, calc(100% - 48px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > p,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ul,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ol,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > blockquote,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h3,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h4 {
    max-width: 1080px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-internal-resource,
  .btp-career-development-plan.btp-career-article-v7
  .btp-source-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-tip-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-goal-card {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-image-placeholder,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-figure,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-skills-gap-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-image {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* Preserve a deliberate, but not excessive, Hero-to-intro transition. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 28px !important;
    padding-bottom: 10px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.82fr) !important;
    column-gap: 28px !important;
  }
}

@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ============================================================
   V7.5 — PRODUCTION HERO + WIDTH REFINEMENT
   Blueprint To Progress — Career Article System

   Purpose:
   - Match the Career Hub Hero geometry more closely.
   - Preserve the original Article 1 H1 wording.
   - Keep the H1 at a controlled three-line desktop size.
   - Increase the Hero image to approximately 568px wide.
   - Keep the article's major content systems centered.
   - Avoid changing the established article content/design unnecessarily.
   ============================================================ */

@media (min-width: 1100px) {
  .btp-career-development-plan.btp-career-article-v7 .btp-career-hero-grid {
    width: 1180px !important;
    max-width: 1180px !important;
    grid-template-columns: minmax(0, 564px) minmax(0, 568px) !important;
    column-gap: 48px !important;
    align-items: center !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 564px !important;
    max-width: 564px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    max-width: 564px !important;
    font-size: 52px !important;
    line-height: 1.03 !important;
    letter-spacing: -0.035em !important;
    margin-bottom: 24px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 568px !important;
    max-width: 568px !important;
    justify-self: end !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    width: 568px !important;
    max-width: 568px !important;
    height: auto !important;
  }

  /* Keep major body systems aligned to the same site grid. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: min(1180px, calc(100% - 48px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > p,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ul,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ol,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > blockquote,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h3,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h4 {
    max-width: 1080px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-internal-resource,
  .btp-career-development-plan.btp-career-article-v7
  .btp-source-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-tip-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-goal-card {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-image-placeholder,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-figure,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-skills-gap-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-image {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* Preserve a deliberate, but not excessive, Hero-to-intro transition. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 28px !important;
    padding-bottom: 10px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: min(1080px, 100%) !important;
    max-width: 1080px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.82fr) !important;
    column-gap: 28px !important;
  }
}

@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ============================================================
   V7.6 — SCREENSHOT-VERIFIED HERO LOCKUP
   ============================================================ */

@media (min-width: 1100px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title,
  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    max-width: 564px !important;
    font-size: 48px !important;
    line-height: 1.04 !important;
    letter-spacing: -0.035em !important;
  }

  /* Let the roadmap use the full site grid so its five questions
     remain visually balanced and centered. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: min(1180px, calc(100% - 48px)) !important;
    max-width: 1180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
}

/* ============================================================
   V7.7 — BODY GRID + VERTICAL RHYTHM REFINEMENT
   Blueprint To Progress — Career Article System

   IMPORTANT:
   This block deliberately does NOT alter the approved Hero geometry,
   Hero image sizing, or the 48px desktop H1 lockup.

   Goals:
   1. One consistent article body grid.
   2. Equal left/right margins for functional modules.
   3. Reduce excessive section-to-section whitespace.
   4. Normalize tables, comparisons, cards and callouts.
   5. Center all editorial images within the same functional width.
   6. Keep the lower-page FAQ / Related / Conclusion / Sources aligned.
   ============================================================ */

/* ------------------------------------------------------------
   1. BODY GRID
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-career-content {
  width: 100% !important;
  background: #F7FAFC !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-content > .btp-career-container {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* The article's normal working width.
   1080px gives broad editorial lines while preserving the
   1180px outer site grid. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > * {
  box-sizing: border-box !important;
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ------------------------------------------------------------
   2. SECTION RHYTHM
   ------------------------------------------------------------ */

/* First body section after the intro. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section {
  padding-top: 34px !important;
  padding-bottom: 6px !important;
}

/* Subsequent sections use one predictable gap instead of
   accumulating large independent top margins. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section + .btp-editorial-section {
  padding-top: 42px !important;
}

/* Avoid margin-collapsing surprises inside the section system. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h2,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h3,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h4,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > blockquote {
  position: relative;
}

/* Heading rhythm */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h2 {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h3 {
  margin-top: 24px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h4 {
  margin-top: 18px !important;
  margin-bottom: 7px !important;
}

/* Paragraph/list rhythm */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* Do not leave a large trailing gap before the next section. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > *:last-child {
  margin-bottom: 0 !important;
}

/* ------------------------------------------------------------
   3. FUNCTIONAL MODULES — SAME WIDTH, SAME CENTER
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-comparison,
.btp-career-development-plan.btp-career-article-v7
.btp-review-grid,
.btp-career-development-plan.btp-career-article-v7
.btp-framework,
.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper,
.btp-career-development-plan.btp-career-article-v7
.btp-template-box,
.btp-career-development-plan.btp-career-article-v7
.btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-tip-box,
.btp-career-development-plan.btp-career-article-v7
.btp-goal-card {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Comparison cards: exactly equal columns. */
.btp-career-development-plan.btp-career-article-v7
.btp-comparison {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

/* Review cards: exactly equal columns. */
.btp-career-development-plan.btp-career-article-v7
.btp-review-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

/* Six-step framework: equal-width steps. */
.btp-career-development-plan.btp-career-article-v7
.btp-framework {
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

/* ------------------------------------------------------------
   4. TABLES — FULL FUNCTIONAL WIDTH
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
  overflow-x: auto !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper table {
  width: 100% !important;
  max-width: none !important;
}

/* ------------------------------------------------------------
   5. CALLOUTS / RESOURCE BOXES
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-tip-box,
.btp-career-development-plan.btp-career-article-v7
.btp-goal-card {
  margin-top: 20px !important;
  margin-bottom: 20px !important;
}

/* ------------------------------------------------------------
   6. EDITORIAL IMAGES
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-figure,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image {
  width: min(1080px, 100%) !important;
  max-width: 1080px !important;
  margin: 22px auto !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder img,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-figure img,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image img {
  display: block !important;
  width: 100% !important;
  max-width: 1080px !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ------------------------------------------------------------
   7. INTRO / ROADMAP TRANSITION
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section {
  padding-top: 24px !important;
  padding-bottom: 4px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section .btp-highlight-box {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin: 20px auto 18px !important;
  text-align: center !important;
  justify-content: center !important;
}

/* ------------------------------------------------------------
   8. LOWER-PAGE SYSTEMS
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-faq,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion,
.btp-career-development-plan.btp-career-article-v7
.btp-sources {
  width: min(1080px, calc(100% - 48px)) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-faq,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion {
  margin-top: 44px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-sources {
  margin-top: 44px !important;
}

/* Related cards use the full functional width. */
.btp-career-development-plan.btp-career-article-v7
.btp-related-card {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin: 12px 0 !important;
}

/* Final callout follows the same centered body grid. */
.btp-career-development-plan.btp-career-article-v7
.btp-final-callout {
  width: 100% !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Career Hub CTA remains broad and centered. */
.btp-career-development-plan.btp-career-article-v7
.btp-career-hub-cta {
  width: min(1080px, calc(100% - 48px)) !important;
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ------------------------------------------------------------
   9. TEMPLATE AREA — REMOVE ARTIFICIAL EXTRA GAPS
   ------------------------------------------------------------ */

.btp-career-development-plan.btp-career-article-v7
.btp-template-box > * {
  margin-top: 0;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box > * + * {
  margin-top: 12px;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box table {
  margin-top: 8px !important;
  margin-bottom: 14px !important;
}

/* ------------------------------------------------------------
   10. TABLET
   ------------------------------------------------------------ */

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 30px !important;
    padding-bottom: 4px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 34px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > *,
  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-internal-resource,
  .btp-career-development-plan.btp-career-article-v7
  .btp-source-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-tip-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-goal-card {
    width: min(100%, 1000px) !important;
    max-width: 1000px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
  }
}

/* ------------------------------------------------------------
   11. MOBILE
   ------------------------------------------------------------ */

@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 22px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 26px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > *,
  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-internal-resource,
  .btp-career-development-plan.btp-career-article-v7
  .btp-source-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-tip-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-goal-card,
  .btp-career-development-plan.btp-career-article-v7
  .btp-image-placeholder,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-figure,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-skills-gap-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-image {
    width: 100% !important;
    max-width: 100% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid {
    grid-template-columns: 1fr !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-framework {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }
}

/* ============================================================
   V7.8 — FINAL BODY GEOMETRY NORMALIZATION
   Blueprint To Progress — Career Article 1

   IMPORTANT:
   - CSS ONLY. The approved Article 1 HTML is unchanged.
   - The approved Hero is intentionally LOCKED.
   - The 48px desktop H1 lockup is intentionally LOCKED.
   - The Hero image/grid is intentionally LOCKED.

   This block resolves the remaining legacy width and rhythm
   conflicts in the article body.
   ============================================================ */

/* ============================================================
   1. SINGLE SOURCE OF TRUTH FOR THE ARTICLE BODY GRID
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7 {
  --btp-body-max: 1080px;
  --btp-site-max: 1180px;
  --btp-side-gap: 24px;
  --btp-section-gap: 38px;
  --btp-module-gap: 20px;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-content {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #F7FAFC !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-content > .btp-career-container {
  width: min(var(--btp-site-max), calc(100% - 48px)) !important;
  max-width: var(--btp-site-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ============================================================
   2. NORMAL EDITORIAL WIDTH
   Remove older 900 / 920 / 960px prose restrictions.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h2,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h3,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h4,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > blockquote {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* ============================================================
   3. SECTION VERTICAL RHYTHM
   Reduce inherited 46/50/54/58px generations to one system.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 30px !important;
  padding-bottom: 4px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section + .btp-editorial-section {
  padding-top: var(--btp-section-gap) !important;
}

/* First heading in each section begins cleanly. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > h2:first-child {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* Subheadings are close enough to their preceding copy to avoid
   the "separate section" appearance seen in the screenshot. */
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section h3 {
  margin-top: 22px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section h4 {
  margin-top: 18px !important;
  margin-bottom: 7px !important;
}

/* ============================================================
   4. PROSE RHYTHM
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > p,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ul,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > ol {
  padding-left: 24px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > blockquote {
  margin-top: 16px !important;
  margin-bottom: 18px !important;
}

/* ============================================================
   5. NESTED CONTENT — PREVENT HIDDEN WIDTH RESTRICTIONS
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-table-wrapper,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-comparison,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-review-grid,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-framework,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-template-box,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-tip-box,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section .btp-goal-card,
.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section figure {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* ============================================================
   6. TABLES
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper {
  margin-top: 18px !important;
  margin-bottom: 18px !important;
  overflow-x: auto !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper table {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  table-layout: auto !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper th,
.btp-career-development-plan.btp-career-article-v7
.btp-table-wrapper td {
  box-sizing: border-box !important;
}

/* ============================================================
   7. COMPARISON GRID — TRUE EQUAL COLUMNS
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-comparison {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 18px auto 20px !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-comparison > div {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

/* ============================================================
   8. REVIEW CARDS — TRUE EQUAL COLUMNS
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-review-grid {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 18px auto 20px !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-review-grid > div {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  box-sizing: border-box !important;
}

/* ============================================================
   9. SIX-PART FRAMEWORK
   Preserve the existing framework's arrow architecture.
   Only normalize its outer geometry and spacing.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-framework {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 18px auto 20px !important;
  box-sizing: border-box !important;
}

/* ============================================================
   10. BODY IMAGES — ONE CENTERING SYSTEM
   Hero is NOT included here.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section figure,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image,
.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 20px auto !important;
  padding: 0 !important;
  text-align: center !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section figure img,
.btp-career-development-plan.btp-career-article-v7
.btp-framework-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-template-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-skills-gap-image img,
.btp-career-development-plan.btp-career-article-v7
.btp-image-placeholder img {
  display: block !important;
  width: 100% !important;
  max-width: var(--btp-body-max) !important;
  height: auto !important;
  margin: 0 auto !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section figure figcaption {
  width: 100% !important;
  max-width: var(--btp-body-max) !important;
  margin: 8px auto 0 !important;
  text-align: center !important;
}

/* ============================================================
   11. RESOURCE / CALLOUT BOXES
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-internal-resource,
.btp-career-development-plan.btp-career-article-v7
.btp-source-box,
.btp-career-development-plan.btp-career-article-v7
.btp-tip-box,
.btp-career-development-plan.btp-career-article-v7
.btp-goal-card {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 18px auto !important;
  box-sizing: border-box !important;
}

/* ============================================================
   12. TEMPLATE BOX — KEEP INTERNAL CONTENT TIGHT
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-template-box {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 20px auto !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box > h3 {
  margin-top: 20px !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box > p {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box .btp-writing-line {
  margin-top: 4px !important;
  margin-bottom: 10px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-template-box .btp-table-wrapper {
  margin-top: 10px !important;
  margin-bottom: 16px !important;
}

/* ============================================================
   13. LOWER-PAGE SYSTEMS
   These sections are siblings of MAIN but still inside ARTICLE.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-faq,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion,
.btp-career-development-plan.btp-career-article-v7
.btp-sources,
.btp-career-development-plan.btp-career-article-v7
.btp-career-hub-cta {
  width: min(var(--btp-body-max), calc(100% - 48px)) !important;
  max-width: var(--btp-body-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-faq {
  margin-top: 36px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-related-articles {
  margin-top: 38px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-conclusion {
  margin-top: 40px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-sources {
  margin-top: 36px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-hub-cta {
  margin-top: 32px !important;
}

/* Lower-page headings use the same article width. */
.btp-career-development-plan.btp-career-article-v7
.btp-faq h2,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles h2,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion h2,
.btp-career-development-plan.btp-career-article-v7
.btp-sources h2 {
  width: 100% !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

/* Related cards occupy the full related-guide grid. */
.btp-career-development-plan.btp-career-article-v7
.btp-related-card {
  width: 100% !important;
  max-width: none !important;
  margin: 10px 0 !important;
  box-sizing: border-box !important;
}

/* Final conclusion callout fills the same article width. */
.btp-career-development-plan.btp-career-article-v7
.btp-final-callout {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin-top: 20px !important;
}

/* ============================================================
   14. ROADMAP / INTRO TRANSITION
   Keep the Hero locked, but give the first body content a
   deliberate, not excessive, transition.
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section {
  padding-top: 24px !important;
  padding-bottom: 4px !important;
}

.btp-career-development-plan.btp-career-article-v7
.btp-career-intro-section .btp-highlight-box {
  width: min(var(--btp-body-max), 100%) !important;
  max-width: var(--btp-body-max) !important;
  margin: 18px auto 18px !important;
  text-align: center !important;
  justify-content: center !important;
}

/* ============================================================
   15. PREVENT LAST-CHILD MARGIN STACKING
   ============================================================ */

.btp-career-development-plan.btp-career-article-v7
.btp-editorial-section > *:last-child,
.btp-career-development-plan.btp-career-article-v7
.btp-faq > *:last-child,
.btp-career-development-plan.btp-career-article-v7
.btp-related-articles > *:last-child,
.btp-career-development-plan.btp-career-article-v7
.btp-conclusion > *:last-child,
.btp-career-development-plan.btp-career-article-v7
.btp-sources > *:last-child {
  margin-bottom: 0 !important;
}

/* ============================================================
   16. TABLET
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-article-v7 {
    --btp-body-max: 1000px;
    --btp-section-gap: 32px;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-content > .btp-career-container {
    width: min(1000px, calc(100% - 40px)) !important;
    max-width: 1000px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 26px !important;
    padding-bottom: 3px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 32px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: min(1000px, calc(100% - 40px)) !important;
    max-width: 1000px !important;
  }
}

/* ============================================================
   17. MOBILE
   ============================================================ */

@media (max-width: 767px) {

  .btp-career-development-plan.btp-career-article-v7 {
    --btp-body-max: 100%;
    --btp-section-gap: 26px;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-content > .btp-career-container {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 20px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 26px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h2,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h3,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h4,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > p,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ul,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > ol,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > blockquote,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-review-grid,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-framework,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section figure {
    width: 100% !important;
    max-width: 100% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-review-grid {
    grid-template-columns: 1fr !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-faq,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles,
  .btp-career-development-plan.btp-career-article-v7
  .btp-conclusion,
  .btp-career-development-plan.btp-career-article-v7
  .btp-sources,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hub-cta {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ============================================================
   V7.8 END
   ============================================================ */

/* ============================================================
   BTP CAREER ARTICLES — V7.9 TYPOGRAPHY PROTECTION
   Keeps V7.8 geometry while restoring readable framework/detail
   typography. Hero/H1 rules are intentionally untouched.
   ============================================================ */

.btp-career-article .btp-framework,
.btp-career-article .btp-career-framework,
.btp-career-article .btp-framework-section,
.btp-career-article .career-development-framework {
  font-size: 16px;
  line-height: 1.65;
}

.btp-career-article .btp-framework h2,
.btp-career-article .btp-framework-section h2,
.btp-career-article .career-development-framework h2 {
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.15;
  margin-top: 0;
  margin-bottom: 18px;
}

.btp-career-article .btp-framework h3,
.btp-career-article .btp-framework-section h3,
.btp-career-article .career-development-framework h3 {
  font-size: clamp(22px, 2vw, 28px);
  line-height: 1.25;
  margin-top: 30px;
  margin-bottom: 10px;
}

.btp-career-article .btp-framework h4,
.btp-career-article .btp-framework-section h4,
.btp-career-article .career-development-framework h4 {
  font-size: 18px;
  line-height: 1.35;
  margin-top: 20px;
  margin-bottom: 8px;
}

.btp-career-article .btp-framework p,
.btp-career-article .btp-framework-section p,
.btp-career-article .career-development-framework p {
  font-size: 16px;
  line-height: 1.65;
  margin-top: 0;
  margin-bottom: 14px;
}

.btp-career-article .btp-framework ul,
.btp-career-article .btp-framework ol,
.btp-career-article .btp-framework-section ul,
.btp-career-article .btp-framework-section ol,
.btp-career-article .career-development-framework ul,
.btp-career-article .career-development-framework ol {
  font-size: 16px;
  line-height: 1.65;
  margin-top: 8px;
  margin-bottom: 16px;
  padding-left: 24px;
}

.btp-career-article .btp-framework li,
.btp-career-article .btp-framework-section li,
.btp-career-article .career-development-framework li {
  margin-bottom: 5px;
}

.btp-career-article .btp-framework .btp-step,
.btp-career-article .btp-framework .btp-framework-step,
.btp-career-article .btp-framework-section .btp-step,
.btp-career-article .career-development-framework .btp-step {
  font-size: 14px;
  line-height: 1.45;
}

.btp-career-article .btp-framework .btp-step strong,
.btp-career-article .btp-framework .btp-framework-step strong,
.btp-career-article .btp-framework-section .btp-step strong {
  font-size: 15px;
}

.btp-career-article .btp-framework img,
.btp-career-article .btp-framework-section img,
.btp-career-article .career-development-framework img {
  max-width: 100%;
  height: auto;
}

.btp-career-article .btp-framework figcaption,
.btp-career-article .btp-framework-section figcaption,
.btp-career-article .career-development-framework figcaption {
  font-size: 13px;
  line-height: 1.45;
}

.btp-career-article .btp-framework > section,
.btp-career-article .btp-framework-section > section,
.btp-career-article .career-development-framework > section {
  font-size: 16px;
  line-height: 1.65;
}

.btp-career-article .btp-framework table,
.btp-career-article .btp-framework-section table,
.btp-career-article .career-development-framework table {
  width: 100%;
  font-size: 15px;
  line-height: 1.5;
}

.btp-career-article .btp-framework .btp-comparison-card,
.btp-career-article .btp-framework-section .btp-comparison-card,
.btp-career-article .career-development-framework .btp-comparison-card {
  font-size: 15px;
  line-height: 1.55;
}

@media (max-width: 767px) {
  .btp-career-article .btp-framework,
  .btp-career-article .btp-career-framework,
  .btp-career-article .btp-framework-section,
  .btp-career-article .career-development-framework {
    font-size: 15px;
    line-height: 1.6;
  }

  .btp-career-article .btp-framework h2,
  .btp-career-article .btp-framework-section h2,
  .btp-career-article .career-development-framework h2 {
    font-size: 28px;
  }

  .btp-career-article .btp-framework h3,
  .btp-career-article .btp-framework-section h3,
  .btp-career-article .career-development-framework h3 {
    font-size: 21px;
  }

  .btp-career-article .btp-framework p,
  .btp-career-article .btp-framework-section p,
  .btp-career-article .career-development-framework p {
    font-size: 15px;
  }
}

/* ============================================================
   BTP CAREER ARTICLES — V7.10 RESPONSIVE PRODUCTION OVERRIDES
   ============================================================
   V7.9 remains the base stylesheet.
   These overrides correct only the tablet/mobile responsive behavior
   identified in the latest Elementor screenshots.

   Desktop >= 1100px:
     unchanged from V7.9.

   Tablet 768–1099px:
     Hero changes from compressed 2-column to a single-column layout.

   Mobile <= 767px:
     Hero remains single-column, with controlled typography/spacing.

   IMPORTANT:
   The original H1 wording is retained.
   ============================================================ */

/* ============================================================
   TABLET — 768px to 1099px
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  /* Keep the broad article grid centered. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /*
   * HERO: switch to one column at tablet width.
   *
   * This is the key correction. The previous V7.9 rule used a 54/46
   * split, which squeezed the H1 into the narrow left column and caused
   * the six-line tablet heading visible in the screenshots.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
    grid-template-columns: 1fr !important;
    column-gap: 0 !important;
    row-gap: 28px !important;
    align-items: start !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 100% !important;
    max-width: 900px !important;
  }

  /*
   * Preserve the original SEO H1 and solve wrapping through available
   * width + typography rather than changing the wording.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    width: 100% !important;
    max-width: 900px !important;
    font-size: clamp(3rem, 5.4vw, 3.35rem) !important;
    line-height: 1.02 !important;
    letter-spacing: -0.035em !important;
    margin-bottom: 20px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead {
    width: 100% !important;
    max-width: 820px !important;
    font-size: 1.22rem !important;
    line-height: 1.58 !important;
    margin-bottom: 16px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-support {
    width: 100% !important;
    max-width: 820px !important;
    line-height: 1.62 !important;
  }

  /* Hero image now follows the complete Hero copy. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media img,
  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /*
   * Hero intro remains centered and uses the same broad content width.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-intro {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /*
   * Keep the process/roadmap callout centered and broad.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-roadmap-callout {
    width: min(100%, 960px) !important;
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }

  /* Preserve equal-width comparison cards at tablet. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-comparison {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Keep tables and major visual modules centered. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-figure,
  .btp-career-development-plan.btp-career-article-v7
  .btp-template-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-skills-gap-image,
  .btp-career-development-plan.btp-career-article-v7
  .btp-framework-image {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ============================================================
   MOBILE — <= 767px
   ============================================================ */

@media (max-width: 767px) {

  /*
   * Keep the established 16px side gutter. This also prevents the
   * article from touching the viewport edges.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-intro {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /*
   * Explicitly retain a single-column Hero.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    align-items: start !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 100% !important;
    max-width: none !important;
  }

  /*
   * Original H1 wording retained.
   * The size is intentionally moderate so the title remains prominent
   * without consuming excessive vertical space.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    width: 100% !important;
    max-width: none !important;
    font-size: clamp(2.25rem, 9.8vw, 2.8rem) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em !important;
    margin-bottom: 18px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead {
    width: 100% !important;
    max-width: none !important;
    font-size: 1.08rem !important;
    line-height: 1.58 !important;
    margin-bottom: 14px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-support {
    width: 100% !important;
    max-width: none !important;
    line-height: 1.62 !important;
    margin-bottom: 0 !important;
  }

  /*
   * Image follows the copy, remains centered, and fills the available
   * mobile content width without distortion.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    order: 2 !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 12px !important;
  }

  /*
   * Keep the Hero-to-introduction transition compact but visible.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 14px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 0 !important;
    padding-bottom: 6px !important;
  }

  /*
   * Process box: centered, full available width and naturally wrapping.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-roadmap-callout {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 20px 16px !important;
    text-align: center !important;
  }

  /*
   * Preserve readable body typography while avoiding unnecessary
   * vertical expansion.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 24px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 30px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h2 {
    margin-bottom: 12px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h3 {
    margin-top: 22px !important;
    margin-bottom: 8px !important;
  }

  /*
   * All major modules stay centered and use the available mobile width.
   */
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-table-wrapper,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-comparison,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-review-grid,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-framework,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section .btp-template-box,
  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section figure {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Tables scroll locally when their intrinsic columns require it. */
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper table {
    min-width: 620px;
  }
}

/* ============================================================
   VERY SMALL MOBILE — <= 380px
   ============================================================ */

@media (max-width: 380px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-readable-container,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-intro,
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: calc(100% - 28px) !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    font-size: 2.2rem !important;
    line-height: 1.03 !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-roadmap-callout {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ============================================================
   BTP CAREER ARTICLES — V7.11 SURGICAL RESPONSIVE PATCH
   ============================================================
   Purpose:
   1. Override the Article 1 inline Hero correction safely.
   2. Restore a genuine single-column Hero at tablet width.
   3. Give the original H1 enough width to achieve a clean,
      approximately three-line tablet presentation.
   4. Preserve the successful V7.10 desktop/body geometry.
   5. Refine mobile Hero typography and the process/highlight box.

   IMPORTANT:
   The selectors intentionally use repeated parent classes to
   provide higher specificity than the inline Article 1 style
   block contained in the HTML. This is necessary because that
   inline block appears after the external stylesheet link.
   ============================================================ */

/* ============================================================
   TABLET — 768px to 1099px
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  /* ------------------------------------------------------------
     HERO GRID
     The HTML contains a later inline rule setting:
       54% / 46%
     V7.11 deliberately overrides that rule with higher
     specificity and !important.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
    row-gap: 28px !important;
    align-items: start !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 100% !important;
    max-width: 900px !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* ------------------------------------------------------------
     ORIGINAL H1 RETAINED
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    width: 100% !important;
    max-width: 900px !important;
    font-size: clamp(44px, 5.2vw, 52px) !important;
    line-height: 1.03 !important;
    letter-spacing: -0.035em !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 20px !important;
  }

  /* Keep Hero introductory copy comfortably readable. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead {
    width: 100% !important;
    max-width: 820px !important;
    font-size: 1.20rem !important;
    line-height: 1.58 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 16px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-support {
    width: 100% !important;
    max-width: 820px !important;
    line-height: 1.62 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* ------------------------------------------------------------
     HERO IMAGE
     The image follows the complete Hero copy and is centered.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 100% !important;
    max-width: 1000px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    order: 2 !important;
    align-self: start !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media img,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 16px !important;
  }

  /* Keep the transition after the Hero deliberate but compact. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 18px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 4px !important;
  }

  /* ------------------------------------------------------------
     PROCESS / HIGHLIGHT BOX
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: min(100%, 960px) !important;
    max-width: 960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    justify-content: center !important;
  }
}

/* ============================================================
   MOBILE — <= 767px
   ============================================================ */

@media (max-width: 767px) {

  /* ------------------------------------------------------------
     HERO GRID
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: calc(100% - 32px) !important;
    max-width: none !important;
    grid-template-columns: minmax(0, 1fr) !important;
    column-gap: 0 !important;
    row-gap: 18px !important;
    gap: 18px !important;
    align-items: start !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  /* ------------------------------------------------------------
     MOBILE H1
     Original wording retained.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    width: 100% !important;
    max-width: none !important;
    font-size: clamp(36px, 9.6vw, 42px) !important;
    line-height: 1.04 !important;
    letter-spacing: -0.025em !important;
    margin-bottom: 16px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead {
    width: 100% !important;
    max-width: none !important;
    font-size: 1.06rem !important;
    line-height: 1.55 !important;
    margin-bottom: 13px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-support {
    width: 100% !important;
    max-width: none !important;
    line-height: 1.58 !important;
    margin-bottom: 0 !important;
  }

  /* ------------------------------------------------------------
     MOBILE HERO IMAGE
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    order: 2 !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media img,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10 !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-radius: 12px !important;
  }

  /* Avoid excessive empty space before the first body content. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 10px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 0 !important;
    padding-bottom: 4px !important;
  }

  /* ------------------------------------------------------------
     PROCESS / HIGHLIGHT BOX
     This targets the actual HTML class used by Article 1:
     .btp-highlight-box
     rather than the unused .btp-roadmap-callout selector.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    width: 100% !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 18px !important;
    margin-bottom: 20px !important;
    padding: 18px 16px !important;
    text-align: center !important;
    justify-content: center !important;
    align-items: center !important;
    row-gap: 10px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box strong {
    font-size: 16px !important;
    line-height: 1.45 !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box span {
    font-size: 16px !important;
    line-height: 1 !important;
  }

  /* ------------------------------------------------------------
     ARTICLE BODY
     Retain V7.10's successful width system while slightly
     tightening mobile vertical rhythm.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 22px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 26px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h2 {
    margin-bottom: 12px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section > h3 {
    margin-top: 22px !important;
    margin-bottom: 8px !important;
  }
}

/* ============================================================
   VERY SMALL MOBILE — <= 380px
   ============================================================ */

@media (max-width: 380px) {

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: calc(100% - 28px) !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    font-size: 34px !important;
    line-height: 1.04 !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}

/* ============================================================
   BTP CAREER ARTICLES — V7.12 SURGICAL POLISH PATCH
   ============================================================
   Scope: visual polish only.
   V7.11 responsive architecture is intentionally preserved.

   Changes:
   1. Fine-tune tablet Hero rhythm without changing its
      single-column structure.
   2. Fine-tune mobile Hero spacing while preserving the
      current H1 wrapping and image placement.
   3. Reduce excess whitespace around the roadmap transition.
   4. Keep functional components centered and avoid width changes.
   5. No content, breakpoint, color, or structural changes.
   ============================================================ */

/* ------------------------------------------------------------
   DESKTOP — preserve V7.11 geometry; only normalize the Hero
   vertical rhythm and image alignment.
   ------------------------------------------------------------ */
@media (min-width: 1100px) {
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 24px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    align-self: center !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 18px !important;
    padding-bottom: 6px !important;
  }
}

/* ------------------------------------------------------------
   TABLET — 768px to 1099px
   Keep the V7.11 single-column Hero exactly as established.
   ------------------------------------------------------------ */
@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    row-gap: 24px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 16px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 8px !important;
    padding-bottom: 4px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    margin-top: 16px !important;
    margin-bottom: 18px !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 20px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 24px !important;
  }
}

/* ------------------------------------------------------------
   MOBILE — <= 767px
   Preserve the successful V7.11 single-column Hero and current
   H1 wrapping; tighten only the spaces visible in M1/M2.
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    row-gap: 16px !important;
    gap: 16px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    margin-bottom: 14px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead {
    margin-bottom: 12px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 8px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section .btp-highlight-box {
    margin-top: 16px !important;
    margin-bottom: 18px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 18px !important;
    padding-bottom: 0 !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 22px !important;
  }
}

/* ------------------------------------------------------------
   VERY SMALL MOBILE — <= 380px
   Preserve the proven V7.11 34px H1 lock.
   ------------------------------------------------------------ */
@media (max-width: 380px) {
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    row-gap: 15px !important;
    gap: 15px !important;
  }
}

/* ============================================================
   V7.13 — DESKTOP EDITORIAL RHYTHM MICRO-POLISH
   ------------------------------------------------------------
   Scope:
   - Desktop only: >= 1100px
   - Preserves V7.12 Hero/grid/responsive architecture
   - Tightens only editorial vertical rhythm by small amounts
   - No H1, image, breakpoint, color, width, or mobile changes
   ============================================================ */

@media (min-width: 1100px) {

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 44px !important;
    padding-bottom: 10px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 50px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h2,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-faq h2,
  .btp-career-development-plan.btp-career-article-v7
  .btp-related-articles h2,
  .btp-career-development-plan.btp-career-development-plan.btp-conclusion h2,
  .btp-career-development-plan.btp-career-development-plan.btp-sources h2 {
    margin-bottom: 20px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h3 {
    margin-top: 32px !important;
    margin-bottom: 12px !important;
  }
}

/* ============================================================
   BTP CAREER ARTICLES — V7.14 SURGICAL POLISH PATCH
   ------------------------------------------------------------
   Scope:
   - Desktop only: >= 1100px
   - V7.13 remains the complete base stylesheet.
   - Surgical refinement of desktop editorial rhythm only.
   - No changes to Hero geometry, H1, image sizing, widths,
     colors, content, breakpoints, tablet, or mobile behavior.
   - This patch is intentionally appended to the complete
     V7.13 production CSS so it cannot replace the base rules.
   ============================================================ */

@media (min-width: 1100px) {

  /* Slightly tighten the opening-to-body transition while
     retaining the V7.13 Hero/grid architecture. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero {
    padding-bottom: 20px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-intro-section {
    padding-top: 14px !important;
    padding-bottom: 4px !important;
  }

  /* Main editorial sections: small, controlled reduction in
     vertical dead space without changing typography. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section {
    padding-top: 40px !important;
    padding-bottom: 8px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section + .btp-editorial-section {
    padding-top: 46px !important;
  }

  /* Keep section headings visually connected to their content. */
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h2,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-faq h2,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-related-articles h2,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-conclusion h2,
  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-sources h2 {
    margin-bottom: 18px !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-editorial-section h3 {
    margin-top: 28px !important;
    margin-bottom: 10px !important;
  }
}

/* ============================================================
   V7.15 — SURGICAL TABLET HERO LOCK PATCH
   ------------------------------------------------------------
   Purpose:
   - Restore the intended two-column Hero at iPad/tablet widths
     (768px–1099px).
   - Preserve the approved V7.14 desktop layout.
   - Preserve the approved V7.14 mobile single-column layout.
   - Do not alter H1 typography, image source, colors, roadmap,
     editorial spacing, tables, cards, footer, or mobile behavior.
   - This is an append-only override and must remain LAST.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 54%) minmax(0, 46%) !important;
    grid-auto-flow: row !important;
    column-gap: 22px !important;
    row-gap: 0 !important;
    align-items: center !important;
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    align-self: center !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image {
    width: 100% !important;
    margin: 0 !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(260px, 27vw, 315px) !important;
    aspect-ratio: auto !important;
    object-fit: cover !important;
    object-position: center !important;
  }
}


/* ============================================================
   V8.1 — SURGICAL TABLET HERO BALANCE PATCH
   Scope: Tablet only (768px–1024px)
   Purpose:
   - Give the Hero text column more horizontal room.
   - Reduce the tablet H1 slightly so it naturally wraps in
     approximately 4–5 lines.
   - Reduce Hero image width without affecting desktop/mobile.
   - Leave all other page sections untouched.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1024px) {

  /* Hero two-column balance */
  .btp-article-hero {
    grid-template-columns: minmax(0, 57%) minmax(0, 43%);
    column-gap: 24px;
    align-items: start;
  }

  /* Tablet Hero heading */
  .btp-article-hero h1 {
    font-size: 44px;
    line-height: 1.02;
    letter-spacing: -0.02em;
  }

  /* Tablet Hero image */
  .btp-article-hero img {
    width: 94%;
    max-width: 100%;
    height: auto;
    justify-self: end;
  }
}


/* ============================================================
   V8.2 — SURGICAL TABLET HERO BALANCE — CORRECTED
   Scope: Tablet only (768px–1099px)

   V8.1 did not override the actual production selectors because
   the live stylesheet uses the scoped
   .btp-career-development-plan.btp-career-article-v7 selectors.

   V8.2 therefore targets the actual selectors and deliberately
   overrides the existing tablet !important rules.

   Objective:
   - Increase Hero text width substantially.
   - Reduce H1 size on Tablet.
   - Reduce Hero image width.
   - Preserve Desktop and Mobile exactly.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  /* 1. Rebalance the actual Hero grid:
        wider text / narrower image */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    width: min(100% - 40px, 1000px) !important;
    grid-template-columns: minmax(0, 60%) minmax(0, 40%) !important;
    column-gap: 18px !important;
    align-items: start !important;
  }

  /* 2. Give the Tablet H1 enough room to settle into
        approximately 4–5 lines */
  .btp-career-development-plan.btp-career-article-v7
  .btp-article-title {
    max-width: 100% !important;
    font-size: 40px !important;
    line-height: 1.02 !important;
    letter-spacing: -0.025em !important;
    margin-bottom: 18px !important;
  }

  /* 3. Keep supporting Hero copy inside the wider text column */
  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-lead,
  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-support {
    max-width: 100% !important;
  }

  /* 4. Reduce the actual Hero image column/visual footprint */
  .btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    width: 100% !important;
    max-width: 100% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-image {
    width: 100% !important;
    max-width: 100% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-hero-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(240px, 28vw, 300px) !important;
    object-fit: cover !important;
  }
}


/* ============================================================
   V8.3 — SURGICAL CASCADE OVERRIDE / TABLET HERO BALANCE
   ------------------------------------------------------------
   Root cause identified from DevTools:

   V8.2 was loaded, but its H1 rule was crossed out because an
   earlier production rule has GREATER selector specificity:

   .btp-career-development-plan.btp-career-development-plan
   .btp-career-article-v7 .btp-career-hero-content
   .btp-article-title

   V8.3 deliberately exceeds that specificity.

   Scope: Tablet only, 768px–1099px.
   Desktop and Mobile are untouched.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  /* ------------------------------------------------------------
     1. HERO GRID
     Wider text column / narrower image column.
     The repeated class raises specificity above the existing
     V7.11/V7.15 production rules.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    display: grid !important;
    width: min(100% - 40px, 1000px) !important;
    max-width: 1000px !important;
    grid-template-columns: minmax(0, 60%) minmax(0, 40%) !important;
    column-gap: 18px !important;
    row-gap: 0 !important;
    align-items: start !important;
  }

  /* ------------------------------------------------------------
     2. HERO CONTENT
     Prevent any inherited width constraint from shrinking the
     text column.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  /* ------------------------------------------------------------
     3. TABLET H1
     Existing production rule is 44–52px and is responsible for
     the excessive 7-line wrapping.

     42px is deliberately used here: it gives the wider text
     column enough room to settle into approximately 4–5 lines
     without making the Tablet heading look undersized.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-article-title {
    width: 100% !important;
    max-width: none !important;
    font-size: 42px !important;
    line-height: 1.02 !important;
    letter-spacing: -0.025em !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 18px !important;
  }

  /* ------------------------------------------------------------
     4. HERO COPY
     Keep the lead/support copy inside the widened text column.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-hero-lead,
  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-content .btp-hero-support {
    width: 100% !important;
    max-width: none !important;
  }

  /* ------------------------------------------------------------
     5. HERO IMAGE
     Force the image into the narrower second grid column.
     ------------------------------------------------------------ */

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    align-self: start !important;
    justify-self: stretch !important;
  }

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image,
  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-media .btp-hero-image img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: cover !important;
    object-position: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}


/* ============================================================
   V8.4 — SURGICAL TABLET HERO VISUAL BALANCE
   ------------------------------------------------------------
   Based on verified V8.3 iPad Mini result.

   V8.3 successfully solved the cascade problem and produced the
   desired 5-line Tablet H1.

   V8.4 changes ONE variable only:
   Hero grid = 56% text / 44% image.

   H1 remains exactly 42px.
   Desktop and Mobile remain untouched.
   All article content below the Hero remains untouched.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: minmax(0, 56%) minmax(0, 44%) !important;
  }

}


/* ============================================================
   V8.5 — FINAL TABLET HERO BALANCE
   ------------------------------------------------------------
   Based on verified V8.4 iPad Mini result.

   V8.4 successfully preserved the desired 5-line H1 while
   enlarging the Hero image.

   V8.5 makes ONE final visual-balance adjustment:
   Hero grid = 54% text / 46% image.

   H1 remains 42px.
   All V8.3 cascade corrections remain intact.
   Desktop and Mobile remain untouched.
   All content below the Hero remains untouched.

   If this passes the iPad Mini check, freeze the Tablet Hero
   CSS and stop further Hero iterations.
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-development-plan.btp-career-development-plan.btp-career-article-v7
  .btp-career-hero-grid {
    grid-template-columns: minmax(0, 54%) minmax(0, 46%) !important;
  }

}


/* =====================================================================
   BLUEPRINT TO PROGRESS — CAREER ARTICLES
   V9.4 CLEAN PRODUCTION RESPONSIVE TABLE LAYER
   ---------------------------------------------------------------------
   FINAL VERIFIED TABLE ARCHITECTURE

   1. Exactly 2 columns:
      - fit the available viewport
      - table-layout: fixed
      - normal word wrapping
      - no local horizontal scrollbar

   2. Three or more columns:
      - preserve intrinsic table structure
      - minimum working table width: 700px
      - local horizontal scrolling on narrow screens
      - normal word wrapping; never break words into characters

   This section intentionally appears at the END of the stylesheet so
   it wins over the older generic table rules contained in the base
   production CSS.

   V9.4 replaces the separate V9.1 / V9.2 / V9.3 table patches.
   ===================================================================== */


/* ============================================================
   MOBILE — EXACTLY TWO-COLUMN TABLES
   ============================================================ */

@media (max-width: 767px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table th,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table td {
    min-width: 0 !important;
    max-width: none !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table th:first-child,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table td:first-child {
    width: 50% !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table th:nth-child(2),
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table td:nth-child(2) {
    width: 50% !important;
  }
}


/* ============================================================
   MOBILE — THREE OR MORE COLUMNS
   ============================================================ */

@media (max-width: 767px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table {
    display: table !important;
    width: max-content !important;
    min-width: 700px !important;
    max-width: none !important;
    table-layout: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table th,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table td {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    box-sizing: border-box !important;
  }
}


/* ============================================================
   TABLET — EXACTLY TWO COLUMNS
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table {
    display: table !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table th,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(2)):not(:has(> table thead tr > th:nth-of-type(3))) > table td {
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    box-sizing: border-box !important;
  }
}


/* ============================================================
   TABLET — THREE OR MORE COLUMNS
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table {
    width: max-content !important;
    min-width: 700px !important;
    max-width: none !important;
    table-layout: auto !important;
    box-sizing: border-box !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table th,
  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper:has(> table thead tr > th:nth-of-type(3)) > table td {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
  }
}


/* ============================================================
   DESKTOP — KEEP TABLES NATURAL AND FULLY AVAILABLE
   ============================================================ */

@media (min-width: 1100px) {

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper {
    overflow-x: visible !important;
  }

  .btp-career-development-plan.btp-career-article-v7
  .btp-table-wrapper table {
    max-width: 100% !important;
  }
}


/* =====================================================================
   END V9.4 CLEAN PRODUCTION RESPONSIVE TABLE LAYER
   ===================================================================== */
/* Blueprint To Progress — Career Articles CSS v9.4. Scoped for Career Goals. */
.btp-career-goals{--btp-blue:#0077c8;--btp-blue-dark:#005fa3;--btp-navy:#17365d;--btp-text:#243f5f;--btp-muted:#5c6f82;--btp-panel:#fff;--btp-panel-blue:#eaf6ff;--btp-border:#d8e2ea;--btp-border-blue:#b8dff7;color:var(--btp-text);background:transparent;font-family:inherit;font-size:18px;line-height:1.72;max-width:100%;margin:0 auto;overflow-wrap:break-word}.btp-career-goals *,.btp-career-goals *:before,.btp-career-goals *:after{box-sizing:border-box}.btp-career-goals p{margin:0 0 1.05em}.btp-career-goals ul,.btp-career-goals ol{margin:0 0 1.25em;padding-left:1.45em}.btp-career-goals li{margin:0 0 .55em}.btp-career-goals strong{color:var(--btp-navy)}.btp-career-goals a{color:var(--btp-blue);text-decoration:none;font-weight:500}.btp-career-goals a:hover,.btp-career-goals a:focus{text-decoration:underline}.btp-career-goals h1,.btp-career-goals h2,.btp-career-goals h3{color:var(--btp-navy);line-height:1.2;letter-spacing:-.02em}.btp-career-goals h1{font-size:clamp(2.15rem,4vw,3.25rem);margin:0 0 .55em;font-weight:800}.btp-career-goals h2{font-size:clamp(1.75rem,3vw,2.35rem);margin:1.7em 0 .55em;font-weight:800}.btp-career-goals h3{font-size:clamp(1.18rem,2vw,1.42rem);margin:1.35em 0 .45em;font-weight:750}.btp-career-goals .btp-article-hero{margin-bottom:2.3rem}.btp-career-goals .btp-eyebrow{color:var(--btp-blue);font-size:.78rem;font-weight:800;letter-spacing:.08em;line-height:1.3;margin:0 0 .7rem;text-transform:uppercase}.btp-career-goals .btp-lead{color:var(--btp-navy);font-size:1.16em;line-height:1.65;margin-bottom:1.1em}.btp-career-goals .btp-callout{background:var(--btp-panel-blue);border:1px solid var(--btp-border-blue);border-left:4px solid var(--btp-blue);border-radius:10px;margin:1.35rem 0 1.6rem;padding:1.1rem 1.25rem}.btp-career-goals .btp-callout p:last-child{margin-bottom:0}.btp-career-goals .btp-step-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:1.35rem 0 2rem}.btp-career-goals .btp-step-card{background:var(--btp-panel);border:1px solid var(--btp-border);border-radius:10px;min-height:150px;padding:1.15rem;position:relative}.btp-career-goals .btp-step-card h3{font-size:1.05rem;margin:.2rem 0 .45rem 2.8rem}.btp-career-goals .btp-step-card p{color:var(--btp-muted);font-size:.94rem;line-height:1.55;margin:0}.btp-career-goals .btp-step-number{align-items:center;background:var(--btp-blue);border-radius:50%;color:#fff;display:inline-flex;font-size:.78rem;font-weight:800;height:36px;justify-content:center;left:1rem;line-height:1;position:absolute;top:1rem;width:36px}.btp-career-goals .btp-table-wrapper{border:1px solid var(--btp-border);border-radius:10px;margin:1.25rem 0 1.65rem;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.btp-career-goals .btp-table{border-collapse:separate;border-spacing:0;font-size:.94rem;line-height:1.48;margin:0;min-width:680px;width:100%}.btp-career-goals .btp-table th,.btp-career-goals .btp-table td{border-right:1px solid var(--btp-border);border-bottom:1px solid var(--btp-border);padding:.72rem .85rem;text-align:left;vertical-align:top}.btp-career-goals .btp-table th:last-child,.btp-career-goals .btp-table td:last-child{border-right:0}.btp-career-goals .btp-table tbody tr:last-child td{border-bottom:0}.btp-career-goals .btp-table thead th{background:var(--btp-blue);border-bottom-color:var(--btp-blue);color:#fff;font-weight:750}.btp-career-goals .btp-table thead th:first-child{border-top-left-radius:8px}.btp-career-goals .btp-table thead th:last-child{border-top-right-radius:8px}.btp-career-goals .btp-table tbody tr:nth-child(even) td{background:#f8fbfd}.btp-career-goals .btp-table tbody tr:nth-child(odd) td{background:#fff}.btp-career-goals .btp-table td{overflow-wrap:normal;word-break:normal}.btp-career-goals .btp-worksheet-table{min-width:620px}.btp-career-goals .btp-comparison-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:1.25rem 0 1.55rem}.btp-career-goals .btp-comparison-card{background:#fff;border:1px solid var(--btp-border);border-radius:10px;padding:1.25rem}.btp-career-goals .btp-comparison-card.btp-highlight{background:var(--btp-panel-blue);border-color:var(--btp-border-blue)}.btp-career-goals .btp-comparison-card span{color:var(--btp-blue-dark);display:block;font-size:.78rem;font-weight:800;letter-spacing:.04em;margin-bottom:.65rem}.btp-career-goals .btp-comparison-card p:last-child{margin-bottom:0}.btp-career-goals .btp-flow-box{align-items:center;background:var(--btp-panel-blue);border:1px solid var(--btp-border-blue);border-radius:10px;display:flex;flex-wrap:wrap;gap:.5rem .7rem;justify-content:center;margin:1.35rem 0 1.65rem;padding:1.15rem 1rem;text-align:center}.btp-career-goals .btp-flow-box strong{white-space:nowrap}.btp-career-goals .btp-flow-box span{color:var(--btp-blue);font-size:1.25rem;font-weight:700}.btp-career-goals .btp-faq{border-top:1px solid var(--btp-border);margin-top:2.5rem;padding-top:.2rem}.btp-career-goals .btp-resource-cta{background:var(--btp-panel-blue);border:1px solid var(--btp-border-blue);border-left:4px solid var(--btp-blue);border-radius:10px;margin:2.5rem 0 1rem;padding:1.4rem 1.35rem 1.5rem}.btp-career-goals .btp-resource-cta h2{font-size:clamp(1.45rem,2.5vw,1.9rem);margin:.15rem 0 .55rem}.btp-career-goals .btp-button{align-items:center;background:var(--btp-blue);border-radius:6px;color:#fff;display:inline-flex;font-weight:700;gap:.35rem;justify-content:center;margin-top:.3rem;padding:.72rem 1rem;text-decoration:none;transition:background-color .2s ease,transform .2s ease}.btp-career-goals .btp-button:hover,.btp-career-goals .btp-button:focus{background:var(--btp-blue-dark);color:#fff;text-decoration:none;transform:translateY(-1px)}
@media (max-width:900px){.btp-career-goals{font-size:17px}.btp-career-goals .btp-table{min-width:640px}}
@media (max-width:767px){.btp-career-goals{font-size:16px;line-height:1.68}.btp-career-goals h1{font-size:2rem}.btp-career-goals h2{font-size:1.65rem;margin-top:1.55em}.btp-career-goals h3{font-size:1.15rem}.btp-career-goals .btp-lead{font-size:1.05em}.btp-career-goals .btp-step-grid,.btp-career-goals .btp-comparison-grid{grid-template-columns:1fr}.btp-career-goals .btp-step-card{min-height:0}.btp-career-goals .btp-table{font-size:.94rem;min-width:680px}.btp-career-goals .btp-table th,.btp-career-goals .btp-table td{padding:.7rem .75rem}.btp-career-goals .btp-flow-box{align-items:stretch;flex-direction:column}.btp-career-goals .btp-flow-box span{line-height:1}.btp-career-goals .btp-resource-cta{padding:1.2rem 1rem 1.3rem}}
@media (max-width:420px){.btp-career-goals{font-size:15.5px}.btp-career-goals h1{font-size:1.8rem}.btp-career-goals h2{font-size:1.5rem}.btp-career-goals .btp-table{min-width:640px}}
@media (prefers-reduced-motion:reduce){.btp-career-goals .btp-button{transition:none}}


/* ============================================================
   BLUEPRINT TO PROGRESS — ARTICLE 2 STRUCTURAL LAYOUT FIX
   V9.4 — Career Goals

   Purpose:
   - Preserve the existing Article 2 component styling above.
   - Add the same wide editorial container principle used by
     the approved Career Article system.
   - Do NOT alter Article 1 selectors.
   ============================================================ */

.btp-career-goals.btp-career-article-v9-4 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 64px;
  background: #F7FAFC;
}

.btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
  width: min(1180px, calc(100% - 48px));
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

/* Hero / opening editorial block */
.btp-career-goals.btp-career-article-v9-4 .btp-article-hero {
  width: 100%;
  margin: 0 0 2.3rem;
  padding: 30px 0 0;
}

/* Editorial images remain inside the same site grid. */
.btp-career-goals.btp-career-article-v9-4 .btp-editorial-figure {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 2.25rem;
}

.btp-career-goals.btp-career-article-v9-4 .btp-editorial-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 14px;
}

.btp-career-goals.btp-career-article-v9-4 .btp-editorial-figure figcaption {
  margin: 10px 0 0;
  color: var(--btp-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

/* Keep every major content block aligned to the same editorial edge. */
.btp-career-goals.btp-career-article-v9-4 > .btp-career-goals-container > section {
  width: 100%;
}

/* Tables intentionally retain their horizontal scrolling behavior. */
.btp-career-goals.btp-career-article-v9-4 .btp-table-wrapper {
  max-width: 100%;
}

@media (min-width: 1100px) {
  .btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
    width: min(1180px, calc(100% - 48px));
    max-width: 1180px;
  }

  .btp-career-goals.btp-career-article-v9-4 .btp-article-hero h1 {
    max-width: 1120px;
  }
}

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
    width: min(100%, calc(100% - 40px));
    max-width: 1180px;
  }
}

@media (max-width: 767px) {
  .btp-career-goals.btp-career-article-v9-4 {
    padding-bottom: 42px;
  }

  .btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
    width: calc(100% - 32px);
    max-width: none;
  }

  .btp-career-goals.btp-career-article-v9-4 .btp-article-hero {
    padding-top: 22px;
    margin-bottom: 1.8rem;
  }

  .btp-career-goals.btp-career-article-v9-4 .btp-editorial-figure {
    width: 100%;
    margin-bottom: 1.8rem;
  }

  .btp-career-goals.btp-career-article-v9-4 .btp-editorial-figure img {
    border-radius: 10px;
  }
}

@media (max-width: 420px) {
  .btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
    width: calc(100% - 28px);
  }
}


/* ============================================================
   BLUEPRINT TO PROGRESS — ARTICLE 2 FINAL CONTAINMENT SAFEGUARD
   V9.4 — Career Goals
   Purpose: ensure the article's own 1180px editorial grid is not
   constrained by a narrower Elementor content wrapper.
   ============================================================ */

.btp-career-goals.btp-career-article-v9-4,
.btp-career-goals.btp-career-article-v9-4 .btp-career-goals-container {
  box-sizing: border-box;
}

.btp-career-goals.btp-career-article-v9-4 {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.btp-career-goals.btp-career-article-v9-4
.btp-career-goals-container {
  display: block;
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.btp-career-goals.btp-career-article-v9-4
.btp-career-goals-container > * {
  max-width: 100%;
}

.btp-career-goals.btp-career-article-v9-4
.btp-editorial-figure {
  width: 100%;
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.btp-career-goals.btp-career-article-v9-4
.btp-editorial-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

@media (max-width: 767px) {
  .btp-career-goals.btp-career-article-v9-4
  .btp-career-goals-container {
    width: calc(100% - 32px) !important;
    max-width: none !important;
  }
}

@media (max-width: 420px) {
  .btp-career-goals.btp-career-article-v9-4
  .btp-career-goals-container {
    width: calc(100% - 28px) !important;
  }
}
/* ============================================================
   BLUEPRINT TO PROGRESS — ARTICLE 3 STRUCTURAL LAYOUT
   V9.4 — Career Paths

   Purpose:
   - Adds Article 3 containment and responsive layout rules.
   - Uses the existing V9.4 Career Article design system.
   - Scoped exclusively to .btp-career-paths.
   - Does not alter Article 1 or Article 2.
   - Append this block to the END of:
     btp-career-articles-V9.4-CLEAN-PRODUCTION.css
   ============================================================ */

.btp-career-paths.btp-career-article-v9-4 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 64px;
  background: #F7FAFC;
  box-sizing: border-box;
}

.btp-career-paths.btp-career-article-v9-4,
.btp-career-paths.btp-career-article-v9-4 *,
.btp-career-paths.btp-career-article-v9-4 *::before,
.btp-career-paths.btp-career-article-v9-4 *::after {
  box-sizing: border-box;
}

/* ------------------------------------------------------------
   MAIN EDITORIAL CONTAINER
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4 .btp-career-paths-container {
  display: block;
  width: min(1180px, calc(100% - 48px));
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.btp-career-paths.btp-career-article-v9-4
.btp-career-paths-container > * {
  max-width: 100%;
}

/* ------------------------------------------------------------
   HERO / OPENING BLOCK
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4 .btp-article-hero {
  width: 100%;
  margin: 0 0 2.3rem;
  padding: 30px 0 0;
}

.btp-career-paths.btp-career-article-v9-4
.btp-article-hero h1 {
  max-width: 1120px;
}

/* ------------------------------------------------------------
   EDITORIAL IMAGES
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4 .btp-editorial-figure {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 2.25rem;
  text-align: center;
}

.btp-career-paths.btp-career-article-v9-4
.btp-editorial-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 14px;
}

.btp-career-paths.btp-career-article-v9-4
.btp-editorial-figure figcaption {
  margin: 10px 0 0;
  color: var(--btp-muted);
  font-size: 0.82rem;
  line-height: 1.5;
}

/* Support common Article 3 image wrappers if used. */
.btp-career-paths.btp-career-article-v9-4 .btp-image-placeholder,
.btp-career-paths.btp-career-article-v9-4 .btp-framework-image,
.btp-career-paths.btp-career-article-v9-4 .btp-skills-gap-image,
.btp-career-paths.btp-career-article-v9-4 .btp-template-image {
  width: 100%;
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}

.btp-career-paths.btp-career-article-v9-4 .btp-image-placeholder img,
.btp-career-paths.btp-career-article-v9-4 .btp-framework-image img,
.btp-career-paths.btp-career-article-v9-4 .btp-skills-gap-image img,
.btp-career-paths.btp-career-article-v9-4 .btp-template-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* ------------------------------------------------------------
   MAJOR CONTENT BLOCKS
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4
.btp-career-paths-container > section {
  width: 100%;
}

/* Keep long-form prose readable while retaining the broad
   editorial grid for functional components and images. */
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > p,
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > ul,
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > ol,
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > blockquote,
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > h3,
.btp-career-paths.btp-career-article-v9-4
.btp-editorial-section > h4 {
  max-width: 920px;
}

/* ------------------------------------------------------------
   FUNCTIONAL COMPONENTS
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4 .btp-table-wrapper,
.btp-career-paths.btp-career-article-v9-4 .btp-comparison,
.btp-career-paths.btp-career-article-v9-4 .btp-review-grid,
.btp-career-paths.btp-career-article-v9-4 .btp-framework,
.btp-career-paths.btp-career-article-v9-4 .btp-template-box,
.btp-career-paths.btp-career-article-v9-4 .btp-internal-resource,
.btp-career-paths.btp-career-article-v9-4 .btp-source-box,
.btp-career-paths.btp-career-article-v9-4 .btp-tip-box,
.btp-career-paths.btp-career-article-v9-4 .btp-goal-card {
  max-width: 1120px;
}

/* Tables keep the existing horizontal-scroll behaviour. */
.btp-career-paths.btp-career-article-v9-4 .btp-table-wrapper {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ------------------------------------------------------------
   FAQ / RELATED / CONCLUSION / SOURCES / CTA
   ------------------------------------------------------------ */

.btp-career-paths.btp-career-article-v9-4 .btp-faq,
.btp-career-paths.btp-career-article-v9-4 .btp-related-articles,
.btp-career-paths.btp-career-article-v9-4 .btp-conclusion,
.btp-career-paths.btp-career-article-v9-4 .btp-sources,
.btp-career-paths.btp-career-article-v9-4 .btp-career-hub-cta {
  width: min(1120px, calc(100% - 48px));
  max-width: 1120px;
  margin-left: auto;
  margin-right: auto;
}

/* ------------------------------------------------------------
   DESKTOP
   ------------------------------------------------------------ */

@media (min-width: 1100px) {
  .btp-career-paths.btp-career-article-v9-4
  .btp-career-paths-container {
    width: min(1180px, calc(100% - 48px));
    max-width: 1180px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-article-hero h1 {
    max-width: 1120px;
  }
}

/* ------------------------------------------------------------
   TABLET
   ------------------------------------------------------------ */

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-paths.btp-career-article-v9-4
  .btp-career-paths-container {
    width: min(100% - 40px, 1000px);
    max-width: 1000px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > p,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > ul,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > ol,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > blockquote,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > h3,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > h4 {
    max-width: 900px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-table-wrapper,
  .btp-career-paths.btp-career-article-v9-4
  .btp-comparison,
  .btp-career-paths.btp-career-article-v9-4
  .btp-review-grid,
  .btp-career-paths.btp-career-article-v9-4
  .btp-framework,
  .btp-career-paths.btp-career-article-v9-4
  .btp-template-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-internal-resource,
  .btp-career-paths.btp-career-article-v9-4
  .btp-source-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-tip-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-goal-card {
    width: min(100%, 1000px);
    max-width: 1000px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-faq,
  .btp-career-paths.btp-career-article-v9-4
  .btp-related-articles,
  .btp-career-paths.btp-career-article-v9-4
  .btp-conclusion,
  .btp-career-paths.btp-career-article-v9-4
  .btp-sources,
  .btp-career-paths.btp-career-article-v9-4
  .btp-career-hub-cta {
    width: min(100% - 40px, 1000px);
    max-width: 1000px;
  }
}

/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 767px) {
  .btp-career-paths.btp-career-article-v9-4 {
    padding-bottom: 42px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-career-paths-container {
    width: calc(100% - 32px);
    max-width: none;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-article-hero {
    padding-top: 22px;
    margin-bottom: 1.8rem;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-figure {
    width: 100%;
    margin-bottom: 1.8rem;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-figure img {
    border-radius: 10px;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > p,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > ul,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > ol,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > blockquote,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > h3,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-section > h4 {
    max-width: none;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-table-wrapper,
  .btp-career-paths.btp-career-article-v9-4
  .btp-comparison,
  .btp-career-paths.btp-career-article-v9-4
  .btp-review-grid,
  .btp-career-paths.btp-career-article-v9-4
  .btp-framework,
  .btp-career-paths.btp-career-article-v9-4
  .btp-template-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-internal-resource,
  .btp-career-paths.btp-career-article-v9-4
  .btp-source-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-tip-box,
  .btp-career-paths.btp-career-article-v9-4
  .btp-goal-card,
  .btp-career-paths.btp-career-article-v9-4
  .btp-image-placeholder,
  .btp-career-paths.btp-career-article-v9-4
  .btp-editorial-figure,
  .btp-career-paths.btp-career-article-v9-4
  .btp-framework-image,
  .btp-career-paths.btp-career-article-v9-4
  .btp-skills-gap-image,
  .btp-career-paths.btp-career-article-v9-4
  .btp-template-image {
    width: 100%;
    max-width: 100%;
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-faq,
  .btp-career-paths.btp-career-article-v9-4
  .btp-related-articles,
  .btp-career-paths.btp-career-article-v9-4
  .btp-conclusion,
  .btp-career-paths.btp-career-article-v9-4
  .btp-sources,
  .btp-career-paths.btp-career-article-v9-4
  .btp-career-hub-cta {
    width: calc(100% - 32px);
    max-width: none;
  }
}

/* ------------------------------------------------------------
   VERY NARROW PHONES
   ------------------------------------------------------------ */

@media (max-width: 420px) {
  .btp-career-paths.btp-career-article-v9-4
  .btp-career-paths-container {
    width: calc(100% - 28px);
  }

  .btp-career-paths.btp-career-article-v9-4
  .btp-table-wrapper table {
    min-width: 640px;
  }
}

/* ------------------------------------------------------------
   ACCESSIBILITY
   ------------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
  .btp-career-paths.btp-career-article-v9-4 *,
  .btp-career-paths.btp-career-article-v9-4 *::before,
  .btp-career-paths.btp-career-article-v9-4 *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}
/* ============================================================
   BLUEPRINT TO PROGRESS — ARTICLE 4
   Career Progression Plan
   V9.4 — PRODUCTION REPLACEMENT BLOCK

   INSTALLATION:
   - Delete the previous Article 4 CSS block from the bottom of Hostinger.
   - Paste this entire block at the very bottom of the Hostinger CSS.
   - Do not remove the external stylesheet <link> from Article 4 HTML.
   - This block is scoped exclusively to .btp-career-progression-plan.
   ============================================================ */


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

.btp-career-progression-plan.btp-career-article-v9-4 {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 64px;
  background: #F7FAFC;
  color: #243F5F;
  font-family: inherit;
  font-size: 18px;
  line-height: 1.72;
  overflow-wrap: break-word;
  box-sizing: border-box;
}

.btp-career-progression-plan.btp-career-article-v9-4,
.btp-career-progression-plan.btp-career-article-v9-4 *,
.btp-career-progression-plan.btp-career-article-v9-4 *::before,
.btp-career-progression-plan.btp-career-article-v9-4 *::after {
  box-sizing: border-box;
}


/* ============================================================
   MAIN EDITORIAL CONTAINER
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4
.btp-career-progression-plan-container {
  display: block;
  width: min(1180px, calc(100% - 48px));
  max-width: 1180px;
  margin: 0 auto;
  padding: 0;
}


/* ============================================================
   TYPOGRAPHY
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 h1,
.btp-career-progression-plan.btp-career-article-v9-4 h2,
.btp-career-progression-plan.btp-career-article-v9-4 h3,
.btp-career-progression-plan.btp-career-article-v9-4 h4 {
  color: #17365D;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.btp-career-progression-plan.btp-career-article-v9-4 h1 {
  margin: 0 0 0.55em;
  max-width: 1120px;
  font-size: clamp(2.15rem, 4vw, 3.25rem);
  font-weight: 800;
}

.btp-career-progression-plan.btp-career-article-v9-4 h2 {
  margin: 0 0 0.6em;
  max-width: 1120px;
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  font-weight: 800;
}

.btp-career-progression-plan.btp-career-article-v9-4 h3 {
  margin: 1.35em 0 0.45em;
  max-width: 920px;
  font-size: clamp(1.18rem, 2vw, 1.42rem);
  font-weight: 750;
}

.btp-career-progression-plan.btp-career-article-v9-4 h4 {
  margin: 1.15em 0 0.4em;
  max-width: 920px;
  font-size: 1.08rem;
  font-weight: 750;
}

.btp-career-progression-plan.btp-career-article-v9-4 p {
  width: 100%;
  max-width: 1180px;
  margin: 0 0 1.05em;
}

.btp-career-progression-plan.btp-career-article-v9-4 strong {
  color: #17365D;
}

.btp-career-progression-plan.btp-career-article-v9-4 a {
  color: #0077C8;
  text-decoration: none;
  font-weight: 500;
}

.btp-career-progression-plan.btp-career-article-v9-4 a:hover,
.btp-career-progression-plan.btp-career-article-v9-4 a:focus {
  text-decoration: underline;
}


/* ============================================================
   HERO / OPENING BLOCK
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-hero {
  width: 100%;
  margin: 0 0 64px;
  padding: 30px 0 0;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-hero h1 {
  max-width: 1120px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-hero
.btp-editorial-figure {
  margin-bottom: 0;
}


/* ============================================================
   EDITORIAL IMAGES
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-editorial-figure,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-image {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto 2.25rem;
  padding: 0;
  text-align: center;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-editorial-figure img,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 14px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-editorial-figure figcaption,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-image figcaption {
  margin: 10px 0 0;
  color: #5C6F82;
  font-size: 0.82rem;
  line-height: 1.5;
}


/* ============================================================
   EDITORIAL SECTIONS
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4
.btp-career-progression-plan-container > section.btp-editorial-section {
  width: 100%;
  margin: 0 0 72px;
  padding: 0;
}

.btp-career-progression-plan.btp-career-article-v9-4
.btp-career-progression-plan-container > section.btp-editorial-section:first-of-type {
  margin-top: 0;
}

.btp-career-progression-plan.btp-career-article-v9-4
.btp-career-progression-plan-container > section.btp-editorial-section:last-of-type {
  margin-bottom: 0;
}


/* ============================================================
   LONG-FORM PROSE WIDTH
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > p,
.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > ul,
.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > ol,
.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > blockquote,
.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > h3,
.btp-career-progression-plan.btp-career-article-v9-4
.btp-editorial-section > h4 {
  width: 100% !important;
  max-width: none !important;
}
/* ============================================================
   CAREER PATH BOX — CENTERED LABEL
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-path {
  text-align: center;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-path strong {
  display: block;
  width: 100%;
  text-align: center;
}

/* ============================================================
   LISTS
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 ul,
.btp-career-progression-plan.btp-career-article-v9-4 ol {
  margin: 0 0 1.25em;
  padding-left: 1.45em;
}

.btp-career-progression-plan.btp-career-article-v9-4 li {
  margin: 0 0 0.55em;
}


/* ============================================================
   BLOCKQUOTES
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 blockquote {
  width: 100%;
  max-width: 1180px;
  margin: 1.35rem 0 1.6rem;
  padding: 1.1rem 1.25rem;
  background: #EAF6FF;
  border: 1px solid #B8DFF7;
  border-left: 4px solid #0077C8;
  border-radius: 10px;
}

.btp-career-progression-plan.btp-career-article-v9-4 blockquote p:last-child {
  margin-bottom: 0;
}


/* ============================================================
   PATH / ROADMAP ELEMENT
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-path {
  width: 100%;
  max-width: 1180px;
  margin: 1.25rem 0 1.65rem;
  padding: 14px 18px;
  background: #EAF6FF;
  border: 1px solid #B8DFF7;
  border-radius: 10px;
  color: #17365D;
  font-weight: 600;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}


/* ============================================================
   TABLES
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-table-wrapper {
  width: 100%;
  max-width: 1180px;
  margin: 1.25rem 0 1.65rem;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  border: 1px solid #D8E2EA;
  border-radius: 10px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table {
  width: 100%;
  min-width: 680px;
  border-collapse: separate;
  border-spacing: 0;
  margin: 0;
  background: #FFFFFF;
  font-size: 0.94rem;
  line-height: 1.48;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table th,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table td {
  padding: 0.72rem 0.85rem;
  text-align: left;
  vertical-align: top;
  border-right: 1px solid #D8E2EA;
  border-bottom: 1px solid #D8E2EA;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table th:last-child,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table td:last-child {
  border-right: 0;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table tbody tr:last-child td {
  border-bottom: 0;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table thead th {
  background: #0077C8;
  border-bottom-color: #0077C8;
  color: #FFFFFF;
  font-weight: 750;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table thead th:first-child {
  border-top-left-radius: 8px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table thead th:last-child {
  border-top-right-radius: 8px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table tbody tr:nth-child(even) td {
  background: #F8FBFD;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-table tbody tr:nth-child(odd) td {
  background: #FFFFFF;
}


/* ============================================================
   FUNCTIONAL COMPONENTS / CTA
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-comparison,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-review-grid,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-framework,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-template-box,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-internal-resource,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-source-box,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-tip-box,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-goal-card,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-cta {
  max-width: 1120px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-cta {
  width: 100%;
  margin: 2.5rem 0 1rem;
  padding: 1.4rem 1.35rem 1.5rem;
  background: #EAF6FF;
  border: 1px solid #B8DFF7;
  border-left: 4px solid #0077C8;
  border-radius: 10px;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-cta h2 {
  margin-top: 0.15rem;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-article-cta p:last-child {
  margin-bottom: 0;
}


/* ============================================================
   BUTTON
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin-top: 0.3rem;
  padding: 0.72rem 1rem;
  border-radius: 6px;
  color: #FFFFFF !important;
  background: #0077C8;
  font-weight: 700;
  text-decoration: none !important;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

.btp-career-progression-plan.btp-career-article-v9-4 .btp-button:hover,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-button:focus {
  color: #FFFFFF !important;
  background: #005FA3;
  text-decoration: none !important;
  transform: translateY(-1px);
}


/* ============================================================
   FAQ / CONCLUSION / SPECIAL BLOCKS
   ============================================================ */

.btp-career-progression-plan.btp-career-article-v9-4 .btp-faq,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-related-articles,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-conclusion,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-sources,
.btp-career-progression-plan.btp-career-article-v9-4 .btp-career-hub-cta {
  width: 100%;
  max-width: 1120px;
  margin-left: 0;
  margin-right: 0;
}


/* ============================================================
   DESKTOP
   ============================================================ */

@media (min-width: 1100px) {
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-progression-plan-container {
    width: min(1180px, calc(100% - 48px));
    max-width: 1180px;
  }
}


/* ============================================================
   TABLET
   ============================================================ */

@media (min-width: 768px) and (max-width: 1099px) {
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-progression-plan-container {
    width: min(100% - 40px, 1000px);
    max-width: 1000px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > p,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > ul,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > ol,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > blockquote,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > h3,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > h4 {
    width: 100%;
    max-width: 100%;
  }
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 767px) {
  .btp-career-progression-plan.btp-career-article-v9-4 {
    padding-bottom: 42px;
    font-size: 16px;
    line-height: 1.68;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-progression-plan-container {
    width: calc(100% - 32px);
    width: 100%;
    max-width: none;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-article-hero {
    padding-top: 22px;
    margin-bottom: 42px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section {
    margin-bottom: 54px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > p,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > ul,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > ol,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > blockquote,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > h3,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-section > h4 {
    width: 100%;
    max-width: none;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-figure,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-article-image {
    width: 100%;
    margin-bottom: 1.8rem;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-editorial-figure img,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-article-image img {
    border-radius: 10px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-table-wrapper {
    width: 100%;
    max-width: 100%;
    margin-top: 1.1rem;
    margin-bottom: 1.5rem;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-table {
    min-width: 640px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-table th,
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-table td {
    padding: 0.7rem 0.75rem;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-article-cta {
    width: 100%;
    max-width: none;
    padding: 1.2rem 1rem 1.3rem;
  }
}


/* ============================================================
   VERY NARROW PHONES
   ============================================================ */

@media (max-width: 420px) {
  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-progression-plan-container {
    width: calc(100% - 28px);
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-career-table {
    min-width: 640px;
  }

  .btp-career-progression-plan.btp-career-article-v9-4
  .btp-table-wrapper {
    max-width: 100%;
    overflow-x: auto;
  }
}


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

@media (prefers-reduced-motion: reduce) {
  .btp-career-progression-plan.btp-career-article-v9-4 *,
  .btp-career-progression-plan.btp-career-article-v9-4 *::before,
  .btp-career-progression-plan.btp-career-article-v9-4 *::after {
    scroll-behavior: auto;
    transition: none !important;
  }
}
/* ============================================================
   Blueprint To Progress — Article 5
   Career Change: How to Switch Careers Without Starting Over
   APPEND THIS BLOCK AFTER THE EXISTING SHARED CSS.
   ============================================================ */

.btp-career-change-article {
  --btp-blue: #0077CC;
  --btp-blue-dark: #005A9C;
  --btp-text: #25313C;
  --btp-heading: #193A66;
  --btp-muted: #5F6B76;
  --btp-border: #D3E0EA;
  --btp-surface: #F6F9FB;
  --btp-white: #FFFFFF;

  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  color: var(--btp-text);
  background: transparent;
  box-sizing: border-box;
  font-size: 18px;
  line-height: 1.78;
  overflow-wrap: anywhere;
}

.btp-career-change-article *,
.btp-career-change-article *::before,
.btp-career-change-article *::after {
  box-sizing: border-box;
}

.btp-career-change-article .btp-article-header,
.btp-career-change-article .btp-article-content {
  width: min(100% - 40px, 1180px);
  margin-left: auto;
  margin-right: auto;
}

.btp-career-change-article .btp-article-header {
  padding-top: 40px !important;
  padding-bottom: 10px !important;
}

.btp-career-change-article h1,
.btp-career-change-article h2,
.btp-career-change-article h3 {
  color: var(--btp-heading);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.btp-career-change-article h1 {
  font-size: clamp(42px, 3.55vw, 50px) !important;
  line-height: 1.16 !important;
  margin: 0 0 10px !important;
}

.btp-career-change-article h2 {
  font-size: clamp(30px, 3.1vw, 42px);
  line-height: 1.2;
  margin: 72px 0 22px;
}

.btp-career-change-article h3 {
  font-size: clamp(21px, 2vw, 27px);
  line-height: 1.3;
  margin: 42px 0 14px;
}

.btp-career-change-article p {
  margin: 0 0 24px;
}

.btp-career-change-article ul,
.btp-career-change-article ol {
  margin: 0 0 28px;
  padding-left: 28px;
}

.btp-career-change-article li {
  margin: 0 0 10px;
}

.btp-career-change-article a {
  color: var(--btp-blue-dark);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.btp-career-change-article a:hover {
  color: var(--btp-blue);
}

.btp-career-change-article blockquote {
  margin: 28px 0 34px;
  padding: 22px 28px;
  border-left: 4px solid var(--btp-blue);
  border-radius: 8px;
  background: #EEF7FD;
  color: var(--btp-heading);
  font-size: 1.05em;
}

.btp-career-change-article .btp-image-link {
  display: block;
  width: 100%;
  margin: 34px 0 10px;
  text-decoration: none;
}

.btp-career-change-article .btp-article-image {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 14px;
  border: 1px solid var(--btp-border);
  box-shadow: 0 8px 28px rgba(25, 58, 102, 0.08);
}

.btp-career-change-article .btp-image-link:hover .btp-article-image {
  box-shadow: 0 10px 32px rgba(25, 58, 102, 0.12);
}

.btp-career-change-article .btp-table-wrap {
  width: 100%;
  margin: 28px 0 34px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--btp-border);
  border-radius: 10px;
  background: var(--btp-white);
}

.btp-career-change-article .btp-career-table {
  width: 100%;
  min-width: 680px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  color: var(--btp-heading);
  background: var(--btp-white);
}

.btp-career-change-article .btp-career-table th,
.btp-career-change-article .btp-career-table td {
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  border-right: 1px solid var(--btp-border);
  border-bottom: 1px solid var(--btp-border);
}

.btp-career-change-article .btp-career-table th:last-child,
.btp-career-change-article .btp-career-table td:last-child {
  border-right: 0;
}

.btp-career-change-article .btp-career-table tr:last-child td {
  border-bottom: 0;
}

.btp-career-change-article .btp-career-table th {
  color: #fff;
  background: var(--btp-blue);
  font-weight: 700;
}

.btp-career-change-article .btp-career-table tbody tr:nth-child(even) td {
  background: #F7FAFC;
}

.btp-career-change-article .btp-faq-question {
  margin-top: 32px;
  margin-bottom: 10px;
  font-size: 21px;
}

@media (min-width: 1200px) {
  .btp-career-change-article .btp-article-header,
  .btp-career-change-article .btp-article-content {
    width: min(100% - 80px, 1180px);
  }
}

@media (max-width: 767px) {
  .btp-career-change-article {
    font-size: 17px;
    line-height: 1.72;
  }

  .btp-career-change-article .btp-article-header,
  .btp-career-change-article .btp-article-content {
    width: calc(100% - 28px);
  }

  .btp-career-change-article .btp-article-header {
    padding-top: 4px;
    padding-bottom: 14px;
  }

  .btp-career-change-article h1 {
    font-size: clamp(31px, 8vw, 40px);
    line-height: 1.15;
    margin-bottom: 22px;
  }

  .btp-career-change-article h2 {
    font-size: clamp(27px, 7vw, 34px);
    margin-top: 52px;
  }

  .btp-career-change-article h3 {
    font-size: 21px;
    margin-top: 34px;
  }

  .btp-career-change-article p {
    margin-bottom: 20px;
  }

  .btp-career-change-article .btp-image-link {
    margin-top: 28px;
  }

  .btp-career-change-article .btp-article-image {
    border-radius: 10px;
  }

  .btp-career-change-article .btp-table-wrap {
    margin-top: 22px;
  }

  .btp-career-change-article .btp-career-table {
    min-width: 640px;
  }
}

/* ================================================================
   ARTICLE 5 — FINAL TOP-SECTION OVERRIDES
   Replace the previous Article 5 block with this complete file.
   ================================================================ */

/* The Elementor HTML widget may inherit spacing/typography from
   WordPress/Elementor. These selectors are intentionally specific. */

article.btp-career-article.btp-career-change-article {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

article.btp-career-article.btp-career-change-article > .btp-article-header {
  width: calc(100% - 80px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 40px 0 10px !important;
  min-height: 0 !important;
}

article.btp-career-article.btp-career-change-article > .btp-article-header > h1 {
  display: block !important;
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 0 10px !important;
  padding: 0 !important;
  font-size: clamp(42px, 3.55vw, 50px) !important;
  line-height: 1.16 !important;
}

/* The first H2 is the first visible content section. Eliminate the
   inherited 72px section margin so the opening reads like Article 3. */
article.btp-career-article.btp-career-change-article
    > .btp-article-content > h2:first-of-type {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    font-size: clamp(28px, 7vw, 34px) !important;
    line-height: 1.2 !important;
    text-align: left !important;
  }

/* Remove the accidental Markdown-style duplicate title if it is
   present as the first paragraph inside the content. */
article.btp-career-article.btp-career-change-article
  > .btp-article-content > p:first-child {
  display: none !important;
}

/* Keep all following Article 5 text at the same usable width. */
article.btp-career-article.btp-career-change-article > .btp-article-content {
  width: calc(100% - 80px) !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
}

@media (max-width: 767px) {
  article.btp-career-article.btp-career-change-article > .btp-article-header {
    width: calc(100% - 30px) !important;
    padding: 26px 0 8px !important;
  }

  article.btp-career-article.btp-career-change-article > .btp-article-header > h1 {
    font-size: clamp(32px, 7.5vw, 40px) !important;
    line-height: 1.16 !important;
    margin-bottom: 8px !important;
  }

  article.btp-career-article.btp-career-change-article
    > .btp-article-content {
    width: calc(100% - 30px) !important;
  }
}


/* ================================================================
   ARTICLE 5 — FIRST SECTION HEADING FINAL REFINEMENT
   ================================================================ */

article.btp-career-article.btp-career-change-article
  > .btp-article-content > h2:first-of-type {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: left !important;
  font-size: clamp(30px, 2.6vw, 38px) !important;
  line-height: 1.2 !important;
}

@media (max-width: 767px) {
  article.btp-career-article.btp-career-change-article
    > .btp-article-content > h2:first-of-type {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    font-size: clamp(28px, 7vw, 34px) !important;
    line-height: 1.2 !important;
  }
}


/* ================================================================
   ARTICLE 5 — SECTION SPACING FINAL CORRECTION v4
   Purpose: remove the excessive vertical gap between sections visible
   after images/captions and between consecutive content sections.
   ================================================================ */

/* Reduce the default H2 separation throughout Article 5. */
html body article.btp-career-article.btp-career-change-article h2 {
  margin-top: 30px !important;
  margin-bottom: 16px !important;
}

/* The first section needs slightly more breathing room below the H1,
   but substantially less than the previous 46px setting. */
html body article.btp-career-article.btp-career-change-article
  > .btp-article-content > h2:first-of-type {
  margin-top: 30px !important;
  margin-bottom: 16px !important;
}

/* A section heading immediately following an image/caption should
   sit close enough to the preceding content to read as one flow. */
html body article.btp-career-article.btp-career-change-article
  .btp-article-figure + h2 {
  margin-top: 26px !important;
}

/* Consecutive section boundaries: keep the rhythm compact. */
html body article.btp-career-article.btp-career-change-article
  p + h2,
html body article.btp-career-article.btp-career-change-article
  ul + h2,
html body article.btp-career-article.btp-career-change-article
  ol + h2,
html body article.btp-career-article.btp-career-change-article
  blockquote + h2,
html body article.btp-career-article.btp-career-change-article
  .btp-table-wrap + h2 {
  margin-top: 30px !important;
}

/* Do not let an empty/extra wrapper create another large gap. */
html body article.btp-career-article.btp-career-change-article
  .btp-article-content > h2:first-child {
  margin-top: 30px !important;
}

/* Keep captions close to their images and the following content. */
html body article.btp-career-article.btp-career-change-article figcaption {
  margin-bottom: 0 !important;
}

/* Mobile: tighter but still comfortable section rhythm. */
@media (max-width: 767px) {
  html body article.btp-career-article.btp-career-change-article h2 {
    margin-top: 28px !important;
    margin-bottom: 14px !important;
  }

  html body article.btp-career-article.btp-career-change-article
    > .btp-article-content > h2:first-of-type {
    margin-top: 26px !important;
    margin-bottom: 14px !important;
  }

  html body article.btp-career-article.btp-career-change-article
    .btp-article-figure + h2 {
    margin-top: 24px !important;
  }

  html body article.btp-career-article.btp-career-change-article
    p + h2,
  html body article.btp-career-article.btp-career-change-article
    ul + h2,
  html body article.btp-career-article.btp-career-change-article
    ol + h2,
  html body article.btp-career-article.btp-career-change-article
    .btp-table-wrap + h2 {
    margin-top: 28px !important;
  }
}

/* ================================================================
   ARTICLE 5 — MOBILE H2 TYPOGRAPHY REFINEMENT v5
   Purpose: slightly reduce H2 prominence on small screens while
   preserving the established desktop/tablet typography.
   ================================================================ */

@media (max-width: 767px) {
  html body article.btp-career-article.btp-career-change-article h2 {
    font-size: 30px !important;
    line-height: 1.2 !important;
  }
}
/* ================================================================
   ARTICLE 6 — SALARY NEGOTIATION
   V9.4 CLEAN PRODUCTION — FINAL PAGE-SPECIFIC OVERRIDE
   ----------------------------------------------------------------
   Scope: #btp-article-6 only.
   Purpose:
   - Restore the standard BTP full-width article architecture.
   - Use the 1180px site grid for header/content containment.
   - Use the full 1180px site grid for article copy and media on desktop.
   - Keep tablet/mobile geometry controlled and responsive.
   - Preserve the existing global V9.4 stylesheet and Articles 1–5.
   ----------------------------------------------------------------
   HTML companion:
   Article-6-Salary-Negotiation-Production-Ready(1).html
   ================================================================ */

/* ---------------------------------------------------------------
   1. ARTICLE ROOT / CONTAINMENT
   --------------------------------------------------------------- */
#btp-article-6 {
  --btp-accent: #1f5f73;
  --btp-accent-dark: #16485a;
  --btp-text: #202b33;
  --btp-heading: #193a66;
  --btp-muted: #63717a;
  --btp-border: #dfe6ea;
  --btp-soft: #f5f8fa;
  --btp-card: #ffffff;
  --btp-shadow: 0 12px 35px rgba(18, 37, 48, 0.08);

  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 0 64px !important;
  color: var(--btp-text);
  background: #f7fafc;
  font-family: inherit;
  font-size: 18px;
  line-height: 1.72;
  overflow-wrap: break-word;
  box-sizing: border-box;
}

#btp-article-6,
#btp-article-6 *,
#btp-article-6 *::before,
#btp-article-6 *::after {
  box-sizing: border-box;
}

#btp-article-6 > article {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------------------------------------------------------------
   2. STANDARD BTP 1180px EDITORIAL GRID
   --------------------------------------------------------------- */
#btp-article-6 > article > .btp-article-header,
#btp-article-6 > article > .btp-article-content {
  width: min(1180px, calc(100% - 48px)) !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#btp-article-6 > article > .btp-article-header {
  padding: 40px 0 10px !important;
  min-height: 0 !important;
}

#btp-article-6 > article > .btp-article-content {
  padding: 0 !important;
}

/* ---------------------------------------------------------------
   3. HEADER / TITLE / INTRO
   --------------------------------------------------------------- */
#btp-article-6 .btp-article-kicker {
  margin: 0 0 12px !important;
  color: var(--btp-accent) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
}

#btp-article-6 .btp-article-header > h1 {
  display: block !important;
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  color: var(--btp-heading) !important;
  font-size: clamp(42px, 3.55vw, 50px) !important;
  font-weight: 700 !important;
  line-height: 1.16 !important;
  letter-spacing: -0.025em !important;
}

#btp-article-6 .btp-article-intro {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: var(--btp-muted) !important;
  font-size: 20px !important;
  line-height: 1.65 !important;
}

/* ---------------------------------------------------------------
   4. FULL-WIDTH EDITORIAL READING AREA
   --------------------------------------------------------------- */
#btp-article-6 .btp-article-content > p,
#btp-article-6 .btp-article-content > ul,
#btp-article-6 .btp-article-content > ol,
#btp-article-6 .btp-article-content > blockquote,
#btp-article-6 .btp-article-content > h2,
#btp-article-6 .btp-article-content > h3 {
  width: 100% !important;
  max-width: 1180px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#btp-article-6 .btp-article-content > p {
  margin-top: 0;
  margin-bottom: 24px;
  color: var(--btp-text);
  font-size: 18px;
  line-height: 1.78;
}

#btp-article-6 .btp-article-content > h2 {
  margin-top: 48px !important;
  margin-bottom: 18px !important;
  color: var(--btp-heading) !important;
  font-size: clamp(30px, 3.1vw, 38px) !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
}

#btp-article-6 .btp-article-content > h3 {
  margin-top: 34px !important;
  margin-bottom: 12px !important;
  color: var(--btp-heading) !important;
  font-size: clamp(21px, 2vw, 26px) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em !important;
}

/* First visible section heading: deliberate but compact transition
   from the opening image/content into the first section. */
#btp-article-6 .btp-article-content > .btp-article-image:first-child + h2 {
  margin-top: 30px !important;
}

/* ---------------------------------------------------------------
   5. EDITORIAL IMAGES — FULL SITE GRID
   --------------------------------------------------------------- */
#btp-article-6 .btp-article-content > .btp-article-image {
  display: block;
  width: 100% !important;
  max-width: 1180px !important;
  margin: 28px auto 34px !important;
  padding: 0 !important;
  text-align: center;
}

#btp-article-6 .btp-article-content > .btp-article-image:first-child {
  margin-top: 18px !important;
}

#btp-article-6 .btp-article-image .btp-image-link {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  text-decoration: none;
}

#btp-article-6 .btp-article-image img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  border: 1px solid var(--btp-border) !important;
  border-radius: 14px !important;
  box-shadow: var(--btp-shadow) !important;
}

#btp-article-6 .btp-article-image figcaption {
  margin: 10px 0 0 !important;
  padding: 0 !important;
  color: var(--btp-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* ---------------------------------------------------------------
   6. LINKS / BLOCKQUOTES / LISTS
   --------------------------------------------------------------- */
#btp-article-6 a {
  color: var(--btp-accent-dark);
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

#btp-article-6 a:hover {
  color: var(--btp-accent);
}

#btp-article-6 .btp-article-content > blockquote {
  margin-top: 26px !important;
  margin-bottom: 28px !important;
  padding: 18px 24px !important;
  border-left: 4px solid var(--btp-accent) !important;
  border-radius: 0 10px 10px 0 !important;
  background: var(--btp-soft) !important;
  color: var(--btp-heading) !important;
}

#btp-article-6 .btp-article-content > blockquote p {
  margin: 0 !important;
  color: inherit !important;
}

#btp-article-6 .btp-article-content > ul,
#btp-article-6 .btp-article-content > ol {
  margin-top: 0;
  margin-bottom: 28px;
  padding-left: 28px;
}

#btp-article-6 .btp-article-content > li {
  margin-bottom: 10px;
}

/* ---------------------------------------------------------------
   7. CHECKLIST / TABLE / RELATED MODULES
   --------------------------------------------------------------- */
#btp-article-6 .btp-checklist {
  list-style: none;
  margin: 18px auto 28px !important;
  padding: 0 !important;
}

#btp-article-6 .btp-checklist li {
  margin: 9px 0;
  padding: 11px 14px;
  background: var(--btp-soft);
  border: 1px solid var(--btp-border);
  border-radius: 9px;
}

#btp-article-6 .btp-checklist input {
  width: 1rem;
  height: 1rem;
  margin-right: .45rem;
  vertical-align: -2px;
}

#btp-article-6 .btp-table-wrap {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 28px auto 34px !important;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--btp-border);
  border-radius: 10px;
  background: var(--btp-card);
}

#btp-article-6 .btp-table-wrap table {
  width: 100%;
  min-width: 650px;
  border-collapse: collapse;
}

#btp-article-6 .btp-table-wrap th,
#btp-article-6 .btp-table-wrap td {
  padding: 13px 15px;
  border-bottom: 1px solid var(--btp-border);
  text-align: left;
  vertical-align: top;
}

#btp-article-6 .btp-table-wrap th {
  background: var(--btp-soft);
  color: var(--btp-heading);
  font-weight: 700;
}

#btp-article-6 .btp-table-wrap tr:last-child td {
  border-bottom: 0;
}

#btp-article-6 .btp-related-links {
  width: 100% !important;
  max-width: 1180px !important;
  margin: 42px auto !important;
  padding: 22px 24px;
  background: var(--btp-soft);
  border: 1px solid var(--btp-border);
  border-radius: 12px;
}

#btp-article-6 .btp-related-links h2 {
  margin-top: 0 !important;
}

#btp-article-6 .btp-related-links ul {
  margin-bottom: 0;
}

#btp-article-6 .btp-source-note {
  color: var(--btp-muted);
  font-size: 14px;
  line-height: 1.55;
}

/* ---------------------------------------------------------------
   8. TABLET — 768px TO 1099px
   --------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1099px) {
  #btp-article-6 > article > .btp-article-header,
  #btp-article-6 > article > .btp-article-content {
    width: calc(100% - 48px) !important;
    max-width: 1180px !important;
  }

  #btp-article-6 > article > .btp-article-header {
    padding-top: 34px !important;
    padding-bottom: 10px !important;
  }

  #btp-article-6 .btp-article-header > h1 {
    max-width: 100% !important;
    font-size: 42px !important;
    line-height: 1.12 !important;
  }

  #btp-article-6 .btp-article-intro,
  #btp-article-6 .btp-article-content > p,
  #btp-article-6 .btp-article-content > ul,
  #btp-article-6 .btp-article-content > ol,
  #btp-article-6 .btp-article-content > blockquote,
  #btp-article-6 .btp-article-content > h2,
  #btp-article-6 .btp-article-content > h3 {
    max-width: 100% !important;
  }

  #btp-article-6 .btp-article-content > .btp-article-image {
    width: 100% !important;
    max-width: 1120px !important;
  }
}

/* ---------------------------------------------------------------
   9. MOBILE — <= 767px
   --------------------------------------------------------------- */
@media (max-width: 767px) {
  #btp-article-6 {
    padding-bottom: 44px !important;
    font-size: 17px;
    line-height: 1.72;
  }

  #btp-article-6 > article > .btp-article-header,
  #btp-article-6 > article > .btp-article-content {
    width: calc(100% - 30px) !important;
    max-width: 680px !important;
  }

  #btp-article-6 > article > .btp-article-header {
    padding-top: 26px !important;
    padding-bottom: 8px !important;
  }

  #btp-article-6 .btp-article-kicker {
    margin-bottom: 9px !important;
    font-size: 12px !important;
    letter-spacing: 0.1em !important;
  }

  #btp-article-6 .btp-article-header > h1 {
    max-width: none !important;
    margin-bottom: 10px !important;
    font-size: clamp(32px, 8vw, 40px) !important;
    line-height: 1.14 !important;
    letter-spacing: -0.02em !important;
  }

  #btp-article-6 .btp-article-intro {
    width: 100% !important;
    max-width: none !important;
    font-size: 18px !important;
    line-height: 1.65 !important;
  }

  #btp-article-6 .btp-article-content > p,
  #btp-article-6 .btp-article-content > ul,
  #btp-article-6 .btp-article-content > ol,
  #btp-article-6 .btp-article-content > blockquote,
  #btp-article-6 .btp-article-content > h2,
  #btp-article-6 .btp-article-content > h3,
  #btp-article-6 .btp-table-wrap,
  #btp-article-6 .btp-related-links {
    width: 100% !important;
    max-width: none !important;
  }

  #btp-article-6 .btp-article-content > p {
    margin-bottom: 20px;
    font-size: 17px;
    line-height: 1.72;
  }

  #btp-article-6 .btp-article-content > h2 {
    margin-top: 30px !important;
    margin-bottom: 14px !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
  }

  #btp-article-6 .btp-article-content > h3 {
    margin-top: 26px !important;
    margin-bottom: 10px !important;
    font-size: 21px !important;
    line-height: 1.3 !important;
  }

  #btp-article-6 .btp-article-content > .btp-article-image,
  #btp-article-6 .btp-article-content > .btp-article-image:first-child {
    width: 100% !important;
    max-width: none !important;
    margin: 22px auto 26px !important;
  }

  #btp-article-6 .btp-article-image img {
    border-radius: 10px !important;
  }

  #btp-article-6 .btp-article-image figcaption {
    font-size: 13px !important;
    line-height: 1.5 !important;
  }

  #btp-article-6 .btp-article-content > blockquote {
    margin-top: 20px !important;
    margin-bottom: 24px !important;
    padding: 14px 16px !important;
  }

  #btp-article-6 .btp-checklist {
    margin-top: 14px !important;
    margin-bottom: 24px !important;
  }

  #btp-article-6 .btp-table-wrap {
    margin-top: 22px !important;
    margin-bottom: 28px !important;
    border-radius: 9px;
  }

  #btp-article-6 .btp-table-wrap table {
    min-width: 650px;
  }

  #btp-article-6 .btp-related-links {
    margin: 32px auto !important;
    padding: 18px 18px;
  }
}

/* ---------------------------------------------------------------
   10. VERY SMALL PHONES — <= 380px
   --------------------------------------------------------------- */
@media (max-width: 380px) {
  #btp-article-6 > article > .btp-article-header,
  #btp-article-6 > article > .btp-article-content {
    width: calc(100% - 28px) !important;
  }

  #btp-article-6 .btp-article-header > h1 {
    font-size: 31px !important;
    line-height: 1.15 !important;
  }

  #btp-article-6 .btp-article-intro {
    font-size: 17px !important;
  }

  #btp-article-6 .btp-article-content > h2 {
    font-size: 29px !important;
  }
}

/* ---------------------------------------------------------------
   11. REDUCED MOTION
   --------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  #btp-article-6 *,
  #btp-article-6 *::before,
  #btp-article-6 *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* ================================================================
   END ARTICLE 6 — SALARY NEGOTIATION FINAL OVERRIDE
   ================================================================ */