/*
  Hero gap + borderless cleanup
  Loaded last to remove the blank strip between the topbar and shared page heroes
  and to reduce bordered/boxed div usage across public pages.
*/

/* Remove the blank space between menu and shared premium hero pages. */
html body main.container:has(> .uc-page-hero){
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

html body main.container:has(> .uc-page-hero) > .uc-page-hero{
  margin-top:0!important;
}

/* The page hero starts directly after the topbar and fades naturally into the page. */
html body .uc-page-hero{
  margin-top:0!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  padding-top:clamp(86px,7.5vw,122px)!important;
  background:
    radial-gradient(circle at 73% 16%,rgba(92,129,255,.22),transparent 25rem),
    radial-gradient(circle at 90% 74%,rgba(255,36,78,.18),transparent 34rem),
    radial-gradient(circle at 0% 0%,rgba(139,32,255,.10),transparent 26rem),
    linear-gradient(180deg,#080013 0%,#090017 64%,#050c17 100%)!important;
}

html body .topbar + main.container:has(> .uc-page-hero){
  margin-top:0!important;
}

/* Remove any old global page padding that can create a dark band above hero. */
html body:has(.uc-page-hero) .public-main,
html body:has(.uc-page-hero) .page-main{
  padding-top:0!important;
}

/* Make the shared hero feel more editorial and less boxed. */
html body .uc-page-facts{
  gap:12px!important;
}

html body .uc-page-facts div{
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  padding:14px 0 14px 20px!important;
  position:relative!important;
  min-height:72px!important;
}

html body .uc-page-facts div::before{
  content:""!important;
  position:absolute!important;
  left:0!important;
  top:16px!important;
  bottom:16px!important;
  width:2px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#8b20ff,#198cff)!important;
  opacity:.8!important;
}

html body .uc-page-facts div::after{
  content:""!important;
  position:absolute!important;
  left:-7px!important;
  top:24px!important;
  width:16px!important;
  height:16px!important;
  border-radius:999px!important;
  background:radial-gradient(circle,#ffffff 0 2px,#8b20ff 3px,#198cff 7px,transparent 8px)!important;
  opacity:.72!important;
}

html body .uc-page-facts span{
  color:#a99dbf!important;
}

html body .uc-page-facts strong{
  color:#ffffff!important;
}

/* Public content cards: remove heavy boxed borders; use rhythm, whitespace and soft fills instead. */
html body main.container:has(.uc-page-hero) :where(.card,.clean-panel,.status-card,.contact-form-card,.contact-info-card,.api-doc-card,.api-docs-tools,.api-endpoint,.faq-layout details,.legal-page,.one-plan-card,.one-feature-strip,.latency-panel,.status-event-card){
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.022))!important;
}

html body main.container:has(.uc-page-hero) :where(.card,.clean-panel,.status-card,.contact-form-card,.contact-info-card,.api-doc-card,.api-docs-tools,.api-endpoint,.faq-layout details,.legal-page,.one-plan-card,.latency-panel,.status-event-card){
  border-radius:24px!important;
}

/* Use subtle separators instead of boxes where possible. */
html body main.container:has(.uc-page-hero) :where(.status-grid,.contact-layout,.faq-layout,.api-endpoint-list){
  gap:18px!important;
}

html body main.container:has(.uc-page-hero) :where(.card,.clean-panel,.status-card,.contact-form-card,.contact-info-card,.api-doc-card,.api-docs-tools,.api-endpoint,.faq-layout details,.legal-page){
  position:relative!important;
}

html body main.container:has(.uc-page-hero) :where(.card,.clean-panel,.status-card,.contact-form-card,.contact-info-card,.api-doc-card,.api-docs-tools,.api-endpoint,.faq-layout details,.legal-page)::before{
  content:""!important;
  position:absolute!important;
  left:24px!important;
  right:24px!important;
  top:0!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent)!important;
  pointer-events:none!important;
}

/* API endpoint blocks especially should not look like large bordered boxes. */
html body main.container:has(.uc-page-hero) .api-endpoint{
  background:
    radial-gradient(circle at 100% 0%,rgba(25,140,255,.07),transparent 170px),
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.018))!important;
}

html body main.container:has(.uc-page-hero) .api-endpoint-head code{
  border:0!important;
  outline:0!important;
  background:rgba(255,255,255,.055)!important;
}

/* Buttons on public pages: fewer bordered outlines. */
html body main.container:has(.uc-page-hero) :where(.btn.ghost,.api-method-filter button){
  border:0!important;
  outline:0!important;
  background:rgba(255,255,255,.06)!important;
}

html body main.container:has(.uc-page-hero) :where(.btn.ghost:hover,.api-method-filter button:hover,.api-method-filter button.active){
  background:rgba(139,32,255,.18)!important;
}

/* Footer: make sure no rounded bordered footer box returns from earlier styles. */
html body :where(.footer,.site-footer){
  border:0!important;
  outline:0!important;
  background:transparent!important;
}

html body :where(.footer-inner,.site-footer-inner,.footer .site-footer-inner){
  border:0!important;
  outline:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* Tables inside public pages: clean separators instead of boxed rows. */
html body main.container:has(.uc-page-hero) table :where(th,td){
  border:0!important;
  box-shadow:none!important;
}

/* Responsive */
@media(max-width:980px){
  html body .uc-page-facts{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:760px){
  html body .uc-page-hero{
    padding-top:86px!important;
  }
  html body .uc-page-facts div{
    min-height:auto!important;
  }
}