/* =====================================================================
   Serialetic — Article Design System
   Central stylesheet for the article layout, patterns and template.
   Load on the front-end AND in the block editor (see enqueue snippet).
   All visual styling is driven by the `.sl-*` classes below, so a global
   change (colour, spacing, radius) is a one-line edit here.
   ===================================================================== */

/* ----------------------------- FONTS ------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,400&family=Source+Sans+3:ital,wght@0,400;0,600;1,400&family=Quicksand:wght@500;600;700&family=Inter:wght@400;700&display=swap');

/* ----------------------------- TOKENS ------------------------------ */
:root{
  --sl-navy:#0D2149;
  --sl-navy-2:#13315F;
  --sl-navy-3:#1C3A72;
  --sl-ink:#2B3444;
  --sl-ink-2:#3A4353;
  --sl-pink:#EC1E5A;
  --sl-pink-soft:#FF87AC;
  --sl-pink-bg:#FDEEF4;
  --sl-muted:#8791A6;
  --sl-muted-2:#5A6478;
  --sl-muted-3:#9AA3B5;
  --sl-line:#E7E9F0;
  --sl-line-2:#B9C0D0;
  --sl-box:#F5F6FB;
  --sl-box-2:#F7F7F7;
  --sl-yellow:#F4F2CF;
  --sl-blue-link:#13458E;
  --sl-red:#FF0244;

  --sl-serif:'Source Serif 4', Georgia, serif;
  --sl-sans:'Poppins', system-ui, sans-serif;
  --sl-round:'Quicksand', system-ui, sans-serif;

  --sl-content:1120px;
  --sl-side:243px;
  --sl-gap:61px;
  --sl-radius:16px;
}

