:root{
  --cl-blue:#0969F9;
  --cl-blue-dark:#0757D1;
  --cl-navy:#071A36;
  --cl-text:#0F172A;
  --cl-muted:#64748B;
  --cl-border:#E5E7EB;
  --cl-soft:#F8FAFC;
  --cl-soft-blue:#EFF6FF;
  --cl-card:#FFFFFF;
}
body.calconly-layout-active .site-content,
body.calconly-layout-active .content-area,
body.calconly-layout-active .site-main{max-width:none!important;width:100%!important;margin:0!important;padding:0!important}
body.calconly-layout-active .inside-article{padding:0!important}
.cl-site{background:#fff;color:var(--cl-text)}
.cl-wrap{width:min(1380px,calc(100% - 36px));margin:0 auto;padding:20px 0 64px}
.cl-breadcrumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--cl-muted);margin:2px 0 24px}
.cl-breadcrumb a{color:#475569;text-decoration:none}
.cl-breadcrumb a:hover{color:var(--cl-blue)}
.cl-breadcrumb .current{color:#0F172A;font-weight:650}
.cl-page-header{background:linear-gradient(180deg,#F8FBFF 0%,#FFFFFF 100%);border:1px solid #EAF0F7;border-radius:22px;padding:38px 40px;margin-bottom:28px}
.cl-calculator-header{padding-bottom:32px}
.cl-title-block{max-width:850px}
.cl-kicker{display:block;color:var(--cl-blue);font-size:11px;font-weight:800;letter-spacing:.14em;margin-bottom:8px}
.cl-page-header h1{margin:0;color:var(--cl-navy);font-size:clamp(34px,4.5vw,52px);line-height:1.06;letter-spacing:-.035em}
.cl-lead{font-size:18px;line-height:1.7;color:#475569;margin:14px 0 0;max-width:780px}
.cl-lead p{margin:0}
.cl-stat{display:inline-flex;margin-top:18px;padding:8px 12px;background:var(--cl-soft-blue);color:var(--cl-blue-dark);border-radius:999px;font-size:13px;font-weight:750}
.cl-content-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:34px;align-items:start}
.cl-main{min-width:0}
.cl-sidebar{position:sticky;top:88px;align-self:start;max-height:calc(100vh - 110px);overflow:auto;scrollbar-width:thin}
.cl-sidebar-box{position:relative;background:#fff;border:1px solid var(--cl-border);border-radius:16px;padding:18px;box-shadow:0 8px 28px rgba(15,23,42,.05)}
.cl-sidebar-box h2{font-size:18px;margin:0 0 14px;color:var(--cl-navy)}
.cl-category-list,.cl-subcategory-list{list-style:none;margin:0;padding:0}
.cl-category-list>li{border-top:1px solid #EEF2F6}
.cl-category-list>li:first-child{border-top:0}
.cl-category-list a,.cl-subcategory-list a{display:flex;justify-content:space-between;gap:12px;padding:11px 9px;border-radius:8px;color:#334155;text-decoration:none;font-size:14px}
.cl-category-list a:hover,.cl-category-list li.active>a,.cl-subcategory-list li.active>a{background:var(--cl-soft-blue);color:var(--cl-blue)}
.cl-category-list strong,.cl-subcategory-list strong{font-size:12px;min-width:30px;text-align:center;background:#F1F5F9;border-radius:999px;padding:2px 7px;color:#64748B}
.cl-subcategory-list{padding:0 0 8px 14px}
.cl-subcategory-list a{font-size:13px;padding:7px 9px}
.cl-section-heading{display:flex;justify-content:space-between;align-items:end;margin:0 0 16px}
.cl-section-heading h2{font-size:28px;color:var(--cl-navy);letter-spacing:-.02em;margin:0}
.cl-subcategory-block{margin-bottom:34px}
.cl-subcategory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cl-subcategory-card{display:flex;gap:14px;align-items:center;padding:16px;border:1px solid var(--cl-border);border-radius:14px;text-decoration:none;background:#fff;transition:.18s ease}
.cl-subcategory-card:hover{transform:translateY(-2px);border-color:#C9DCF9;box-shadow:0 10px 28px rgba(15,23,42,.06)}
.cl-subcategory-icon,.cl-calc-card-icon,.cl-related-icon{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:11px;background:var(--cl-soft-blue);color:var(--cl-blue);font-weight:900}
.cl-subcategory-card h3{font-size:16px;margin:0 0 3px;color:var(--cl-navy)}
.cl-subcategory-card p{margin:0;color:var(--cl-muted);font-size:13px}
.cl-calc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.cl-calc-card{margin:0}
.cl-calc-card>a{height:100%;display:flex;gap:14px;padding:18px;border:1px solid var(--cl-border);border-radius:15px;text-decoration:none;background:#fff;transition:.18s ease}
.cl-calc-card>a:hover{border-color:#BED6FF;box-shadow:0 12px 30px rgba(15,23,42,.06);transform:translateY(-2px)}
.cl-calc-card h2{font-size:17px;line-height:1.35;margin:0 0 6px;color:var(--cl-navy)}
.cl-calc-card p{font-size:13px;line-height:1.55;color:var(--cl-muted);margin:0 0 9px}
.cl-calc-card span{font-size:13px;font-weight:750;color:var(--cl-blue)}
.cl-calculator-content{min-width:0}
.cl-calculator-content>.ccf-calculator{margin-top:0}
.cl-calculator-content h2{color:var(--cl-navy);font-size:28px;letter-spacing:-.02em;margin-top:36px}
.cl-calculator-content h3{color:var(--cl-navy);font-size:20px;margin-top:25px}
.cl-calculator-content p,.cl-calculator-content li{color:#475569;line-height:1.75}
.cl-related{margin-top:52px;padding-top:34px;border-top:1px solid var(--cl-border)}
.cl-related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cl-related-card{display:flex;gap:13px;padding:18px;border:1px solid var(--cl-border);border-radius:15px;text-decoration:none;background:#fff}
.cl-related-card:hover{border-color:#BED6FF;box-shadow:0 10px 28px rgba(15,23,42,.055)}
.cl-related-card h3{font-size:16px;color:var(--cl-navy);margin:0 0 5px;line-height:1.35}
.cl-related-card p{font-size:13px;line-height:1.55;color:var(--cl-muted);margin:0 0 8px}
.cl-related-link{font-size:13px;font-weight:750;color:var(--cl-blue)}
.cl-pagination{margin-top:28px}
.cl-pagination .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.cl-pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;border:1px solid var(--cl-border);border-radius:9px;text-decoration:none;color:#334155;padding:0 10px}
.cl-pagination .current{background:var(--cl-blue);border-color:var(--cl-blue);color:#fff}
.cl-muted{color:var(--cl-muted);font-size:14px}

/* v1.1: category pages are intentionally full-width with no sidebar */
.cl-category-page .cl-category-main{width:100%;max-width:100%}
.cl-category-page .cl-subcategory-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}
.cl-category-page .cl-calc-grid-wide{grid-template-columns:repeat(3,minmax(0,1fr))}

/* v1.1: only the calculator sidebar stays visible while the user scrolls */
body.single-calculator .cl-sidebar{position:sticky;top:88px;align-self:start;max-height:calc(100vh - 108px);overflow:auto}
body.single-calculator .cl-sidebar-box{position:relative;top:auto}

@media(max-width:980px){
  .cl-content-layout{grid-template-columns:1fr}
  .cl-sidebar,body.single-calculator .cl-sidebar{position:static;max-height:none;overflow:visible}
  .cl-sidebar-box{position:static}
  .cl-category-page .cl-subcategory-grid-wide,.cl-category-page .cl-calc-grid-wide{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cl-related-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .cl-category-page .cl-subcategory-grid-wide,.cl-category-page .cl-calc-grid-wide{grid-template-columns:1fr}
  .cl-wrap{width:min(100% - 24px,1200px);padding-top:12px}
  .cl-page-header{padding:27px 22px;border-radius:17px}
  .cl-page-header h1{font-size:36px}
  .cl-lead{font-size:16px}
  .cl-calc-grid,.cl-subcategory-grid,.cl-related-grid{grid-template-columns:1fr}
  .cl-sidebar-box{padding:15px}
  .cl-section-heading h2{font-size:25px}
}

/* v1.2: protect calculator width on laptops */
@media(max-width:1220px){
  body.single-calculator .cl-content-layout{grid-template-columns:1fr}
  body.single-calculator .cl-sidebar{position:static;max-height:none;overflow:visible}
  body.single-calculator .cl-sidebar-box{position:static}
  body.single-calculator .cl-category-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}
}
@media(max-width:680px){
  body.single-calculator .cl-category-list{grid-template-columns:1fr}
}


/* v1.3: Single calculator pages are tool-first.
   The Finance Engine owns the single H1/tool header, so the old duplicate page hero is removed. */
.cl-single-calculator-page .cl-wrap{
  padding-top:16px;
}
.cl-single-calculator-page .cl-breadcrumb{
  margin-bottom:18px;
}
.cl-single-calculator-page .cl-calculator-layout{
  margin-top:0;
}


/* v1.4 — protect the actual calculator width while retaining a useful sticky category sidebar */
body.single-calculator .cl-content-layout{
  grid-template-columns:minmax(0,1fr) 250px;
  gap:24px;
}
body.single-calculator .cl-main{
  min-width:0;
  container-type:inline-size;
}
body.single-calculator .cl-sidebar-box{
  padding:16px;
}
body.single-calculator .cl-sidebar-box h2{
  font-size:17px;
}
body.single-calculator .cl-category-list a,
body.single-calculator .cl-subcategory-list a{
  padding-top:8px;
  padding-bottom:8px;
}

/* Sidebar stays beside the tool only where the total page genuinely has room.
   Below this, it moves below the calculator instead of making the calculator cramped. */
@media(max-width:1360px){
  body.single-calculator .cl-content-layout{
    grid-template-columns:1fr;
  }
  body.single-calculator .cl-sidebar{
    position:static;
    max-height:none;
    overflow:visible;
  }
  body.single-calculator .cl-sidebar-box{
    position:static;
  }
  body.single-calculator .cl-category-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    column-gap:16px;
  }
}
@media(max-width:680px){
  body.single-calculator .cl-category-list{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   v1.5 STABLE SINGLE-CALCULATOR PAGE ARCHITECTURE
   ========================================================= */

/* Use the available page width efficiently. */
body.single-calculator .cl-wrap{
  width:min(1460px,calc(100% - 40px))!important;
}

/* Desktop: calculator plus fixed/sticky category rail. */
body.single-calculator .cl-content-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 245px!important;
  gap:24px!important;
  align-items:start!important;
}
body.single-calculator .cl-main{
  min-width:0!important;
}
body.single-calculator .cl-sidebar{
  display:block!important;
  position:sticky!important;
  top:84px!important;
  align-self:start!important;
  max-height:calc(100vh - 100px)!important;
  overflow:auto!important;
}
body.single-calculator .cl-sidebar-box{
  position:relative!important;
  top:auto!important;
}

/* Category rail should be compact, not a giant block. */
body.single-calculator .cl-sidebar-box{
  padding:15px!important;
  border-radius:14px!important;
}
body.single-calculator .cl-sidebar-box h2{
  margin-bottom:10px!important;
  font-size:16px!important;
}
body.single-calculator .cl-category-list,
body.single-calculator .cl-subcategory-list{
  display:block!important;
}
body.single-calculator .cl-category-list a,
body.single-calculator .cl-subcategory-list a{
  padding:7px 7px!important;
  font-size:12px!important;
}
body.single-calculator .cl-subcategory-list{
  padding-left:10px!important;
}

/* Do not send the sidebar to the bottom on ordinary desktop/laptop widths.
   Only collapse it once the browser is genuinely tablet-sized. */
@media (max-width: 1120px){
  body.single-calculator .cl-content-layout{
    grid-template-columns:1fr!important;
  }
  body.single-calculator .cl-sidebar{
    position:static!important;
    max-height:none!important;
    overflow:visible!important;
  }
  body.single-calculator .cl-sidebar-box{
    width:100%!important;
  }
  body.single-calculator .cl-category-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    column-gap:14px!important;
  }
}

/* On mobile the category block is intentionally one column. */
@media (max-width: 680px){
  body.single-calculator .cl-wrap{
    width:min(100% - 20px,1460px)!important;
  }
  body.single-calculator .cl-category-list{
    grid-template-columns:1fr!important;
  }
}

/* Keep editorial content readable; it should not span the full 1460px width. */
body.single-calculator .ccf-editorial{
  max-width:900px!important;
}