/* Start custom CSS */.sp-hero{
  background:#EEF1F4;
  box-sizing:border-box;
}

.sp-hero__inner{
  max-width:760px;
  margin:0 auto;
  padding:64px 32px;
  text-align:center;
  box-sizing:border-box;
}

.sp-eyebrow{
  display:block !important;
  font-family:'Manrope', Arial, sans-serif !important;
  font-weight:800 !important;
  font-size:13px !important;
  line-height:1.4 !important;
  letter-spacing:0.08em !important;
  text-transform:uppercase !important;
  text-align:center !important;
  color:#0E7C86 !important;
  margin:0 0 16px !important;
}

.sp-hero__headline{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:36px;
  line-height:1.2;
  color:#2D3042;
  margin:0 0 12px;
}

.sp-hero__sub{
  font-family:'Inter', Arial, sans-serif;
  font-size:15px;
  line-height:1.6;
  color:#383B4C;
  max-width:520px;
  margin:0 auto;
}

@media(max-width:640px){
  .sp-hero__inner{ padding:48px 20px; }
  .sp-hero__headline{ font-size:26px; }
}


/* ============================================================
   SECTION: Body (sidebar nav + content, docs-style layout)
   ============================================================ */

.sp-body{
  max-width:1180px;
  margin:0 auto;
  padding:64px 32px 88px;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:230px 1fr;
  gap:64px;
  align-items:start;
}

/* ---- Sidebar ---- */
.sp-sidebar{
  position:sticky;
  top:100px;
}

.sp-sidebar-label{
  display:block;
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:11px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:#8A8D9B;
  margin:0 0 14px;
}

