/* XChange blog — loaded AFTER the live end-styles.css. Reuses real classes (.top-bar, .main-header,
   footer, .breadcrumbs, .book-button, .nav-search) so they render identically; styles only blog-specific
   components, harmonised to the live palette. The site root is 62.5% (1rem=10px) so we reset a readable
   scale inside .xct-main. */
:root{
  --green:#27d30e; --green-d:#1da60a; --blue:#5eabe4; --blue2:#40ace9; --blue-d:#006b9f;
  --head:#444; --ink:#333; --muted:#888; --line:#ccc; --line2:#ddd; --bg:#f6f7f9; --card:#fff;
  --wrap:1400px; --read:760px; --sans:'Montserrat',sans-serif;
}
.xct-blog{background:var(--bg)}
.skip-link{position:absolute;left:-999px}.skip-link:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:100}

/* Fallback main nav (only shows if the real header include isn't found; real .top-bar/.nav-search styled by end-styles.css) */
.xct-mainnav{background:#fff;border-bottom:1px solid var(--line)}
.xct-nav-inner{max-width:var(--wrap);margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:22px;height:70px}
.xct-logo img{height:42px;width:auto;display:block}
.xct-nav{display:flex;gap:20px;margin-left:8px;flex-wrap:wrap}
.xct-nav a{font-family:var(--sans);font-size:15px;font-weight:600;color:var(--head);text-decoration:none}
.xct-nav a:hover,.xct-nav a.is-active{color:var(--blue-d)}
.xct-mainnav .nav-search{margin-left:auto;padding:10px 18px!important;width:auto!important}

/* Reading scale reset inside blog main */
.xct-main{font-family:var(--sans);font-size:16px;line-height:1.65;color:var(--ink)}
.xct-main a{color:var(--blue-d)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}

/* Landing hero */
.page-head{background:linear-gradient(120deg,#2b3947,#38414a);color:#fff;padding:42px 0 38px}
.page-head .wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px}
.page-head .eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#9fe6ff;font-weight:700}
.page-head h1{font-family:var(--sans);font-weight:700;font-size:30px;color:#fff;margin:8px 0 6px;line-height:1.2}
.page-head p{color:#dfe5ea;margin:0;max-width:680px;font-size:15px}
.cat-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.26);color:#eef5fb;padding:5px 12px;border-radius:4px;font-size:13px;font-weight:600;text-decoration:none}
.chip:hover{background:var(--blue2);color:#fff;border-color:transparent}

/* Post grid / cards */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:34px 0}
.card{background:var(--card);border:1px solid #e6e9ee;border-radius:6px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 0 20px rgba(150,160,170,.12)}
.card:hover{box-shadow:0 8px 26px rgba(20,40,60,.12);transform:translateY(-2px);transition:.15s}
.card .thumb{aspect-ratio:16/9;background:#e9eef3 center/cover no-repeat;display:block}
.card .body{padding:15px 16px 18px;display:flex;flex-direction:column;gap:8px;flex:1}
.card .kicker{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--blue-d)}
.card h2{font-family:var(--sans);font-size:17px;font-weight:700;color:var(--head);margin:0;line-height:1.3}
.card h2 a{color:var(--head);text-decoration:none}.card h2 a:hover{color:var(--blue-d)}
.card .excerpt{font-size:14px;color:#5a6472;margin:0}
.card .meta{margin-top:auto;font-size:12.5px;color:var(--muted)}
.feature-card{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr}
.feature-card .thumb{aspect-ratio:auto;min-height:280px;height:100%}
.feature-tag{display:inline-block;background:var(--green);color:#063d02;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:3px 9px;border-radius:4px;width:max-content;margin-bottom:8px}

/* Article */
.article{background:#fff}
.article-head{max-width:var(--read);margin:0 auto;padding:32px 20px 8px}
.kicker{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--blue-d)}
.article-head h1{font-family:var(--sans);font-weight:700;font-size:32px;color:var(--head);line-height:1.22;margin:8px 0 12px}
.byline{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.byline .avatar{width:34px;height:34px;border-radius:50%;background:#dbe3ea}
.feature-image{max-width:1000px;margin:20px auto 0;padding:0 20px}.feature-image img{border-radius:6px;width:100%}
.article-body{max-width:var(--read);margin:0 auto;padding:24px 20px 8px}
.article-body p{font-size:17px;line-height:1.75;color:#333;margin:0 0 18px}
.article-body h2{font-family:var(--sans);font-weight:700;font-size:23px;color:var(--head);margin:30px 0 8px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.article-body h3{font-family:var(--sans);font-weight:700;font-size:19px;color:var(--head);margin:24px 0 8px}
.article-body ul,.article-body ol{font-size:17px;line-height:1.75;color:#333;padding-left:22px;margin:0 0 18px}
.article-body img{border-radius:6px;margin:22px auto;max-width:100%}
.article-body blockquote{border-left:4px solid var(--green);margin:22px 0;padding:6px 18px;color:#5a6472;font-size:18px;font-style:italic}

/* Course callout (uses the real green .book-button inside) */
.course-callout{max-width:var(--read);margin:26px auto;padding:20px 22px;background:linear-gradient(180deg,#fff,#f3fbf0);border:1px solid #cdeec4;border-left:5px solid var(--green);border-radius:6px}
.course-callout .lbl{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--green-d)}
.course-callout h3{font-family:var(--sans);font-weight:700;color:var(--head);margin:6px 0 4px;font-size:18px}
.course-callout p{margin:0 0 12px;color:#5a6472;font-size:14px}
.course-callout .book-button{width:auto!important;float:none!important;display:inline-block;font-size:15px;padding:12px 22px}

/* Author bio / end CTA / related */
.author-bio{max-width:var(--read);margin:26px auto;padding:18px 20px;background:#fff;border:1px solid #e6e9ee;border-radius:6px;display:flex;gap:14px;align-items:flex-start}
.author-bio .avatar{width:52px;height:52px;border-radius:50%;background:#dbe3ea;flex:0 0 52px}
.author-bio h4{font-family:var(--sans);font-weight:700;color:var(--head);margin:0 0 2px;font-size:15px}
.author-bio p{margin:0;font-size:13.5px;color:#5a6472}
.end-cta{max-width:var(--read);margin:30px auto;padding:28px;background:#2b3947;color:#fff;border-radius:6px;text-align:center}
.end-cta h3{font-family:var(--sans);font-weight:700;margin:0 0 6px;font-size:20px;color:#fff}
.end-cta p{margin:0 0 14px;color:#dfe5ea;font-size:14px}
.end-cta .book-button{width:auto!important;float:none!important;display:inline-block}
.trust-mini{font-size:12.5px;color:#9fb0c0;margin-top:12px}
.related{max-width:var(--wrap);margin:0 auto;padding:10px 20px 40px}
.related>h3{font-family:var(--sans);font-weight:700;color:var(--head);font-size:19px;margin:0 0 14px;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.related .post-grid{padding:0}

@media(max-width:1000px){.post-grid{grid-template-columns:repeat(2,1fr)}.feature-card{grid-template-columns:1fr}}
@media(max-width:640px){.xct-nav,.xct-mainnav .nav-search{display:none}.post-grid{grid-template-columns:1fr}.article-head h1{font-size:26px}.article-body p{font-size:16px}}