/*! cbi-page 1.0.5 | blog post template redesign, Figma 4352:69230 (1920 frame, content 1310 inside the cfh-frame rails) */

/* ---- hero: copy left (655) | main image right (655), rule on x 960 ---- */
.cfh-page .cbi-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:536px;box-sizing:border-box;border-bottom:1px solid #EEEDEC}
.cfh-page .cbi-hero-l{display:flex;flex-direction:column;justify-content:center;padding:48px 36px 48px 35px}
.cfh-page .cbi-h1{margin:0;max-width:431px;font-family:'Artifictrial',var(--cfh-display);font-weight:500;font-size:32px;line-height:1.05;letter-spacing:-0.5px;color:#1D0A05;text-wrap:pretty}
.cfh-page .cbi-sum{margin:16px 0 0;max-width:388px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:#1D0A05}
.cfh-page .cbi-by{display:flex;align-items:flex-start;margin-top:30px;font-family:var(--cfh-sans);font-weight:400;font-size:14px;letter-spacing:-0.14px}
.cfh-page .cbi-av{flex:none;display:block;width:50px;height:50px;object-fit:cover}
.cfh-page .cbi-by-a{margin-left:20px;padding-top:4px}
.cfh-page .cbi-by-name{line-height:1.3;color:#1D0A05}
.cfh-page .cbi-by-date{margin-top:3px;line-height:1.6;color:#99918E}
.cfh-page .cbi-by-line{flex:none;align-self:stretch;width:1px;margin-left:24px;background:#EEEDEC}
.cfh-page .cbi-by-d{margin-left:20px;padding-top:4px;line-height:1.3}
.cfh-page .cbi-by-pub,.cfh-page .cbi-by-upd{display:flex;gap:.28em;color:#1D0A05}
.cfh-page .cbi-by-upd{margin-top:5px}
.cfh-page .cbi-by-v{color:#99918E}
.cfh-page .cbi-by-upd:has(.w-dyn-bind-empty){display:none}
.cfh-page .cbi-hero-r{min-width:0;border-left:1px solid #EEEDEC;padding:32px 31px 31px}
.cfh-page .cbi-hero-img{display:block;width:100%;height:100%;min-height:300px;object-fit:cover}

/* ---- bar: "Summarize this article with AI" + 5 buttons | "Table of Contents" ---- */
.cfh-page .cbi-bar,.cfh-page .cbi-main{display:grid;grid-template-columns:minmax(0,984fr) minmax(0,326fr)}
.cfh-page .cbi-bar{min-height:118px;box-sizing:border-box;border-bottom:1px solid #EEEDEC}
.cfh-page .cbi-bar-l{display:flex;align-items:center;padding:0 32px 0 35px}
.cfh-page .cbi-bar-l>.w-embed{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%}
/* Webflow's clearfix pseudo-elements on .w-embed would become two extra flex items */
.cfh-page .cbi-bar-l>.w-embed::before,.cfh-page .cbi-bar-l>.w-embed::after{content:none;display:none}
.cbi-ai-l,.cfh-page .cbi-toc-h{margin:0;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:#1D0A05}
.cbi-ai{display:flex;gap:16px}
.cbi-ai-b{flex:none;display:grid;place-items:center;width:54px;height:54px;background:#F4F2EE;transition:background-color .18s ease-out}
.cbi-ai-b:hover{background:#EEEDEC}
.cbi-ai-b img{display:block;max-width:none}
.cfh-page .cbi-bar-r{display:flex;align-items:center;border-left:1px solid #EEEDEC;padding:0 32px 0 35px}

/* ---- article | sidebar (rule on x 1289 runs from the bar down to the FAQ) ---- */
.cfh-page .cbi-main{border-bottom:1px solid #EEEDEC}
.cfh-page .cbi-art{min-width:0}
.cfh-page .cbi-tldr{padding:36px 90px 38px 35px;border-bottom:1px solid #EEEDEC}
.cfh-page .cbi-tldr-h{margin:0 0 30px;font-family:var(--cfh-sans);font-weight:600;font-size:16px;line-height:1.6;letter-spacing:-0.16px;color:#292929}
.cfh-page .cbi-tldr:has(.w-dyn-bind-empty),.cfh-page .cbi-tldr.is-empty{display:none}
.cfh-page .cbi-rt-slot{padding:46px 90px 48px 35px}
.cfh-page .cbi-art:has(.cbi-tldr .w-dyn-bind-empty) .cbi-rt-slot,.cfh-page .cbi-art.no-tldr .cbi-rt-slot{padding-top:36px}

/* rich text: TL;DR + article body */
.cfh-page .cbi-tldr-slot .w-richtext,.cfh-page .cbi-rt-slot .w-richtext{font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.6;letter-spacing:-0.32px;color:#292929}
.cfh-page .cbi-tldr-slot .w-richtext>*,.cfh-page .cbi-rt-slot .w-richtext>*{max-width:859px}
.cfh-page .cbi-tldr-slot .w-richtext>:first-child,.cfh-page .cbi-rt-slot .w-richtext>:first-child{margin-top:0}
.cfh-page .cbi-tldr-slot .w-richtext>:last-child,.cfh-page .cbi-rt-slot .w-richtext>:last-child{margin-bottom:0}
.cfh-page .cbi-tldr-slot ul,.cfh-page .cbi-tldr-slot ol{margin:0;padding:0;list-style:none}
.cfh-page .cbi-tldr-slot li{position:relative;margin:0 0 25.6px;padding-left:20px}
.cfh-page .cbi-tldr-slot li:last-child{margin-bottom:0}
.cfh-page .cbi-tldr-slot li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;background:#292929}
.cfh-page .cbi-tldr-slot p{margin:0 0 25.6px}
.cfh-page .cbi-tldr-slot strong,.cfh-page .cbi-rt-slot strong{font-weight:600}
.cfh-page .cbi-rt-slot h2{position:relative;margin:96px 0 24px;font-family:'Artifictrial',var(--cfh-display);font-weight:500;font-size:32px;line-height:1.05;letter-spacing:-0.5px;color:#1D0A05;scroll-margin-top:24px}
/* section rule: 48px under the previous section, 46px above the heading, across the whole article column */
.cfh-page .cbi-rt-slot h2::before{content:"";position:absolute;left:-35px;right:-90px;top:-47px;height:1px;background:#EEEDEC;max-width:none}
.cfh-page .cbi-rt-slot .w-richtext>h2:first-child{margin-top:0}
.cfh-page .cbi-rt-slot .w-richtext>h2:first-child::before{display:none}
.cfh-page .cbi-rt-slot h3{margin:40px 0 16px;font-family:'Artifictrial',var(--cfh-display);font-weight:500;font-size:22px;line-height:1.2;letter-spacing:-0.3px;color:#1D0A05}
.cfh-page .cbi-rt-slot h4{margin:32px 0 12px;font-family:var(--cfh-sans);font-weight:600;font-size:18px;line-height:1.4;color:#1D0A05}
.cfh-page .cbi-rt-slot h2+h3{margin-top:0}
.cfh-page .cbi-rt-slot p{margin:0 0 25.6px}
.cfh-page .cbi-rt-slot a{color:#1254E2;text-decoration:underline;text-underline-offset:2px}
.cfh-page .cbi-rt-slot ul,.cfh-page .cbi-rt-slot ol{margin:0 0 25.6px;padding-left:24px}
.cfh-page .cbi-rt-slot ul{list-style:square}
.cfh-page .cbi-rt-slot li{margin:0}
.cfh-page .cbi-rt-slot li::marker{color:#292929}
.cfh-page .cbi-rt-slot blockquote{margin:0 0 25.6px;padding:4px 0 4px 20px;border-left:2px solid #FF5400;font-size:16px;line-height:1.6}
.cfh-page .cbi-rt-slot figure{margin:32px 0}
.cfh-page .cbi-rt-slot img{max-width:100%;height:auto}

/* sidebar: table of contents + demo box */
.cfh-page .cbi-side{min-width:0;border-left:1px solid #EEEDEC}
.cfh-page .cbi-side-in{position:sticky;top:0}
.cfh-page .cbi-toc{padding:36px 32px 0 35px}
.cfh-page .cbi-toc:empty{display:none}
.cbi-toc-a{display:block;max-width:190px;margin:0 0 22px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.6;letter-spacing:-0.16px;color:#292929;text-decoration:none;transition:color .18s ease-out}
.cbi-toc-a:last-child{margin-bottom:0}
.cbi-toc-a:hover{color:#1D0A05;text-decoration:underline;text-underline-offset:3px}
.cbi-toc-a.is-on{color:#FF5400}
.cfh-page .cbi-cta{margin-top:36px;padding:36px 35px 40px;background:#F9F7F4;border-top:1px solid #EEEDEC;border-bottom:1px solid #EEEDEC}
.cfh-page .cbi-toc:empty+.cbi-cta{margin-top:0;border-top:0}
.cfh-page .cbi-cta-h{margin:0;font-family:var(--cfh-sans);font-weight:500;font-size:16px;line-height:1.6;letter-spacing:-0.32px;color:#292929}
.cfh-page .cbi-cta-l{margin:17px 0 0;padding:0;list-style:none}
.cfh-page .cbi-cta-l li{position:relative;margin:0;padding-left:20px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:2;letter-spacing:-0.16px;color:#292929}
.cfh-page .cbi-cta-l li::before{content:"";position:absolute;left:1px;top:13.4px;width:5.15px;height:5.15px;background:#D9D8D5;transform:rotate(45deg)}
.cfh-page .cbi-cta-btn{display:inline-flex;align-items:center;box-sizing:border-box;width:164px;height:36px;margin-top:29px;padding:8px 32px 8px 16px;
  background:#FF5400 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M7.51513 5.11722L10.89 8.71702C10.9249 8.75416 10.9525 8.79828 10.9714 8.84683C10.9903 8.89539 11 8.94744 11 9C11 9.05256 10.9903 9.10461 10.9714 9.15317C10.9525 9.20172 10.9249 9.24584 10.89 9.28298L7.51513 12.8828C7.44477 12.9578 7.34934 13 7.24983 13C7.15032 13 7.05489 12.9578 6.98452 12.8828C6.91416 12.8077 6.87463 12.7059 6.87463 12.5998C6.87463 12.4937 6.91416 12.3919 6.98452 12.3168L9.71959 9.39998L2.37499 9.39998C2.27553 9.39998 2.18016 9.35784 2.10983 9.28283C2.03951 9.20782 2 9.10608 2 9C2 8.89392 2.03951 8.79218 2.10983 8.71717C2.18016 8.64216 2.27553 8.60002 2.37499 8.60002L9.71959 8.60002L6.98452 5.68318C6.91416 5.60813 6.87463 5.50634 6.87463 5.4002C6.87463 5.29406 6.91416 5.19227 6.98452 5.11722C7.05489 5.04216 7.15032 5 7.24983 5C7.34934 5 7.44477 5.04216 7.51513 5.11722Z' fill='%23FCFBF8' stroke='%23FCFBF8' stroke-width='0.2'/%3E%3C/svg%3E") no-repeat right 10px center/16px 16px;
  font-family:var(--cfh-mono);font-weight:400;font-size:14px;line-height:19.6px;color:#FCFBF8;text-decoration:none;white-space:nowrap;transition:background-color .18s ease-out}
.cfh-page .cbi-cta-btn:hover{background-color:#E64B00}

/* ---- FAQ: heading, then accordion in the right column (rule on x 951) ---- */
.cfh-page .cbi-faq{border-bottom:1px solid #EEEDEC;scroll-margin-top:24px}
.cfh-page .cbi-faq:has(.w-dyn-bind-empty),.cfh-page .cbi-faq.is-empty{display:none}
.cfh-page .cbi-faq-h{margin:0;padding:120px 36px 71px 35px;font-family:'Artifictrial',var(--cfh-display);font-weight:400;font-size:48px;line-height:1;letter-spacing:-0.96px;color:#1D0A05}
.cfh-page .cbi-faq-grid{display:grid;grid-template-columns:minmax(0,646fr) minmax(0,664fr);border-top:1px solid #EEEDEC}
.cfh-page .cbi-faq-slot{min-width:0;border-left:1px solid #EEEDEC}
.cbi-faq-item{border-bottom:1px solid #EEEDEC}
.cbi-faq-item:last-child{border-bottom:0}
.cbi-faq-q{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;width:100%;margin:0;padding:27px 26px 27px 28px;background:none;border:0;border-radius:0;cursor:pointer;text-align:left;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:#1D0A05}
.cbi-faq-q svg{flex:none;width:15px;height:8px;margin-top:6px;transition:transform .25s ease}
.cbi-faq-item.is-open .cbi-faq-q svg{transform:rotate(180deg)}
.cbi-faq-a{display:none;padding:0 133px 27px 28px;margin-top:-11px;font-family:var(--cfh-sans);font-weight:400;font-size:16px;line-height:1.3;letter-spacing:-0.16px;color:#737372}
.cbi-faq-a p{margin:0 0 12px}.cbi-faq-a>:last-child{margin-bottom:0}
.cbi-faq-a a{color:#1254E2}
.cbi-faq-item.is-open .cbi-faq-a{display:block}
.cfh-page .cbi-faq~.cfh-foot{margin-top:120px}
.cfh-page .cbi-faq.is-empty~.cfh-foot{margin-top:90px}

/* ---- small desktop ---- */
@media (max-width:1199px){
  .cfh-page .cbi-tldr,.cfh-page .cbi-rt-slot{padding-right:48px}
  .cfh-page .cbi-rt-slot h2::before{right:-48px}
  .cbi-faq-a{padding-right:48px}
}
/* ---- tablet: one column; the TOC drops, the demo box sits under the article ---- */
@media (max-width:991px){
  .cfh-page .cbi-hero{grid-template-columns:minmax(0,1fr);min-height:0}
  .cfh-page .cbi-hero-l{padding:56px 32px 40px}
  .cfh-page .cbi-h1{max-width:640px;font-size:32px}
  .cfh-page .cbi-sum{max-width:560px}
  .cfh-page .cbi-hero-r{border-left:0;border-top:1px solid #EEEDEC;padding:24px}
  .cfh-page .cbi-hero-img{height:auto;min-height:0;aspect-ratio:592/472}
  .cfh-page .cbi-bar,.cfh-page .cbi-main{grid-template-columns:minmax(0,1fr)}
  .cfh-page .cbi-bar{min-height:0}
  .cfh-page .cbi-bar-l{padding:20px 32px}
  .cfh-page .cbi-bar-r,.cfh-page .cbi-toc{display:none}
  .cfh-page .cbi-tldr{padding:32px}
  .cfh-page .cbi-rt-slot{padding:40px 32px 48px}
  .cfh-page .cbi-rt-slot h2::before{left:-32px;right:-32px}
  .cfh-page .cbi-side{border-left:0;border-top:1px solid #EEEDEC}
  .cfh-page .cbi-side-in{position:static}
  .cfh-page .cbi-cta{margin-top:0;border:0;padding:32px}
  .cfh-page .cbi-faq-h{padding:72px 32px 40px;font-size:40px}
  .cfh-page .cbi-faq-grid{grid-template-columns:minmax(0,1fr)}
  .cfh-page .cbi-faq-sp{display:none}
  .cfh-page .cbi-faq-slot{border-left:0}
  .cbi-faq-q{padding:24px 32px}
  .cbi-faq-a{padding:0 32px 24px;margin-top:-8px}
  .cfh-page .cbi-faq~.cfh-foot{margin-top:72px}
}
/* ---- phones ---- */
@media (max-width:767px){
  .cfh-page .cbi-hero-l{padding:40px 24px 32px}
  .cfh-page .cbi-h1{font-size:28px}
  .cfh-page .cbi-by{flex-wrap:wrap;row-gap:12px}
  .cfh-page .cbi-by-line{display:none}
  .cfh-page .cbi-by-d{flex-basis:100%;margin-left:0;padding-top:0}
  .cfh-page .cbi-hero-r{padding:16px}
  .cfh-page .cbi-bar-l{padding:20px 24px}
  .cfh-page .cbi-bar-l>.w-embed{flex-direction:column;align-items:flex-start;gap:14px}
  .cbi-ai{gap:10px}
  .cbi-ai-b{width:48px;height:48px}
  .cfh-page .cbi-tldr{padding:28px 24px}
  .cfh-page .cbi-rt-slot{padding:32px 24px 40px}
  .cfh-page .cbi-rt-slot h2{margin-top:80px;font-size:26px}
  .cfh-page .cbi-rt-slot h2::before{top:-40px;left:-24px;right:-24px}
  .cfh-page .cbi-cta{padding:28px 24px}
  .cfh-page .cbi-faq-h{padding:56px 24px 32px;font-size:32px}
  .cbi-faq-q{padding:20px 24px}
  .cbi-faq-a{padding:0 24px 20px}
  .cfh-page .cbi-faq~.cfh-foot{margin-top:48px}
}

/* ---- 1.0.3: responsive fixes from the all-sizes sweep (2026-10-01) ---- */
/* ---- long words never run past the column ---- */
.cfh-page .cbi-h1,.cfh-page .cbi-rt-slot :is(h2,h3,h4),.cfh-page .cbi-faq-h,.cbi-faq-q{overflow-wrap:break-word}
/* ---- small phones: 20px inset, AI buttons share the row, smaller article headings ---- */
@media (max-width:479px){
  .cfh-page .cbi-hero-l{padding:32px 20px 28px}
  .cfh-page .cbi-hero-r{padding:12px}
  .cfh-page .cbi-bar-l{padding:20px}
  .cbi-ai{width:100%;gap:8px}
  .cbi-ai-b{flex:1 1 0;width:auto;max-width:48px;height:auto;aspect-ratio:1}
  .cfh-page .cbi-tldr{padding:24px 20px}
  .cfh-page .cbi-rt-slot{padding:28px 20px 36px}
  .cfh-page .cbi-rt-slot h2{margin-top:72px;font-size:24px}
  .cfh-page .cbi-rt-slot h2::before{top:-36px;left:-20px;right:-20px}
  .cfh-page .cbi-cta{padding:24px 20px}
  .cfh-page .cbi-faq-h{padding:48px 20px 28px;font-size:28px}
  .cbi-faq-q{padding:18px 20px}
  .cbi-faq-a{padding:0 20px 18px}
}

/* ---- 1.0.4: the author row follows its own column, not the viewport: when the hero column is narrow (992-1099 desktop,
   tablets, phones) the dates drop under the name instead of breaking into three lines ---- */
.cfh-page .cbi-hero-l{container-type:inline-size}
.cfh-page .cbi-by-date,.cfh-page .cbi-by-pub,.cfh-page .cbi-by-upd{white-space:nowrap}
@container (max-width:470px){
  .cfh-page .cbi-by{flex-wrap:wrap;row-gap:12px}
  .cfh-page .cbi-by-line{display:none}
  .cfh-page .cbi-by-d{flex-basis:100%;margin-left:0;padding-top:0}
}
/* ---- small desktop: the sidebar keeps a usable 300px (TOC + demo box no longer squeezed to ~175px) ---- */
@media (min-width:992px) and (max-width:1199px){
  .cfh-page .cbi-bar,.cfh-page .cbi-main{grid-template-columns:minmax(0,1fr) 300px}
  .cfh-page .cbi-bar-r{padding:0 24px}
  .cfh-page .cbi-toc{padding:32px 24px 0}
  .cfh-page .cbi-cta{padding:32px 24px 36px}
}

/* ---- footer copyright at 320: may wrap instead of running into the column rule (2026-10-01 QA) ---- */
@media (max-width:359px){
  .cfh-page .cfh-foot .cfh-foot-copy{white-space:normal;padding-right:12px}
}