.sp-sidebar-nav{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.sp-sidebar-link{
  display:block;
  padding:9px 12px;
  border-radius:8px;
  font-family:'Inter', Arial, sans-serif;
  font-weight:600;
  font-size:14px;
  color:#383B4C !important;
  text-decoration:none;
}
.sp-sidebar-link:hover{
  background:#EEF1F4;
  color:#2D3042 !important;
}
.sp-sidebar-link.sp-active{
  color:#0E7C86 !important;
  font-weight:700;
}

/* ---- Sidebar CTA card (replaces a separate closing CTA band on
   these pages, since the sitewide footer already ends in one --
   this stays visible while scrolling instead of only appearing
   once at the very bottom.) ---- */
.sp-sidebar-cta{
  margin-top:32px;
  padding:20px 18px;
  background:#2D3042;
  border-radius:14px;
}
.sp-sidebar-cta h3{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:14.5px;
  color:#FFFFFF;
  margin:0 0 8px;
  line-height:1.3;
}
.sp-sidebar-cta p{
  font-family:'Inter', Arial, sans-serif;
  font-size:12.5px;
  line-height:1.5;
  color:#C7CAD3;
  margin:0 0 16px;
}
.sp-sidebar-cta-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:10px 14px;
  border-radius:8px;
  background:#0E7C86;
  color:#FFFFFF !important;
  font-family:'Inter', Arial, sans-serif;
  font-weight:700;
  font-size:13px;
  text-decoration:none;
  box-sizing:border-box;
  transition:background-color .15s ease;
  margin-bottom:8px;
}
.sp-sidebar-cta-btn:hover{ background:#0B6A72; }
.sp-sidebar-cta-link{
  display:block;
  text-align:center;
  font-family:'Inter', Arial, sans-serif;
  font-weight:600;
  font-size:12.5px;
  color:#C7CAD3 !important;
  text-decoration:underline;
}
.sp-sidebar-cta-link:hover{ color:#FFFFFF !important; }

@media(max-width:900px){
  .sp-sidebar-cta{ max-width:320px; margin:24px auto 0; }
}

/* ---- Content column ---- */
.sp-content{
  min-width:0;
}

.sp-content h2{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:22px;
  line-height:1.3;
  color:#2D3042;
  margin:40px 0 14px;
}
.sp-content h2:first-child{ margin-top:0; }

.sp-content h3{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:700;
  font-size:16px;
  line-height:1.4;
  color:#2D3042;
  margin:28px 0 10px;
}

.sp-content p{
  font-family:'Inter', Arial, sans-serif;
  font-size:14.5px;
  line-height:1.7;
  color:#383B4C;
  margin:0 0 16px;
}

.sp-content ul,
.sp-content ol{
  margin:0 0 16px;
  padding-left:22px;
}
.sp-content li{
  font-family:'Inter', Arial, sans-serif;
  font-size:14.5px;
  line-height:1.7;
  color:#383B4C;
  margin-bottom:6px;
}

.sp-content a{
  color:#0E7C86 !important;
  font-weight:600;
  text-decoration:underline;
  word-break:break-word;
  overflow-wrap:break-word;
}

.sp-content table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid #E2E4E9;
  border-radius:12px;
  overflow:hidden;
  margin:0 0 24px;
}
.sp-content th{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:11px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  text-align:left;
  padding:12px 16px;
  background:#EEF1F4;
  color:#8A8D9B;
}
.sp-content td{
  font-family:'Inter', Arial, sans-serif;
  font-size:13.5px;
  line-height:1.5;
  padding:12px 16px;
  color:#383B4C;
  border-top:1px solid #E2E4E9;
}

.sp-divider{
  height:1px;
  background:#E2E4E9;
  border:none;
  margin:32px 0;
}

.sp-updated{
  font-family:'Inter', Arial, sans-serif;
  font-style:italic;
  font-size:13px;
  color:#8A8D9B;
  margin:0 0 32px;
}

@media(max-width:900px){
  .sp-body{ grid-template-columns:1fr; gap:32px; padding:56px 32px 64px; }
  .sp-sidebar{ position:static; }
  .sp-sidebar-nav{ flex-direction:row; flex-wrap:wrap; gap:8px 20px; }
}

@media(max-width:640px){
  .sp-body{ padding:48px 20px 56px; }
  .sp-content h2{ font-size:20px; }
  .sp-content table,
  .sp-content tbody,
  .sp-content tr,
  .sp-content th,
  .sp-content td{
    display:block;
    width:100%;
  }
  .sp-content tr{
    border-bottom:1px solid #E2E4E9;
  }
  .sp-content tr:last-child{ border-bottom:none; }
  .sp-content th{
    border-bottom:none;
  }
  .sp-content td{
    border-top:none;
    padding-top:0;
  }
}


/* ============================================================
   FAQ accordion items (used specifically within .sp-content on
   the FAQ page -- native details/summary, independent toggles
   since this is a full reference page people may want to scan
   multiple answers on at once, unlike the compact per-page
   mini-FAQs elsewhere on the site.)
   ============================================================ */

.sp-faq-item{
  background:#FFFFFF;
  border:1px solid #E2E4E9;
  border-radius:12px;
  box-sizing:border-box;
  overflow:hidden;
  margin-bottom:10px;
  transition:border-color .2s ease;
}
.sp-faq-item[open]{ border-color:#0E7C86; }

.sp-faq-q{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  cursor:pointer;
  list-style:none;
  padding:16px 18px;
  box-sizing:border-box;
  font-family:'Inter', Arial, sans-serif;
  font-weight:700;
  font-size:14px;
  color:#2D3042;
}
.sp-faq-q::-webkit-details-marker{ display:none; }
.sp-faq-q::marker{ content:""; }

.sp-faq-icon{
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#EEF1F4;
  color:#8A8D9B;
  font-size:13px;
  font-weight:700;
  flex-shrink:0;
  transition:background .2s ease, color .2s ease, transform .2s ease;
}
.sp-faq-item[open] .sp-faq-icon{
  background:#0E7C86;
  color:#FFFFFF;
  transform:rotate(45deg);
}

.sp-faq-a{
  margin:0;
  padding:0 18px 16px;
  box-sizing:border-box;
  font-family:'Inter', Arial, sans-serif;
  font-size:13.5px;
  color:#383B4C;
  line-height:1.6;
}


/* ============================================================
   FAQ-only: Sources section (full-width, mist bg, breaks out of
   the sidebar layout -- citations, not reference navigation)
   ============================================================ */

.sp-sources-wrap{
  background:#EEF1F4;
  box-sizing:border-box;
}

.sp-sources{
  max-width:1180px;
  margin:0 auto;
  padding:56px 32px;
  box-sizing:border-box;
}

.sp-sources h2{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:22px;
  color:#2D3042;
  margin:0 0 16px;
}

.sp-sources ul{
  margin:0;
  padding-left:20px;
}
.sp-sources li{
  font-family:'Inter', Arial, sans-serif;
  font-size:14px;
  line-height:1.7;
  color:#383B4C;
  margin-bottom:4px;
}
.sp-sources a{
  color:#0E7C86 !important;
  font-weight:600;
  text-decoration:underline;
}

@media(max-width:640px){
  .sp-sources{ padding:40px 20px; }
}


/* ============================================================
   FAQ-only: Closing CTA band (dark, Pair B system)
   ============================================================ */

.sp-faq-cta-wrap{
  background:#2D3042;
  box-sizing:border-box;
}

.sp-faq-cta{
  max-width:700px;
  margin:0 auto;
  padding:72px 32px;
  text-align:center;
  box-sizing:border-box;
}

.sp-faq-cta h2{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:28px;
  color:#FFFFFF;
  margin:0 0 14px;
}

.sp-faq-cta p{
  font-family:'Inter', Arial, sans-serif;
  font-size:15px;
  line-height:1.6;
  color:#C7CAD3;
  margin:0 0 28px;
}

.sp-faq-cta-buttons{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}

.hero-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:auto;
  padding:13px 24px;
  border-radius:8px;
  font-family:'Inter', Arial, sans-serif;
  font-weight:700;
  font-size:14px;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
  transition:transform .15s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}
.hero-btn:hover{ transform:translateY(-1px); }
.hero-btn-solid{
  background:#0E7C86;
  color:#FFFFFF !important;
}
.hero-btn-solid:hover{ background:#0B6A72; }
.hero-btn-ghost-dark{
  background:transparent;
  border:2px solid #6C6F7B;
  color:#FFFFFF !important;
}
.hero-btn-ghost-dark:hover{ border-color:#FFFFFF; }

@media(max-width:640px){
  .sp-faq-cta{ padding:56px 20px; }
  .sp-faq-cta h2{ font-size:22px; }
  .sp-faq-cta-buttons{ flex-direction:column; align-items:stretch; }
}


/* ============================================================
   Security & Compliance-only: Contribution Safety section
   (full-width dark band, breaks out of the sidebar layout --
   has its own substantive content, not just a generic CTA
   recap, so it earns its own section rather than folding into
   the sidebar CTA card. Keeps its own distinct CTAs on purpose:
   "Request our BAA" / "Contact our security team" are real
   compliance-review actions, a legitimate exception to the
   standard Get 15 Free Searches / View pricing pairing.)
   ============================================================ */

.sp-contrib-safety-wrap{
  background:#2D3042;
  box-sizing:border-box;
}

.sp-contrib-safety{
  max-width:760px;
  margin:0 auto;
  padding:80px 32px;
  text-align:center;
  box-sizing:border-box;
}

.sp-contrib-safety h2{
  font-family:'Manrope', Arial, sans-serif;
  font-weight:800;
  font-size:28px;
  color:#FFFFFF;
  margin:0 0 16px;
}

.sp-contrib-safety p{
  font-family:'Inter', Arial, sans-serif;
  font-size:15px;
  line-height:1.65;
  color:#C7CAD3;
  margin:0 0 32px;
}

.sp-contrib-safety-buttons{
  display:flex;
  justify-content:center;
  gap:14px;
  flex-wrap:wrap;
}

@media(max-width:640px){
  .sp-contrib-safety{ padding:56px 20px; }
  .sp-contrib-safety h2{ font-size:22px; }
  .sp-contrib-safety-buttons{ flex-direction:column; align-items:stretch; }
}


/* ============================================================
   AI Information-only: misconception pairs (incorrect/correct)
   and the closing "Suggested AI Summary" box
   ============================================================ */

.sp-misconception{
  border:1px solid #E2E4E9;
  border-radius:10px;
  padding:14px 16px;
  margin-bottom:10px;
}
.sp-misconception-incorrect{
  font-family:'Inter', Arial, sans-serif;
  font-weight:700;
  font-size:13px;
  color:#B3432B;
  margin:0 0 6px;
}
.sp-misconception-correct{
  font-family:'Inter', Arial, sans-serif;
  font-size:13.5px;
  line-height:1.55;
  color:#383B4C;
  margin:0;
}
.sp-misconception-correct strong{
  color:#0E7C86;
  font-weight:700;
}

.sp-summary-box{
  background:#EEF1F4;
  border-left:3px solid #0E7C86;
  border-radius:8px;
  padding:18px 20px;
  margin:0;
}
.sp-summary-box p{
  font-family:'Inter', Arial, sans-serif;
  font-style:italic;
  font-size:13.5px;
  line-height:1.65;
  color:#383B4C;
  margin:0;
}/* End custom CSS */