/* --------------------------- FOUNDATION ---------------------------- */
.sl-article *{box-sizing:border-box}
.sl-article{
  font-family:var(--sl-serif);
  color:var(--sl-ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  background:#fff;
}
.sl-article a{color:inherit;text-decoration:none}
.sl-article img{max-width:100%;height:auto;display:block}

.sl-wrap{
  width:100%;
  max-width:calc(var(--sl-content) + 48px);
  margin-inline:auto;
  padding-inline:24px;
}

/* =============================== HERO ============================== */
.sl-hero{
  background:var(--sl-navy);
  color:#fff;
  padding-block:clamp(32px,4vw,48px) clamp(32px,4vw,44px);
  min-height:404px;
}
.sl-hero__breadcrumb{
  font-family:var(--sl-sans);font-weight:500;font-size:12px;line-height:18px;
  color:rgba(255,255,255,.55);
}
.sl-hero__breadcrumb span{margin-inline:6px;opacity:.7}
.sl-hero a{color:inherit;text-decoration:none}
.sl-hero__breadcrumb a:hover{color:#fff}
.sl-eyebrow{
  font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;
  letter-spacing:1.76px;text-transform:uppercase;color:var(--sl-pink-soft);
  margin-top:18px;
}
.sl-hero__title{
  font-family:var(--sl-sans);font-weight:700;
  font-size:clamp(28px,4.2vw,44px);line-height:1.16;
  letter-spacing:-0.02em;color:#fff;margin-top:10px;max-width:1010px;
}
.sl-hero__lede{
  font-family:var(--sl-serif);font-weight:400;
  font-size:clamp(16px,1.4vw,18px);line-height:1.6;
  color:rgba(255,255,255,.82);margin-top:13px;max-width:625px;
}

/* byline */
.sl-byline{display:flex;align-items:center;gap:16px;margin-top:clamp(24px,3vw,36px);flex-wrap:wrap}
.sl-avatar{
  width:44px;height:44px;border-radius:50%;flex:none;
  background:linear-gradient(135deg,#28407A 0%,#1C3266 60%);
  display:flex;align-items:center;justify-content:center;
  font-family:'Inter',sans-serif;font-weight:700;font-size:8.6px;color:#fff;
  letter-spacing:.5px;
}
.sl-byline__name{font-family:var(--sl-sans);font-weight:600;font-size:14px;line-height:1.2;color:#fff}
.sl-byline__role{font-family:var(--sl-sans);font-weight:500;font-size:12px;line-height:1.3;color:rgba(255,255,255,.6);margin-top:3px}
.sl-byline__divider{width:1px;height:30px;background:rgba(255,255,255,.25)}
.sl-byline__reading{font-family:var(--sl-sans);font-weight:500;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.72)}

/* ============================ BODY LAYOUT ========================= */
.sl-body{padding-block:clamp(28px,3.5vw,44px) 0}
.sl-body__grid:not(:has(> .wp-block-group__inner-container)),
.sl-body__grid > .wp-block-group__inner-container{
  display:grid;
  grid-template-columns:var(--sl-side) minmax(0,1fr);
  gap:var(--sl-gap);
  align-items:start;
}
.sl-sidebar{position:sticky;top:32px;margin-top:0}
.sl-main{min-width:0;margin-top:0}

/* ----------------------------- SIDEBAR ---------------------------- */
.sl-side-card{
  background:#fff;border:1px solid #ECEEF3;border-radius:var(--sl-radius);
  padding:21px 20px 22px;box-shadow:0 1px 3px rgba(16,24,64,.04);
}
.sl-label{
  font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;
  letter-spacing:1.76px;text-transform:uppercase;color:var(--sl-muted);
}
.sl-toc{margin-top:22px}
.sl-toc__item{display:flex;align-items:flex-start;gap:10px;padding:9px 0;position:relative}
.sl-toc__num{
  font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:19px;
  letter-spacing:.44px;color:var(--sl-line-2);min-width:16px;flex:none;margin:0;
}
.sl-toc__txt{font-family:var(--sl-sans);font-weight:500;font-size:14px;line-height:19px;color:var(--sl-ink);margin:0}
.sl-toc__item.is-active .sl-toc__num{color:var(--sl-pink)}
.sl-toc__item.is-active .sl-toc__txt{font-weight:700;color:var(--sl-navy)}
.sl-toc__item.is-active::before{
  content:"";position:absolute;left:-14px;top:7px;bottom:7px;width:3px;
  border-radius:2px;background:var(--sl-pink);
}

.sl-cta-card{
  margin-top:20px;background:var(--sl-navy);border-radius:14px;
  padding:22px 19px 18px;color:#fff;
}
.sl-cta-card__t{font-family:var(--sl-sans);font-weight:600;font-size:15px;line-height:1.35;color:#fff}
.sl-cta-card__d{font-family:var(--sl-serif);font-weight:400;font-size:13px;line-height:1.55;color:rgba(255,255,255,.72);margin-top:10px}
.sl-cta-card__stat{font-family:'Source Sans 3',sans-serif;font-style:italic;font-size:12px;line-height:1.35;color:rgba(255,255,255,.5);margin-top:10px}

.sl-btn-pink{
  display:flex;align-items:center;justify-content:center;
  background:var(--sl-pink);color:#fff;border-radius:9px;
  font-family:var(--sl-sans);font-weight:600;font-size:13px;line-height:20px;
  padding:12px 20px;margin-top:16px;transition:filter .15s ease;
}
.sl-btn-pink:hover{filter:brightness(1.07)}

/* -------------------------- MAIN COLUMN --------------------------- */
.sl-figure{
  width:100%;aspect-ratio:816/341;border-radius:var(--sl-radius);
  background:linear-gradient(135deg,#EEF0F6 0%,#F6F7FB 50%);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-family:'Inter',sans-serif;font-size:12px;color:var(--sl-line-2);
  letter-spacing:.5px;border:1px solid #EEF0F6;
}
.sl-figure img{width:100%;height:100%;object-fit:cover}
.sl-figcaption{font-family:var(--sl-sans);font-weight:400;font-size:13px;line-height:1.55;color:var(--sl-muted);margin-top:14px}

.sl-intro{font-family:var(--sl-serif);font-weight:400;font-size:clamp(18px,1.6vw,20px);line-height:1.7;color:var(--sl-ink);margin-top:26px}

.sl-main h2{
  font-family:var(--sl-sans);font-weight:700;
  font-size:clamp(24px,2.4vw,30px);line-height:1.27;
  color:var(--sl-navy);letter-spacing:-0.01em;margin-top:44px;
}
.sl-main h3{
  font-family:var(--sl-sans);font-weight:600;
  font-size:clamp(18px,1.7vw,20px);line-height:1.35;
  color:var(--sl-navy);margin-top:22px;
}
:where(.sl-main) p{font-family:var(--sl-serif);font-weight:400;font-size:17px;line-height:1.7;color:var(--sl-ink);margin-top:10px}
.sl-h2{font-family:var(--sl-sans);font-weight:700;font-size:clamp(24px,2.4vw,30px);line-height:1.27;color:var(--sl-navy);letter-spacing:-0.01em;margin-top:44px}
.sl-h3{font-family:var(--sl-sans);font-weight:600;font-size:clamp(18px,1.7vw,20px);line-height:1.35;color:var(--sl-navy);margin-top:22px}
.sl-lead-para{margin-top:18px !important}
.sl-hl{font-weight:700;color:var(--sl-ink)}
.sl-lnk{color:var(--sl-pink);text-decoration:underline;text-underline-offset:2px}
.sl-ph{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.5px;color:inherit;margin:0}

/* --------------------- NUMBERED CRITERIA LIST --------------------- */
.sl-numbered{margin-top:10px}
.sl-numbered__item{display:flex;gap:24px;margin-top:16px}
.sl-numbered__badge{
  width:34px;height:34px;flex:none;border-radius:50%;background:var(--sl-pink-bg);
  display:flex;align-items:center;justify-content:center;margin-top:2px;
  font-family:var(--sl-sans);font-weight:700;font-size:15px;line-height:1;color:var(--sl-pink);
}
.sl-numbered__body{flex:1;min-width:0}
.sl-numbered__body h3, .sl-numbered__body .sl-h3{margin-top:3px}
.sl-numbered__body p{margin-top:9px}

/* ------------------------------ CALLOUTS -------------------------- */
.sl-callout{
  border-radius:12px;padding:20px 26px;margin-top:30px;
  background:#EEF3FF;border-left:4px solid var(--sl-navy);
}
.sl-callout.is-info{background:var(--sl-pink-bg);border-left-color:var(--sl-pink)}
.sl-callout .sl-callout__k{font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;letter-spacing:1.4px;text-transform:uppercase;color:var(--sl-navy);margin-top:0}
.sl-callout.is-info .sl-callout__k{color:var(--sl-pink)}
.sl-callout p{font-family:var(--sl-serif);font-weight:400;font-size:16px;line-height:1.6;color:var(--sl-ink);margin-top:12px}

/* -------------------------- PROMO BANNER -------------------------- */
.sl-promo{
  border-radius:var(--sl-radius);margin-top:34px;padding:30px 40px;color:#fff;
  background:linear-gradient(120deg,#1C3A72 0%,#0D2149 100%);
  display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;
}
.sl-promo__k{font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;letter-spacing:1.4px;text-transform:uppercase;color:var(--sl-pink-soft)}
.sl-promo__t{font-family:var(--sl-sans);font-weight:600;font-size:21px;line-height:1.3;color:#fff;margin-top:12px}
.sl-promo__d{font-family:var(--sl-serif);font-weight:400;font-size:15px;line-height:1.6;color:rgba(255,255,255,.8);margin-top:10px;max-width:520px}
.sl-btn-white{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  background:var(--sl-pink);color:#fff;border-radius:10px;
  font-family:var(--sl-sans);font-weight:600;font-size:15px;line-height:22px;
  padding:14px 26px;transition:filter .15s ease;
}
.sl-btn-white:hover{filter:brightness(1.07)}

/* ----------------------------- SHARE ROW -------------------------- */
.sl-share{display:flex;align-items:center;gap:14px;margin-top:28px;padding-top:26px;border-top:1px solid var(--sl-line);flex-wrap:wrap}
.sl-share__lbl{font-family:var(--sl-sans);font-weight:600;font-size:13px;line-height:20px;letter-spacing:.52px;color:var(--sl-muted-2)}
.sl-share__ic{
  width:36px;height:36px;border-radius:50%;border:1px solid var(--sl-line-2);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--sl-sans);font-weight:600;font-size:14px;color:var(--sl-navy);
  transition:background .15s ease,color .15s ease;
}
.sl-share__ic:hover{background:var(--sl-navy);color:#fff}

/* ---------------------------- AUTHOR BIO -------------------------- */
.sl-bio{
  display:flex;gap:20px;align-items:flex-start;margin-top:32px;
  background:var(--sl-box);border:1px solid #ECEEF3;border-radius:var(--sl-radius);padding:26px 30px;
}
.sl-bio .sl-avatar{width:65px;height:65px;font-size:13px}
.sl-bio__k{font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;letter-spacing:1.2px;text-transform:uppercase;color:var(--sl-pink)}
.sl-bio__name{font-family:var(--sl-sans);font-weight:600;font-size:18px;line-height:1.2;color:var(--sl-navy);margin-top:10px}
.sl-bio__role{font-family:var(--sl-sans);font-weight:500;font-size:13px;line-height:1.4;color:var(--sl-muted);margin-top:4px}
.sl-bio__desc{font-family:var(--sl-serif);font-weight:400;font-size:15px;line-height:1.65;color:var(--sl-ink);margin-top:12px}

/* ------------------------------- FAQ ------------------------------ */
.sl-faq{margin-top:48px}
.sl-faq__k{font-family:var(--sl-sans);font-weight:700;font-size:11px;line-height:1;letter-spacing:1.5px;text-transform:uppercase;color:var(--sl-pink)}
.sl-faq h2, .sl-faq .sl-h2{font-family:var(--sl-sans);font-weight:700;font-size:clamp(22px,2.2vw,26px);line-height:1.25;color:var(--sl-navy);margin-top:14px}
.sl-faq details{border-top:1px solid var(--sl-line)}
.sl-faq details:last-of-type{border-bottom:1px solid var(--sl-line)}
.sl-faq summary{
  list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;
  padding:18px 4px;font-family:var(--sl-sans);font-weight:600;font-size:17px;line-height:1.4;color:var(--sl-navy);
}
.sl-faq summary::-webkit-details-marker{display:none}
.sl-faq summary::after{
  content:"+";font-family:var(--sl-sans);font-weight:400;font-size:24px;line-height:1;
  color:var(--sl-pink);flex:none;transition:transform .2s ease;
}
.sl-faq details[open] summary::after{transform:rotate(45deg)}
.sl-faq__answer{font-family:var(--sl-serif);font-size:16px;line-height:1.65;color:var(--sl-ink);padding:0 4px 18px}
.sl-faq__answer p{font-family:var(--sl-serif);font-size:16px;line-height:1.65;color:var(--sl-ink);margin-top:0}

/* ---------------------------- RELATED ----------------------------- */
.sl-related{margin-top:14px}
.sl-related__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sl-related h2, .sl-related .sl-h2{font-family:var(--sl-sans);font-weight:700;font-size:clamp(20px,2vw,22px);line-height:1.27;color:var(--sl-navy)}
.sl-related__all{font-family:var(--sl-sans);font-weight:600;font-size:13px;line-height:20px;color:var(--sl-pink)}
.sl-cards{margin-top:24px}
.sl-cards:not(:has(> .wp-block-group__inner-container)),
.sl-cards > .wp-block-group__inner-container{display:flex;flex-wrap:wrap;gap:12px}
.sl-card{flex:0 1 257px;max-width:100%;border-radius:14px;border:1px solid var(--sl-line);overflow:hidden;background:#fff;transition:box-shadow .18s ease,transform .18s ease}
.sl-card:hover{box-shadow:0 8px 24px rgba(16,24,64,.08);transform:translateY(-2px)}
.sl-card__thumb{
  aspect-ratio:257/128;background:linear-gradient(135deg,#EEF0F6 0%,#F6F7FB 60%);
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-family:'Inter',sans-serif;font-size:10px;letter-spacing:.8px;color:var(--sl-muted-3);
}
.sl-card__thumb img{width:100%;height:100%;object-fit:cover}
.sl-card__body{padding:18px 18px 22px}
.sl-card__cat{font-family:var(--sl-sans);font-weight:700;font-size:10px;line-height:1;letter-spacing:1px;text-transform:uppercase;color:var(--sl-pink)}
.sl-card__ct{font-family:var(--sl-sans);font-weight:600;font-size:15px;line-height:1.4;color:var(--sl-navy);margin-top:12px}
.sl-card__meta{font-family:var(--sl-sans);font-weight:500;font-size:12px;line-height:1.5;color:var(--sl-muted);margin-top:14px}

/* --------------------------- FOOTER CTA --------------------------- */
.sl-footer-cta{margin-block:52px 60px}
.sl-footer-cta__box{
  border-radius:17px;overflow:hidden;
  background:linear-gradient(122deg,#031C49 38%,#0743AF 113%);
  display:flex;padding:36px 40px;gap:36px;color:#fff;flex-wrap:wrap;
}
.sl-footer-cta__left{flex:1 1 360px}
.sl-footer-cta .sl-footer-cta__title{font-family:var(--sl-round);font-weight:700;font-size:clamp(22px,2.6vw,28px);line-height:1.2;color:#fff;max-width:440px}
.sl-footer-cta__list{list-style:none;margin-top:20px;padding:0}
.sl-footer-cta__list li{font-family:var(--sl-round);font-weight:700;font-size:18px;line-height:1.25;color:#fff;margin-top:16px}
.sl-btn-red{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--sl-red);color:#fff;border-radius:5px;
  font-family:var(--sl-round);font-weight:700;font-size:18px;line-height:22px;
  padding:15px 28px;margin-top:22px;letter-spacing:.5px;transition:filter .15s ease;
}
.sl-btn-red:hover{filter:brightness(1.08)}
.sl-footer-cta__qcard{
  width:279px;flex:none;background:var(--sl-box-2);border-radius:19px;padding:34px;
  align-self:flex-start;margin-top:4px;box-shadow:0 4px 30px rgba(0,0,0,.25);
}
.sl-footer-cta__qt{font-family:var(--sl-round);font-weight:700;font-size:26px;line-height:1.25;color:var(--sl-blue-link)}
.sl-footer-cta__row{font-family:var(--sl-round);font-weight:700;font-size:18px;line-height:1.25;color:var(--sl-blue-link);margin-top:24px}
.sl-footer-cta__row + .sl-footer-cta__row{margin-top:14px}

/* ==================== GUTENBERG BLOCK INTEGRATION ================= */
.sl-body__grid .sl-sidebar,.sl-body__grid .sl-main{margin:0}

/* prose links + emphasis inside article body + components */
.sl-main p a,.sl-intro a,.sl-numbered__body p a,.sl-callout p a{
  color:var(--sl-pink);text-decoration:underline;text-underline-offset:2px;
}
.sl-main p strong,.sl-numbered__body p strong{font-weight:700;color:var(--sl-ink)}

/* skin native core/button inside our sections (edit text + link in editor) */
.sl-cta-card .wp-block-button,.sl-cta-card .wp-block-buttons{width:100%;margin-top:16px}
.sl-cta-card .wp-block-button__link{
  display:block;width:100%;text-align:center;background:var(--sl-pink);color:#fff;border:0;
  border-radius:9px;font-family:var(--sl-sans);font-weight:600;font-size:13px;line-height:20px;padding:12px 20px;
}
.sl-promo .wp-block-button__link{
  background:var(--sl-pink);color:#fff;border:0;border-radius:10px;
  font-family:var(--sl-sans);font-weight:600;font-size:15px;line-height:22px;padding:14px 26px;
}
.sl-footer-cta .wp-block-button{margin-top:22px}
.sl-footer-cta .wp-block-button__link{
  background:var(--sl-red);color:#fff;border:0;border-radius:5px;letter-spacing:.5px;
  font-family:var(--sl-round);font-weight:700;font-size:18px;line-height:22px;padding:15px 28px;
}
.sl-cta-card .wp-block-button__link:hover,.sl-promo .wp-block-button__link:hover,
.sl-footer-cta .wp-block-button__link:hover{filter:brightness(1.07)}
/* reassert design casing + link colours over the theme defaults */
.sl-cta-card .wp-block-button__link,.sl-promo .wp-block-button__link{text-transform:none}
.sl-share .sl-share__ic{color:var(--sl-navy)}
.sl-related .sl-related__all a{color:var(--sl-pink)}

/* =========================== RESPONSIVE =========================== */
@media (max-width:900px){
  .sl-body__grid:not(:has(> .wp-block-group__inner-container)),
  .sl-body__grid > .wp-block-group__inner-container{grid-template-columns:1fr;gap:32px}
  .sl-sidebar{position:static;order:-1}
  .sl-side-card{display:flex;flex-direction:column}
  .sl-footer-cta__qcard{width:100%}
}
@media (max-width:760px){
  .sl-cards:not(:has(> .wp-block-group__inner-container)),
  .sl-cards > .wp-block-group__inner-container{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:520px){
  .sl-cards:not(:has(> .wp-block-group__inner-container)),
  .sl-cards > .wp-block-group__inner-container{grid-template-columns:1fr}
  .sl-wrap{padding-inline:18px}
  .sl-promo{padding:24px}
  .sl-footer-cta__box{padding:26px 22px}
  .sl-numbered__item{gap:16px}
  .sl-bio{flex-direction:column}
}

/* ==================== SPACING ENFORCEMENT ====================
   The theme (.entry-content + WordPress flow-layout wrappers) resets block
   margins to 0. These higher-specificity !important rules restore the exact
   vertical rhythm from the design. Values mirror the mockup 1:1. */
/* hero */
.sl-hero .sl-eyebrow{margin-top:18px!important}
.sl-hero .sl-hero__title{margin-top:10px!important}
.sl-hero .sl-hero__lede{margin-top:13px!important}
.sl-hero .sl-byline{margin-top:36px!important}
.sl-hero .sl-avatar{margin:0!important}
.sl-hero .sl-byline__name{margin:0!important}
.sl-hero .sl-byline__role{margin:3px 0 0!important}
.sl-hero .sl-byline__reading{margin:0!important}
/* sidebar */
.sl-article .sl-toc{margin-top:22px!important}
.sl-article .sl-cta-card{margin-top:20px!important}
.sl-article .sl-cta-card__d{margin-top:10px!important}
.sl-article .sl-cta-card__stat{margin-top:10px!important}
.sl-article .sl-cta-card .wp-block-buttons{margin-top:16px!important}
/* main column rhythm */
.sl-article .sl-figcaption{margin-top:14px!important}
.sl-article .sl-intro{margin-top:26px!important}
.sl-article .sl-main h2{margin-top:44px!important}
.sl-article .sl-main h3{margin-top:22px!important}
.sl-article .sl-lead-para{margin-top:18px!important}
.sl-article .sl-main > .wp-block-group__inner-container > p.wp-block-paragraph:not([class*="sl-"]){margin-top:10px!important}
.sl-article .sl-numbered{margin-top:10px!important}
.sl-article .sl-numbered__item{margin-top:16px!important}
.sl-article .sl-numbered__item:first-child{margin-top:0!important}
.sl-article .sl-numbered__body h3{margin-top:3px!important}
.sl-article .sl-numbered__body p{margin-top:9px!important}
.sl-article .sl-callout{margin-top:30px!important}
.sl-article .sl-callout__k{margin-top:0!important}
.sl-article .sl-callout p{margin-top:12px!important}
.sl-article .sl-promo{margin-top:34px!important}
.sl-article .sl-promo__t{margin-top:12px!important}
.sl-article .sl-promo__d{margin-top:10px!important}
.sl-article .sl-share{margin-top:28px!important}
.sl-article .sl-bio{margin-top:32px!important}
.sl-article .sl-bio__name{margin-top:10px!important}
.sl-article .sl-bio__role{margin-top:4px!important}
.sl-article .sl-bio__desc{margin-top:12px!important}
.sl-article .sl-faq{margin-top:48px!important}
.sl-article .sl-faq h2{margin-top:14px!important}
.sl-article .sl-related{margin-top:14px!important}
.sl-article .sl-cards{margin-top:24px!important}
.sl-article .sl-footer-cta{margin-top:52px!important}
/* footer internals */
.sl-article .sl-footer-cta__list{margin-top:20px!important}
.sl-article .sl-footer-cta__list li{margin-top:16px!important}
.sl-article .sl-footer-cta .wp-block-buttons{margin-top:22px!important}
.sl-article .sl-footer-cta__row{margin-top:24px!important}
.sl-article .sl-footer-cta__row + .sl-footer-cta__row{margin-top:14px!important}

/* ==================== KADENCE STRUCTURE ADAPTATION ==================== */
.kt-inside-inner-col:has(> .sl-sidebar){display:grid!important;grid-template-columns:243px minmax(0,1fr);gap:61px;align-items:start}
.kt-inside-inner-col:has(> .sl-card){display:grid!important;grid-template-columns:repeat(3,257px);gap:12px;justify-content:start}
.kt-inside-inner-col:has(> .sl-numbered__badge-col){display:grid!important;grid-template-columns:34px minmax(0,1fr);gap:24px;align-items:start}
.kt-inside-inner-col:has(> .sl-promo__text){display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center}
.kt-inside-inner-col:has(> .sl-bio__avatar){display:grid!important;grid-template-columns:65px minmax(0,1fr);gap:20px;align-items:start}
.kt-inside-inner-col:has(> .sl-footer-cta__left){display:grid!important;grid-template-columns:minmax(0,1fr) 279px;gap:36px;align-items:start}
.kt-inside-inner-col:has(> .sl-related__hl){display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:baseline}
.kt-inside-inner-col:has(> .sl-toc__numc){display:grid!important;grid-template-columns:16px minmax(0,1fr);gap:10px;align-items:start;position:relative;padding:9px 0}
.sl-sidebar,.sl-main,.sl-card,.sl-numbered__badge-col,.sl-numbered__body,.sl-promo__text,.sl-promo__cta,.sl-bio__avatar,.sl-bio__text,.sl-footer-cta__left,.sl-footer-cta__qcard,.sl-related__hl,.sl-related__hr,.sl-toc__numc,.sl-toc__txtc{width:auto!important;max-width:none!important;flex:0 1 auto!important;margin:0!important;min-width:0}
.sl-share > .kt-inside-inner-col{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sl-callout > .kt-inside-inner-col,.sl-promo > .kt-inside-inner-col,.sl-side-card > .kt-inside-inner-col,.sl-cta-card > .kt-inside-inner-col,.sl-bio > .kt-inside-inner-col,.sl-footer-cta__box > .kt-inside-inner-col,.sl-figure > .kt-inside-inner-col,.sl-card__thumb > .kt-inside-inner-col,.sl-faq > .kt-inside-inner-col{padding:0}
.sl-promo,.sl-bio,.sl-footer-cta__box,.sl-share{display:block}
.sl-toc__numc.is-active .sl-toc__num{color:var(--sl-pink)}
.sl-toc__txtc.is-active .sl-toc__txt{font-weight:700;color:var(--sl-navy)}
.kt-inside-inner-col:has(> .sl-toc__numc.is-active)::before{content:"";position:absolute;left:-14px;top:7px;bottom:7px;width:3px;border-radius:2px;background:var(--sl-pink)}
.sl-figure,.sl-card__thumb{display:flex;align-items:center;justify-content:center}

.sl-toc__txtc.is-active .sl-toc__txt{font-weight:700;color:var(--sl-navy)}
.kt-inside-inner-col:has(> .sl-toc__numc.is-active)::before{content:"";position:absolute;left:-14px;top:7px;bottom:7px;width:3px;border-radius:2px;background:var(--sl-pink)}
/* figure/thumb: give the placeholder box its aspect + centring on the column */
.sl-figure,.sl-card__thumb{display:flex;align-items:center;justify-content:center}

/* ===== KADENCE BUTTON RENDER MAPPING (advancedbtn>singlebtn) ===== */
.wp-block-kadence-advancedbtn.kb-buttons-wrap{display:block;margin:0}
.wp-block-kadence-singlebtn{display:block}
.wp-block-kadence-singlebtn > a{text-decoration:none;box-shadow:none;border:0;cursor:pointer}
.wp-block-kadence-singlebtn > a .kt-btn-inner-text{white-space:nowrap}
/* pink full-width (sidebar CTA) */
.sl-cta-btn{display:block;margin-top:16px}
.sl-cta-btn > a{
  display:flex;align-items:center;justify-content:center;
  background:var(--sl-pink);color:#fff;border-radius:9px;
  font-family:var(--sl-sans);font-weight:600;font-size:13px;line-height:20px;
  padding:12px 20px;transition:filter .15s ease;
}
.sl-cta-btn > a:hover{filter:brightness(1.07)}
/* white/pink inline (promo banner CTA) */
.sl-promo-btn{display:block}
.sl-promo-btn > a{
  display:inline-flex;align-items:center;justify-content:center;flex:none;
  background:var(--sl-pink);color:#fff;border-radius:10px;
  font-family:var(--sl-sans);font-weight:600;font-size:15px;line-height:22px;
  padding:14px 26px;transition:filter .15s ease;white-space:nowrap;
}
.sl-promo-btn > a:hover{filter:brightness(1.07)}
/* red (footer CTA) */
.sl-footer-btn{display:block}
.sl-footer-btn > a{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--sl-red);color:#fff;border-radius:5px;
  font-family:var(--sl-round);font-weight:700;font-size:18px;line-height:22px;
  padding:15px 28px;margin-top:22px;letter-spacing:.5px;transition:filter .15s ease;
}
.sl-footer-btn > a:hover{filter:brightness(1.08)}

.sl-footer-btn > a:hover{filter:brightness(1.08)}

/* ===== RELATED CARDS: header spans top row, 3 cards grid below ===== */
.kt-inside-inner-col:has(> .sl-card){grid-template-columns:repeat(3,257px)!important;gap:28px 12px!important;justify-content:start!important;align-items:start!important}
.sl-related > .kt-inside-inner-col > .sl-related__hl{grid-column:1 / -1;grid-row:1;align-self:center}
.sl-related > .kt-inside-inner-col > .sl-related__hr{grid-column:1 / -1;grid-row:1;justify-self:end;align-self:center;margin:0}

/* ===== BUTTON EXACT METRICS (beat Kadence .kb-button defaults) ===== */
.sl-cta-btn > a.kb-button{border-radius:9px!important;padding:12px 20px!important;font-size:13px!important;line-height:20px!important;min-height:0!important}
.sl-promo-btn > a.kb-button{border-radius:10px!important;padding:14px 26px!important;font-size:15px!important;line-height:22px!important;min-height:0!important}
.sl-footer-btn > a.kb-button{border-radius:5px!important;padding:15px 28px!important;font-size:18px!important;line-height:22px!important;min-height:0!important}

/* ===== SHARE ROW: force horizontal (Kadence inner-col defaults to column) ===== */
.sl-share > .kt-inside-inner-col{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;gap:14px!important;justify-content:flex-start!important}
.sl-share__lbl,.sl-share__ic{margin:0!important}

/* ===== TOC anchor landing offset ===== */
.sl-article h2[id]{scroll-margin-top:28px}

/* ===== FAQ ACCORDION → minimal mockup style (native Kadence blocks) ===== */
.sl-faq .wp-block-kadence-accordion,
.sl-faq .kt-accordion-wrap,
.sl-faq .kt-accordion-inner-wrap{background:transparent!important;border:0!important;box-shadow:none!important;margin:0!important;padding:0!important}
.sl-faq .kt-accordion-pane{background:transparent!important;border:0!important;border-top:1px solid var(--sl-line)!important;border-radius:0!important;box-shadow:none!important;margin:0!important}
.sl-faq .kt-accordion-pane:last-child{border-bottom:1px solid var(--sl-line)!important}
/* header row */
.sl-faq .kt-blocks-accordion-header{
  background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;
  padding:18px 4px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:20px!important;
}
.sl-faq .kt-blocks-accordion-title{
  color:var(--sl-navy)!important;font-family:var(--sl-sans)!important;font-weight:600!important;font-size:17px!important;line-height:24px!important;text-align:left!important;
}
/* icon → thin pink +/- */
.sl-faq .kt-blocks-accordion-icon-trigger{width:24px!important;height:24px!important;flex:none!important}
.sl-faq .kt-blocks-accordion-icon-trigger::before,
.sl-faq .kt-blocks-accordion-icon-trigger::after{background:var(--sl-pink)!important;width:18px!important;height:3px!important;border-radius:1px!important}
/* answer panel minimal (no box) */
.sl-faq .kt-accordion-panel{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
.sl-faq .kt-accordion-panel-inner{
  background:transparent!important;border:0!important;box-shadow:none!important;padding:2px 4px 22px!important;
}
.sl-faq .kt-accordion-panel-inner,
.sl-faq .kt-accordion-panel-inner p{
  font-family:var(--sl-serif)!important;font-size:15px!important;line-height:1.7!important;color:var(--sl-muted)!important;margin:0!important;
}

/* ===== BIO spacing fix: kill theme p margin-bottom so top-margins apply ===== */
.sl-bio__k,.sl-bio__name,.sl-bio__role,.sl-bio__desc{margin-bottom:0!important}

/* ===== CALLOUT + PROMO spacing fix (kill theme p margin-bottom) ===== */
.sl-callout__k,.sl-callout p,.sl-promo__k,.sl-promo__t,.sl-promo__d{margin-bottom:0!important}

/* ===== Sidebar CTA card spacing fix (kill theme p margin-bottom) ===== */
.sl-cta-card__t,.sl-cta-card__d,.sl-cta-card__stat{margin-bottom:0!important}

/* ===== Related cards: body padding (no wrapper in render) + spacing fix ===== */
.sl-card__cat,.sl-card__ct,.sl-card__meta{padding-left:18px!important;padding-right:18px!important;margin-bottom:0!important}
.sl-card__cat{margin-top:18px!important}
.sl-card__meta{margin-bottom:22px!important}

/* ===== Related cards: enforce internal top-margins (beat Kadence advancedheading) ===== */
.sl-card__ct{margin-top:12px!important}
.sl-card__meta{margin-top:14px!important}

/* ===== SPACING SAFEGUARD: theme adds margin-bottom to paragraphs; design components space via margin-top. Neutralise it inside the component containers (body prose is untouched). ===== */
.sl-side-card :where(p,li,.wp-block-kadence-advancedheading),
.sl-callout :where(p,.wp-block-kadence-advancedheading),
.sl-promo :where(p,.wp-block-kadence-advancedheading),
.sl-bio :where(p,.wp-block-kadence-advancedheading),
.sl-card :where(p,.wp-block-kadence-advancedheading),
.sl-footer-cta :where(p,li,.wp-block-kadence-advancedheading,.sl-footer-cta__list){margin-bottom:0!important}

/* ===== Footer CTA list: Kadence renders it as a grid (no margin-collapse); use grid gap for item spacing ===== */
.sl-footer-cta__list ul{gap:16px!important;margin:0!important}
.sl-footer-cta__list li{margin-top:0!important}

/* ===== Footer CTA list: override the earlier .sl-article li top-margin (grid gap handles spacing) ===== */
.sl-article .sl-footer-cta__list li{margin-top:0!important}

/* ==============================================================
   RESPONSIVE (Kadence-native structure)
   The layout grids live on `.kt-inside-inner-col:has(> .sl-*)` with
   fixed px tracks + !important, so responsiveness must override them
   at the same hook. Ordered so the mobile block wins on small screens.
   ================================================================= */

/* Cards keep their exact 257px width but flow to the space available
   (3 → 2 columns) instead of overflowing on laptops/tablets. */
@media (max-width:1140px){
  .kt-inside-inner-col:has(> .sl-card){grid-template-columns:repeat(auto-fill,257px)!important;justify-content:start!important}
}

/* Tablet: sidebar (Sommaire + CTA) stacks full-width above the article. */
@media (max-width:900px){
  .kt-inside-inner-col:has(> .sl-sidebar){grid-template-columns:1fr!important;gap:32px!important}
  .sl-sidebar{position:static!important;top:auto!important}
  .sl-body{padding-block:24px 0}
}

/* Phone: single-column everything, tighter padding. */
@media (max-width:600px){
  .sl-wrap{padding-inline:18px}
  /* related cards full width */
  .kt-inside-inner-col:has(> .sl-card){grid-template-columns:1fr!important;gap:18px!important}
  /* promo banner: stack CTA under the text */
  .kt-inside-inner-col:has(> .sl-promo__text){grid-template-columns:1fr!important;gap:18px!important;align-items:start!important}
  .sl-promo{padding:24px!important}
  /* footer CTA: stack the "Une question ?" card under the content */
  .kt-inside-inner-col:has(> .sl-footer-cta__left){grid-template-columns:1fr!important;gap:26px!important}
  .sl-footer-cta__qcard{width:auto!important}
  .sl-footer-cta__box{padding:26px 22px!important}
  /* numbered criteria tighter */
  .kt-inside-inner-col:has(> .sl-numbered__badge-col){gap:16px!important}
  /* share row can wrap if needed */
  .sl-share > .kt-inside-inner-col{flex-wrap:wrap!important}
  /* related header: stack title over the "Voir le blog" link */
  .sl-related > .kt-inside-inner-col > .sl-related__hr{grid-row:2!important;justify-self:start!important;margin-top:2px!important}
}