@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Poppins:wght@400;500;600;700;800&display=swap');
/* ===== CS Blog Blocks ===== */
/* Block body paragraphs inherit from their container (beat .csbb-content p bleed) */
.cs-callout__body p,.cs-cta__body p,.cs-profile__bio p,.cs-steps__text p,.cs-highlight__body p,.cs-faq__a p{margin:0 0 1em;color:inherit;font-size:inherit;line-height:inherit;}
.cs-callout__body p:last-child,.cs-cta__body p:last-child,.cs-profile__bio p:last-child,.cs-steps__text p:last-child,.cs-highlight__body p:last-child,.cs-faq__a p:last-child{margin-bottom:0;}

/* Callout */
.cs-callout{background:#F9F8FF;border:1px solid #DFD8F5;border-radius:16px;padding:12px 16px;margin:0 0 1.5em;}
.cs-callout__heading{display:flex;align-items:center;gap:8px;margin-bottom:8px;color:#703DC1;}
.cs-callout__icon{display:inline-flex;width:16px;height:16px;flex:0 0 16px;}
.cs-callout__icon svg{width:100%;height:100%;}
.cs-callout__label{font-weight:700;font-size:14px;line-height:20px;}
.cs-callout__body{color:#262834;font-size:14px;line-height:20px;}
.cs-callout--tip{background:#FFF3FB;border-color:#F9CDDC;}
.cs-callout--tip .cs-callout__heading{color:#D53782;}
.cs-callout--warning{background:#FFF4F2;border-color:#F9C4C0;}
.cs-callout--warning .cs-callout__heading{color:#E93741;}

/* CTA */
.cs-cta{position:relative;overflow:hidden;background:#703DC1;border-radius:16px;padding:48px 40px;margin:2em 0;text-align:center;}
.cs-cta__bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
/* Decorative blobs drift on scroll (transform set by js/toc.js), mirroring the homepage para1/para2 parallax. */
.cs-cta__blob{will-change:transform;}
@media (prefers-reduced-motion: reduce){.cs-cta__blob{transform:none !important;}}
.cs-cta__inner{position:relative;z-index:1;max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:16px;align-items:center;}
.cs-cta__pre{margin:0;font-size:12px;line-height:16px;font-weight:600;letter-spacing:1.8px;text-transform:uppercase;color:#FCEBEF;}
.cs-cta__heading{margin:0;font-family:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:28px;line-height:1.2;font-weight:700;color:#fff;}
.cs-cta__body{font-size:16px;line-height:24px;color:#fff;}
.cs-cta__btn{display:inline-flex;flex-direction:row;align-items:center;background:#6AD2F1;color:#360484;padding:5px 5px 5px 20px;border-radius:50px;font-family:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:400;font-size:16px;line-height:1.2;text-decoration:none;margin-top:8px;transition:.2s ease-in-out;}
.cs-cta__btntext{padding:10px 10px 10px 0;line-height:1.2;transition:.2s ease-in-out;}
.cs-cta__btn:hover .cs-cta__btntext{margin-right:30px;}
.cs-cta__arrow{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;background:#DD509A;border-radius:50px;color:#fff;flex:0 0 40px;transition:.2s ease-in-out;}
.cs-cta__btn:hover .cs-cta__arrow{transform:rotate(180deg);}
.cs-cta__arrow svg{width:18px;height:18px;fill:currentColor;}

/* Profile card */
.cs-profile{display:flex;gap:18px;align-items:flex-start;background:#F9F8FF;border:1px solid #DFD8F5;border-radius:12px;padding:20px;margin:2em 0;}
.cs-profile__avatar{flex:0 0 48px;width:48px;height:48px;border-radius:50%;object-fit:cover;}
.cs-profile__content{display:flex;flex-direction:column;gap:12px;}
.cs-profile__head{display:flex;flex-direction:column;gap:2px;}
.cs-profile__eyebrow{margin:0;font-size:12px;line-height:18px;font-weight:600;color:#703DC1;text-transform:uppercase;}
.cs-profile__name{margin:0;font-size:16px;line-height:24px;font-weight:700;color:#262834;}
.cs-profile__name a{color:inherit;text-decoration:none;}
.cs-profile__name a:hover{text-decoration:underline;}
.cs-profile__role{margin:0;font-size:14px;line-height:20px;color:#5F6377;}
.cs-profile__bio{font-size:14px;line-height:20px;color:#262834;}

/* Step list */
.cs-steps{list-style:none !important;counter-reset:cs-step;margin:2em 0;padding:0 !important;}
.cs-steps__item{counter-increment:cs-step;display:flex !important;gap:16px;align-items:flex-start;padding:24px 0;border-top:1px solid #D6D8E2;list-style:none !important;margin:0 !important;}
.cs-steps__item::marker{content:"" !important;}
.cs-steps__item:first-child{border-top:none;padding-top:0;}
.cs-steps__item:last-child{padding-bottom:0;}
.cs-steps__item::before{content:counter(cs-step,decimal-leading-zero);flex:0 0 auto;min-width:72px;font-family:"Poppins",sans-serif;font-size:52px;font-weight:800;line-height:1;letter-spacing:-2.08px;color:#DFD8F5;}
.cs-steps__content{display:flex;flex-direction:column;gap:8px;padding-top:2px;}
.cs-steps__title{margin:0;font-size:16px;line-height:24px;font-weight:700;color:#262834;}
.cs-steps__text{font-size:14px;line-height:20px;color:#5F6377;}

/* Highlight */
.cs-highlight{position:relative;overflow:hidden;background:#F3EFFE;border:1px solid #DFD8F5;border-radius:16px;padding:40px 28px;margin:2em 0;box-shadow:0 2px 2px rgba(0,0,0,.08),0 4px 4px rgba(0,0,0,.08);}
.cs-highlight__blob{position:absolute;right:0;bottom:0;width:284px;height:auto;pointer-events:none;}
.cs-highlight__title{position:relative;z-index:1;margin:0 0 13px;font-size:24px;line-height:32px;font-weight:700;color:#703DC1;}
.cs-highlight__body{position:relative;z-index:1;font-size:16px;line-height:24px;color:#262834;}

/* FAQ - dividers, no cards */
.cs-faq{margin:2em 0;border:1px solid #D6D8E2;} /* full box per Figma (was top-only) */
.cs-faq__item{border-bottom:1px solid #D6D8E2;background:none;border-radius:0;}
.cs-faq__item:last-child{border-bottom:none;} /* box bottom replaces last divider */
.cs-faq__q{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;font-weight:600;font-size:16px;line-height:24px;color:#262834;}
.cs-faq__q::-webkit-details-marker{display:none;}
.cs-faq__item[open] .cs-faq__q{color:#703DC1;}
.cs-faq__chev{flex:0 0 14px;width:14px;height:14px;color:#5F6377;transition:transform .2s ease;}
.cs-faq__chev svg{width:100%;height:100%;fill:currentColor;}
.cs-faq__item[open] .cs-faq__chev{transform:rotate(180deg);color:#703DC1;}
.cs-faq__a{padding:0 20px 16px;font-size:14px;line-height:20px;color:#262834;}

/* Rank Math FAQ block (.csbb-content .cs-rankmath-faq) — styled + made an accordion to match .cs-faq.
   Markup: .csbb-content .cs-rankmath-faq > .rank-math-list > .rank-math-list-item > h3.rank-math-question + div.rank-math-answer.
   Accordion toggle (.is-open on the item) is added by js/toc.js. */
.csbb-content .cs-rankmath-faq{margin:2em 0;border:1px solid #D6D8E2;}
.csbb-content .cs-rankmath-faq .rank-math-list{margin:0;padding:0;}
.csbb-content .cs-rankmath-faq .rank-math-list-item{border-bottom:1px solid #D6D8E2;}
.csbb-content .cs-rankmath-faq .rank-math-list-item:last-child{border-bottom:none;}
.csbb-content .cs-rankmath-faq .rank-math-question{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0;padding:16px 20px;cursor:pointer;font-family:Poppins,sans-serif;font-weight:600;font-size:16px;line-height:24px;color:#262834;}
.csbb-content .cs-rankmath-faq .rank-math-question::after{content:"";flex:0 0 14px;width:14px;height:14px;background-color:#5F6377;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M233.4 406.6c12.5 12.5 32.8 12.5 45.3 0l192-192c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L256 338.7 86.6 169.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l192 192z'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .2s,background-color .2s;}
.csbb-content .cs-rankmath-faq .rank-math-list-item.is-open .rank-math-question{color:#703DC1;}
.csbb-content .cs-rankmath-faq .rank-math-list-item.is-open .rank-math-question::after{transform:rotate(180deg);background-color:#703DC1;}
.csbb-content .cs-rankmath-faq .rank-math-answer{display:none;padding:0 20px 16px;}
.csbb-content .cs-rankmath-faq .rank-math-list-item.is-open .rank-math-answer{display:block;}
.csbb-content .cs-rankmath-faq .rank-math-answer p{margin:0;font-family:Poppins,sans-serif;font-weight:400;font-size:14px;line-height:20px;color:#262834;}
.csbb-content .cs-rankmath-faq .rank-math-answer p + p{margin-top:1em;}
.csbb-content .cs-rankmath-faq .rank-math-answer a{color:#703DC1;text-decoration:underline;}

/* (TOC styling moved into the template's self-contained TOC code block — code-css.) */

/* Reading progress bar (fixed bottom of viewport) */
.csbb-progress{position:fixed;left:0;bottom:0;width:100%;height:4px;background:transparent;z-index:9999;pointer-events:none;}
.csbb-progress__fill{height:100%;width:0;background:#703DC1;}

/* Tooltip (shortcode) */
.cs-tooltip{position:relative;border-bottom:2px dotted #703DC1;cursor:help;}
.cs-tooltip__bubble{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(calc(-50% + var(--cs-tip-shift, 0px)));width:max-content;max-width:min(280px, calc(100vw - 24px));background:#fff;color:#262834;font-size:14px;font-weight:400;line-height:20px;text-align:left;padding:8px 12px;border:1px solid #DFD8F5;border-radius:12px;box-shadow:0 6px 18px rgba(38,40,52,.10);opacity:0;visibility:hidden;transition:opacity .15s ease;z-index:30;}
.cs-tooltip:hover .cs-tooltip__bubble,.cs-tooltip:focus .cs-tooltip__bubble{opacity:1;visibility:visible;}
