/* ===== Self-Care (scoped) ===== */
#cbn-selfcare *{box-sizing:border-box}
html,body{overflow-x:hidden}
#cbn-selfcare .wrap{max-width:1120px;margin-inline:auto;padding:16px}

/* Sticky blue band under main menu */
#cbn-selfcare .topband{
  position:-webkit-sticky; position:sticky;
  top:var(--cbn-sticky-offset, 80px);
  z-index:998;
  background:#0e2a55;
  margin-top:-1px; /* kiss the header (remove tiny gap) */
}
#cbn-selfcare .topband-inner{
  max-width:1120px;margin:auto;padding:12px 16px;
  display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:12px
}
#cbn-selfcare .top-btn{
  justify-self:start;background:#ffd76b;color:#111827;border-radius:999px;
  padding:10px 14px;font-weight:700;border:0
}
#cbn-selfcare .search{
  justify-self:end;display:flex;align-items:center;gap:8px;background:#fff;
  border-radius:999px;padding:8px 12px;width:100%;max-width:420px;
  border:1px solid rgba(255,255,255,.15)
}
#cbn-selfcare .search input{border:0;outline:0;width:100%;font-size:16px}
#cbn-selfcare .search .icon{width:18px;height:18px;opacity:.6}
@media (max-width:640px){
  #cbn-selfcare .topband-inner{grid-template-columns:1fr}
  #cbn-selfcare .search{justify-self:stretch;max-width:none;margin-top:10px}
}

/* Hero */
#cbn-selfcare .hero{
  background:linear-gradient(135deg,#e9edf2,#fff 40%,#eef3fb);
  border-radius:24px;overflow:hidden;display:grid;
  grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;
  padding:20px;margin-top:12px
}
#cbn-selfcare .hero-media{
  display:block;width:100%;aspect-ratio:16/9;border-radius:inherit;
  background:#d7dee9 center/cover no-repeat;min-height:220px;
  background-image:url('self-care-hero-banner.webp');
}
#cbn-selfcare .hero > *{min-width:0}
#cbn-selfcare .hero h1{
  font-size:clamp(24px,3vw,40px);line-height:1.2;margin:0;color:#0e1f3a;
  font-weight:800;overflow-wrap:anywhere
}
#cbn-selfcare .hero p{margin:12px 0 20px;color:#374151}
#cbn-selfcare .btns{display:flex;gap:12px;flex-wrap:wrap}
#cbn-selfcare .btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:12px 18px;font-weight:700;border:1px solid transparent;background:#0b5ed7;color:#fff}
#cbn-selfcare .btn.secondary{background:#fff;color:#0b5ed7;border-color:#c8d3e8}
@media (max-width:780px){#cbn-selfcare .hero{grid-template-columns:1fr}}

/* Sections / grids / cards */
#cbn-selfcare h2.section-title{font-size:22px;color:#0e1f3a;margin:28px 0 12px;font-weight:800}
#cbn-selfcare .section-head{display:flex;justify-content:space-between;align-items:center;gap:12px}
#cbn-selfcare .view-link{font-size:14px}
#cbn-selfcare .bar{height:1px;background:#e5e7eb;margin:20px 0}

#cbn-selfcare .grid{display:grid;gap:16px}
#cbn-selfcare .grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
#cbn-selfcare .grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
#cbn-selfcare .grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:1000px){#cbn-selfcare .grid.cols-4{grid-template-columns:repeat(3,1fr)}}
@media (max-width:780px){#cbn-selfcare .grid.cols-4,#cbn-selfcare .grid.cols-3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){#cbn-selfcare .grid.cols-4,#cbn-selfcare .grid.cols-3,#cbn-selfcare .grid.cols-2{grid-template-columns:1fr}}

#cbn-selfcare .card{border:1px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
#cbn-selfcare .thumb{aspect-ratio:16/9;background:#f2f4f7 center/cover no-repeat}
#cbn-selfcare .card-body{padding:12px 12px 14px}
#cbn-selfcare .card h3{font-size:15px;margin:4px 0 8px;color:#111827;font-weight:700}
#cbn-selfcare .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
#cbn-selfcare .chip{font-size:13px;border-radius:999px;border:1px solid #cfd8e3;padding:8px 10px;color:#0b5ed7;background:#fff}
#cbn-selfcare .chip.primary{background:#0b5ed7;color:#fff;border-color:#0b5ed7}

/* Subscribe CTA */
#cbn-selfcare .subscribe-cta{background:#0e2a55;color:#fff;border-radius:24px;padding:28px;text-align:center}
#cbn-selfcare .subscribe-cta .btn{background:#fff;color:#0e2a55}
#cbn-selfcare .subscribe-cta p{color:#e6edf8;margin:8px 0 14px}

/* Support */
#cbn-selfcare .support{background:#e9edf2;border-radius:24px;padding:20px}
#cbn-selfcare .support-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){#cbn-selfcare .support-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){#cbn-selfcare .support-grid{grid-template-columns:1fr}}
#cbn-selfcare .support-item h4{margin:0 0 6px;color:#0e1f3a}
#cbn-selfcare .time{font-size:12px;color:#6b7280;margin-top:6px}

/* Sticky fallback class (JS toggles it if native sticky is blocked by builder) */
#cbn-selfcare .topband.is-fixed{
  position:fixed;left:0;right:0;width:100%;
  top:calc(var(--cbn-sticky-offset, 80px) - 1px);
  z-index:998
}
#cbn-selfcare #topband-spacer{height:0}