/* Editor-managed content pages (sourcing guides), landing-page layout + guides menu placements.
   Tokens follow style.css: ink #1f2328, muted #5f6368, red #c8102e, line #e4e4e4, warm #f7f5f2. */

.sf-guide { color: #1f2328; background: #fff; font-family: "Hanken Grotesk", Helvetica, Arial, sans-serif; }
.sf-guide .sf-system-header .sf-header__cta { white-space: nowrap; }
.sf-guide-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; color: #c8102e; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.sf-guide-kicker::before { content: ""; display: inline-block; width: 25px; height: 2px; background: currentColor; }
.sf-button--outline { color: #1f2328; border: 1px solid #1f2328; background: transparent; }
.sf-button--outline:hover { color: #fff; background: #1f2328; }
.sf-button--ghost { color: #fff; border: 1px solid rgba(255,255,255,.45); background: transparent; }
.sf-button--ghost:hover { border-color: #fff; background: rgba(255,255,255,.08); }

/* ---------- Hero ---------- */
.sf-lp-hero { border-bottom: 1px solid #e4e4e4; }
.sf-lp-hero__inner { display: grid; width: min(100% - 48px, 1200px); grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(40px, 5vw, 80px); align-items: center; margin: 0 auto; padding: 56px 0 64px; }
.sf-lp-hero .sf-breadcrumbs { margin-bottom: 24px; }
.sf-lp-hero h1 { margin: 0 0 20px; font: 800 clamp(36px, 3.9vw, 54px)/1.04 "Plus Jakarta Sans", sans-serif; letter-spacing: -.04em; text-wrap: balance; }
.sf-lp-hero__lede { max-width: 600px; margin: 0 0 28px; color: #5f6368; font-size: 18px; line-height: 1.6; text-wrap: pretty; }
.sf-lp-hero__actions { display: flex; flex-wrap: wrap; gap: 12px 14px; }
.sf-lp-hero__proof { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 34px 0 0; padding: 26px 0 0; border-top: 1px solid #e4e4e4; list-style: none; }
.sf-lp-hero__proof b { display: block; font: 800 24px/1 "Plus Jakarta Sans", sans-serif; letter-spacing: -.02em; }
.sf-lp-hero__proof li:last-child b { color: #c8102e; }
.sf-lp-hero__proof span { display: block; margin-top: 6px; color: #5f6368; font-size: 12.5px; line-height: 1.4; }
.sf-lp-hero__updated { margin: 22px 0 0; color: #858a90; font-size: 12.5px; }
.sf-lp-hero__media { position: relative; margin: 0; }
.sf-lp-hero__media::before { content: ""; position: absolute; inset: 26px -18px -18px 26px; border: 2px solid #f2dcdd; border-radius: 18px; }
.sf-lp-hero__media img { position: relative; display: block; width: 100%; height: clamp(320px, 38vw, 540px); object-fit: cover; border-radius: 14px; background: #e7e6e2; box-shadow: 0 30px 60px -35px rgba(31,35,40,.5); }
.sf-lp-hero__media figcaption { position: relative; margin-top: 12px; color: #858a90; font-size: 12.5px; line-height: 1.5; }

/* ---------- At a glance ---------- */
.sf-lp-glance { color: #fff; background: #1f2328; }
.sf-lp-glance__inner { width: min(100% - 48px, 1200px); margin: 0 auto; padding: 44px 0 48px; }
.sf-lp-glance__title { margin: 0 0 22px; color: #e7596e; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.sf-lp-glance__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 1px; margin: 0; padding: 0; list-style: none; background: #3b3f44; border: 1px solid #3b3f44; }
.sf-lp-glance__grid li { padding: 22px 22px 24px; background: #1f2328; }
.sf-lp-glance__grid b { display: block; margin-bottom: 14px; color: #e7596e; font: 800 12px/1 "Plus Jakarta Sans", sans-serif; }
.sf-lp-glance__grid p { margin: 0; color: #dfe3e6; font-size: 14.5px; line-height: 1.55; }
.sf-lp-glance__grid a { color: #fff; text-decoration: underline; }

/* ---------- Jump bar ---------- */
.sf-lp-jumpbar { position: sticky; top: 81px; z-index: 40; border-bottom: 1px solid #e4e4e4; background: rgba(255,255,255,.96); backdrop-filter: blur(10px); }
.sf-lp-jumpbar__inner { display: flex; width: min(100% - 48px, 1200px); align-items: center; gap: 4px; margin: 0 auto; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sf-lp-jumpbar__inner::-webkit-scrollbar { display: none; }
.sf-lp-jumpbar__inner > span { flex: 0 0 auto; margin-right: 10px; color: #c8102e; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sf-lp-jumpbar__inner a { flex: 0 0 auto; padding: 15px 12px; color: #3d4247; font-size: 13.5px; font-weight: 600; white-space: nowrap; border-bottom: 2px solid transparent; }
.sf-lp-jumpbar__inner a:hover, .sf-lp-jumpbar__inner a:focus-visible { color: #c8102e; border-bottom-color: #c8102e; }

/* ---------- Bands ---------- */
.sf-band { border-bottom: 1px solid #e4e4e4; }
.sf-band--warm { background: #f7f5f2; }
.sf-band--faq { background: #fff; }
.sf-band__inner { display: grid; width: min(100% - 48px, 1200px); grid-template-columns: minmax(240px, 330px) minmax(0, 1fr); gap: 40px clamp(48px, 6vw, 96px); margin: 0 auto; padding: 84px 0 92px; }
.sf-band__inner--single { grid-template-columns: minmax(0, 1fr); padding: 44px 0 40px; }
.sf-band__head { position: sticky; top: 150px; align-self: start; }
.sf-band__num { display: block; margin-bottom: 18px; color: #c8102e; font: 800 12px/1 "Plus Jakarta Sans", sans-serif; letter-spacing: .12em; }
.sf-band__head h2 { margin: 0; font: 800 clamp(26px, 2.5vw, 34px)/1.12 "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; scroll-margin-top: 140px; text-wrap: balance; }
.sf-band__head h2::before { display: none; }
.sf-band__ask { display: inline-block; margin-top: 22px; color: #1f2328; font-size: 13.5px; font-weight: 700; border-bottom: 1px solid #1f2328; }
.sf-band__ask:hover { color: #c8102e; border-bottom-color: #c8102e; }
.sf-band__head .sf-button { margin-top: 24px; }
.sf-band--brand { color: #fff; background: #1f2328; border-bottom: 0; }
.sf-band--brand .sf-band__num { color: #e7596e; }
.sf-band--brand .sf-guide-body { color: #dfe3e6; }
.sf-band--brand .sf-guide-body strong { color: #fff; }
.sf-band--brand .sf-guide-body a { color: #fff; }
.sf-band--brand .sf-guide-body a:hover { color: #e7596e; }
.sf-band--brand .sf-guide-body li::marker { color: #e7596e; }
.sf-band--brand .sf-guide-body .sf-callout { border-color: #45494f; background: #272b30; color: #dfe3e6; }
.sf-band--brand .sf-guide-body .sf-callout strong:first-child { color: #e7596e; }

/* ---------- Body typography (block editor output) ---------- */
.sf-guide-body { min-width: 0; font-size: 17px; line-height: 1.72; }
.sf-guide-body > * { margin-top: 0; margin-bottom: 1.3em; }
.sf-guide-body > *:last-child { margin-bottom: 0; }
.sf-guide-body > p, .sf-guide-body > ul, .sf-guide-body > ol, .sf-guide-body > h3, .sf-guide-body > h4, .sf-guide-body > .sf-callout { max-width: 760px; }
.sf-guide-body p { text-wrap: pretty; }
.sf-guide-body > p:first-child { font-size: 18.5px; line-height: 1.65; color: #1f2328; }
.sf-guide-body a { color: #b80e2b; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.sf-guide-body a:hover { color: #1f2328; }
.sf-guide-body h3 { margin: 1.6em 0 .6em; font: 700 21px/1.3 "Plus Jakarta Sans", sans-serif; letter-spacing: -.015em; scroll-margin-top: 140px; }
.sf-guide-body h4 { margin: 1.4em 0 .5em; font: 700 17px/1.4 "Plus Jakarta Sans", sans-serif; }
.sf-guide-body ul, .sf-guide-body ol { padding-left: 1.35em; }
.sf-guide-body li { margin-bottom: .45em; }
.sf-guide-body li::marker { color: #c8102e; font-weight: 700; }
.sf-guide-body strong { font-weight: 700; color: #1f2328; }
.sf-guide-body hr { border: 0; border-top: 1px solid #e4e4e4; margin: 2.5em 0; }
.sf-guide-body blockquote { margin: 1.8em 0; padding: 4px 0 4px 22px; border-left: 3px solid #c8102e; color: #3d4247; font-size: 18px; }

/* Callout */
.sf-guide-body .sf-callout { margin: 1.6em 0; padding: 20px 24px; border: 1px solid #f2d6da; border-left: 4px solid #c8102e; border-radius: 6px; background: #fdf5f6; font-size: 16px; }
.sf-guide-body .sf-callout > p { margin: 0; }
.sf-guide-body .sf-callout > p + p { margin-top: .6em; }
.sf-guide-body .sf-callout strong:first-child { display: block; margin-bottom: 4px; color: #9f1028; font-family: "Plus Jakarta Sans", sans-serif; }

/* Tables → comparison panels */
.sf-guide-body figure.wp-block-table { margin: 1.8em 0 2em; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid #e4e4e4; border-radius: 10px; background: #fff; box-shadow: 0 18px 40px -34px rgba(31,35,40,.5); }
.sf-guide-body .wp-block-table table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 14.5px; line-height: 1.5; }
.sf-guide-body .wp-block-table th, .sf-guide-body .wp-block-table td { padding: 12px 16px; border-bottom: 1px solid #ebe8e4; border-right: 1px solid #f1eeea; text-align: left; vertical-align: top; }
.sf-guide-body .wp-block-table th:last-child, .sf-guide-body .wp-block-table td:last-child { border-right: 0; }
.sf-guide-body .wp-block-table thead th { background: #1f2328; color: #fff; font-weight: 700; border-color: #2c3136; }
.sf-guide-body .wp-block-table tbody tr:last-child td { border-bottom: 0; }
.sf-guide-body .wp-block-table tbody tr:nth-child(even) td { background: #faf9f7; }
.sf-guide-body .wp-block-table tbody td:first-child { font-weight: 600; }
.sf-guide-body .wp-block-table figcaption { margin: 0; padding: 10px 16px 12px; color: #858a90; font-size: 12.5px; text-align: left; border-top: 1px solid #ebe8e4; background: #fff; }
.sf-band--brand .sf-guide-body figure.wp-block-table { border-color: #45494f; box-shadow: none; }
.sf-band--brand .sf-guide-body .wp-block-table tbody td { background: #272b30; color: #dfe3e6; border-color: #3b3f44; }
.sf-band--brand .sf-guide-body .wp-block-table tbody tr:nth-child(even) td { background: #2c3136; }
.sf-band--brand .sf-guide-body .wp-block-table figcaption { background: #272b30; border-color: #3b3f44; }

/* Images */
.sf-guide-body figure.wp-block-image { margin: 1.8em 0; }
.sf-guide-body .wp-block-image img { width: 100%; height: auto; max-height: 520px; object-fit: cover; border-radius: 10px; background: #e7e6e2; }
.sf-guide-body .wp-block-image figcaption { margin-top: 10px; color: #858a90; font-size: 13px; line-height: 1.5; text-align: left; }

/* FAQ (core/details) */
.sf-band__body--faq { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start; }
.sf-band__body--faq > *:not(details) { grid-column: 1 / -1; }
.sf-guide-body details.wp-block-details { margin: 0; padding: 0 20px; border: 1px solid #e4e4e4; border-radius: 8px; background: #fff; }
.sf-guide-body details.wp-block-details[open] { border-color: #c9c4bf; box-shadow: 0 18px 40px -34px rgba(31,35,40,.5); }
.sf-guide-body details.wp-block-details > summary { position: relative; padding: 18px 40px 18px 0; cursor: pointer; list-style: none; font: 700 16.5px/1.4 "Plus Jakarta Sans", sans-serif; letter-spacing: -.01em; }
.sf-guide-body details.wp-block-details > summary::-webkit-details-marker { display: none; }
.sf-guide-body details.wp-block-details > summary::after { content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: #c8102e; font-size: 24px; font-weight: 400; line-height: 1; }
.sf-guide-body details.wp-block-details[open] > summary::after { content: "−"; }
.sf-guide-body details.wp-block-details > summary:hover { color: #c8102e; }
.sf-guide-body details.wp-block-details > :not(summary) { margin: 0 0 18px; color: #3d4247; font-size: 15.5px; line-height: 1.65; }

/* Intro band (anything before the first H2 that is not the takeaways list) */
.sf-band--intro .sf-guide-body { max-width: 860px; }

/* Sources */
.sf-band--sources { background: #f7f5f2; }
.sf-lp-sources { max-width: 900px; }
.sf-lp-sources > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; list-style: none; }
.sf-lp-sources > summary::-webkit-details-marker { display: none; }
.sf-lp-sources > summary h2 { margin: 0; font: 800 15px/1.3 "Plus Jakarta Sans", sans-serif; letter-spacing: -.01em; color: #3d4247; }
.sf-lp-sources > summary h2::before { display: none; }
.sf-lp-sources > summary span { color: #c8102e; font-size: 22px; line-height: 1; }
.sf-lp-sources[open] > summary span { transform: rotate(45deg); }
.sf-lp-sources .sf-guide-body { margin-top: 18px; font-size: 14px; color: #5f6368; }
.sf-lp-sources .sf-guide-body li { margin-bottom: .4em; overflow-wrap: anywhere; }
.sf-lp-sources .sf-guide-body .sf-sources { max-width: none; }

/* Mid-page CTA */
.sf-lp-midcta { color: #fff; background: #1f2328; }
.sf-lp-midcta__inner { display: grid; width: min(100% - 48px, 1200px); grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 40px 64px; align-items: center; margin: 0 auto; padding: 64px 0 68px; }
.sf-lp-midcta span { display: block; color: #e7596e; font-size: 11px; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.sf-lp-midcta h2 { max-width: 640px; margin: 14px 0 12px; font: 800 clamp(26px, 2.6vw, 36px)/1.1 "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; }
.sf-lp-midcta p { max-width: 560px; margin: 0; color: #b9bec3; font-size: 15.5px; line-height: 1.65; }
.sf-lp-midcta__actions { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.sf-lp-midcta__actions .sf-button { width: 100%; max-width: 360px; }

/* Related guides */
.sf-guide-related { width: min(100% - 48px, 1200px); margin: 0 auto; padding: 84px 0 96px; }
.sf-guide-related__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sf-guide-related__grid a { display: flex; min-height: 230px; flex-direction: column; padding: 26px; border: 1px solid #e4e4e4; border-radius: 8px; color: #1f2328; background: #fff; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.sf-guide-related__grid a:hover { border-color: #c9c4bf; transform: translateY(-3px); box-shadow: 0 18px 40px -32px rgba(31,35,40,.6); }
.sf-guide-related__grid span { color: #c8102e; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.sf-guide-related__grid h3 { margin: 14px 0 10px; font: 800 21px/1.15 "Plus Jakarta Sans", sans-serif; letter-spacing: -.02em; }
.sf-guide-related__grid p { margin: 0; color: #5f6368; font-size: 14px; line-height: 1.6; }
.sf-guide-related__grid b { margin-top: auto; padding-top: 22px; color: #c8102e; font-size: 13px; }

/* Final CTA reuse */
.sf-guide-cta .sf-guide-cta__contacts { margin: 22px 0 0; color: rgba(255,255,255,.86); font-size: 14px; }
.sf-guide-cta .sf-guide-cta__contacts a { color: #fff; border-bottom: 1px solid rgba(255,255,255,.5); }

/* Guides dropdown: two columns on desktop */
.sf-header .sf-menu-group.is-open .sf-menu-panel--guides { display: grid; width: 560px; grid-template-columns: 1fr 1fr; gap: 2px 6px; }
.sf-header .sf-menu-panel--guides .sf-menu-feature { grid-column: 1 / -1; }

/* Footer: fifth column for guides */
.sf-site-footer__main:has(.sf-site-footer__menu--guides) { grid-template-columns: 1.3fr 1fr 1fr 1fr 1.1fr; }

@media (max-width: 1180px) {
  .sf-header .sf-menu-group.is-open .sf-menu-panel--guides { display: block; width: 100%; }
}
@media (max-width: 1100px) {
  .sf-site-footer__main:has(.sf-site-footer__menu--guides) { grid-template-columns: 1.2fr 1fr 1fr; }
}
@media (max-width: 1024px) {
  .sf-band__inner { grid-template-columns: minmax(0, 1fr); gap: 26px; padding: 64px 0 72px; }
  .sf-band__head { position: static; }
  .sf-band__head h2 { max-width: 720px; }
  .sf-band__ask { display: none; }
  .sf-band__body--faq { grid-template-columns: 1fr; }
  .sf-lp-hero__inner { grid-template-columns: 1fr; gap: 36px; }
  .sf-lp-hero__media::before { display: none; }
  .sf-lp-midcta__inner { grid-template-columns: 1fr; }
  .sf-guide-related__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sf-lp-jumpbar { top: 69px; }
}
@media (max-width: 820px) {
  .sf-lp-hero__inner, .sf-lp-glance__inner, .sf-band__inner, .sf-lp-midcta__inner, .sf-guide-related, .sf-lp-jumpbar__inner { width: min(100% - 40px, 680px); }
  .sf-lp-hero__inner { padding: 34px 0 44px; }
  .sf-lp-hero h1 { font-size: clamp(31px, 8.6vw, 42px) !important; }
  .sf-lp-hero__lede { font-size: 16.5px; }
  .sf-lp-hero__proof { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; margin-top: 26px; padding-top: 20px; }
  .sf-lp-hero__proof b { font-size: 21px; }
  .sf-lp-hero__media img { height: min(62vw, 400px); border-radius: 10px; }
  .sf-lp-glance__inner { padding: 34px 0 38px; }
  .sf-lp-glance__grid { grid-template-columns: 1fr; }
  .sf-lp-jumpbar__inner a { padding: 13px 10px; font-size: 13px; }
  .sf-band__inner { padding: 48px 0 56px; }
  .sf-band__head h2 { font-size: clamp(23px, 6.4vw, 29px) !important; }
  .sf-guide-body { font-size: 16.5px; }
  .sf-guide-body > p:first-child { font-size: 17px; }
  .sf-guide-body .wp-block-table table { font-size: 13.5px; }
  .sf-guide-body details.wp-block-details { padding: 0 16px; }
  .sf-lp-midcta__inner { padding: 48px 0 52px; }
  .sf-lp-midcta__actions .sf-button { max-width: none; }
  .sf-guide-related { padding: 64px 0 72px; }
  .sf-guide-related__grid { grid-template-columns: 1fr; }
  .sf-guide-related__grid a { min-height: 0; }
  .sf-site-footer__main:has(.sf-site-footer__menu--guides) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Inline quote form on content pages (22 Sep 2026) */
.sf-inline-brief .sf-band__inner { display: block; }
.sf-inline-brief__card { max-width: 820px; margin: 0 auto; }
.sf-inline-brief .sf-home-brief__heading h2 { font-size: clamp(24px, 2.4vw, 30px); }