.elementor-8229 .elementor-element.elementor-element-e88f763{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS *//* ============================================================
   DORA & FINANCIAL OPERATIONAL RESILIENCE SUMMIT
   FULL PAGE BACKGROUND
   ------------------------------------------------------------
   WHERE TO PASTE — pick one:
     Elementor  : Site Settings → Custom CSS        (whole site)
     Elementor  : Page Settings → Advanced → Custom CSS
                  (this page only — works as-is, no "body.elementor-page-8229"
                  prefix needed, because every rule below names
                  its own element)
     WordPress  : Appearance → Customise → Additional CSS

   WHY THE BLOCKS GO TRANSPARENT
     Each block ships with its own navy gradient. Stacked up, you
     would only ever see the page background in the gaps between
     them. Section 4 clears those so the one background runs the
     full height of the page, behind everything.

   HEADER AND FOOTER ARE LEFT ALONE
     Section 4 is scoped to the page content, so your header and
     footer keep their own background. Section 6 at the bottom is
     there only if you decide you want them transparent too.
   ============================================================ */

/* ---- 1. tokens ---- */
:root{
  --dora-bg:#050A14;
  --dora-bg2:#08121F;
  --dora-line:#15293E;
  --dora-line2:#1D3A56;
  --dora-cy:#35E6DF;
  --dora-blue:#2E86F5;
  --dora-ink:#EAF2FB;
  --dora-grid:72px;
}

/* ---- 2. the background itself ----
   Painted on html so it covers the full document height plus any
   over-scroll, whatever the theme does to body. */
html{
  background-color:var(--dora-bg) !important;
  background-image:
    radial-gradient(60% 40% at 82% 4%,  rgba(22,120,190,.22), transparent 62%),
    radial-gradient(52% 38% at 8% 96%,  rgba(53,230,223,.10), transparent 60%),
    linear-gradient(180deg, var(--dora-bg) 0%, var(--dora-bg2) 46%, var(--dora-bg) 100%) !important;
  background-repeat:no-repeat !important;
  background-size:cover !important;
  background-attachment:fixed !important;   /* stays put while the page scrolls */
}

body{
  background:transparent !important;        /* let html show through */
  color:var(--dora-ink);
}

/* ---- 3. the circuit grid ----
   A fixed overlay, so its pitch never restarts and it costs
   nothing to repeat down a long page. */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(53,230,223,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(53,230,223,.05) 1px, transparent 1px);
  background-size:var(--dora-grid) var(--dora-grid);
  -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%, #000 4%, transparent 78%);
          mask-image:radial-gradient(ellipse 70% 60% at 50% 40%, #000 4%, transparent 78%);
}
body > *{ position:relative; z-index:1; }   /* content sits above it */

/* ---- 4. clear the opaque layers over the page content ----
   Scoped to the content region on purpose: the header and the
   footer are left alone, so whatever background your theme or
   your Elementor header/footer template gives them survives.
   That is why the generic .elementor / .e-con / .elementor-section
   body.elementor-page-8229s are not used bare here — they would match inside the
   footer too. */

/* outer wrappers — these sit around the content, not inside the footer */
#page, .site, .site-content, .content-area, .entry-content,
main, #main, #primary, .site-main,
.elementor-location-single, .elementor-location-archive{
  background-color:transparent !important;
  background-image:none !important;
}

/* Elementor containers, only within the content region */
main .elementor, main .elementor-widget-container,
main .e-con, main .e-con-inner, main .elementor-section, main .elementor-container,
.entry-content .elementor, .entry-content .elementor-widget-container,
.elementor-location-single .elementor-widget-container,
.entry-content .e-con, .entry-content .e-con-inner,
.entry-content .elementor-section, .entry-content .elementor-container,
.elementor-location-single .e-con, .elementor-location-single .e-con-inner,
.elementor-location-single .elementor-section,
.elementor-location-single .elementor-container{
  background-color:transparent !important;
  background-image:none !important;
}

/* the DORA blocks */
.reg, .spo, .vtm, .gal, .dhl, .vpl, .net, .who, .gal__inner,
#dp-partners, #dbr-request, #doraRegistration, #doraSponsorship,
#doraTestimonials, #doraGallery, #doraHighlights, #doraPlaylist,
#hero, #about, #topics, #who-attends, #industries,
#networking, #exhibiting, #sponsor, #registration, #final{
  background:transparent !important;
  background-image:none !important;
  border-top:0 !important;
}

/* one hairline between neighbouring blocks instead of two */
.reg, .spo, .vtm, .gal, .dhl, .vpl,
#dp-partners, #dbr-request,
#about, #topics, #who-attends, #networking, #exhibiting{
  border-bottom:1px solid var(--dora-line) !important;
}

/* the glows inside individual blocks are no longer needed once the
   page carries its own — drop them so they do not stack up */
.reg::after, .spo::after, .vtm::after, .gal::after,
.dhl::after, .vpl::after, .halo{
  display:none !important;
}

/* ---- 4b. belt and braces: never touch the header or footer ----
   If a body.elementor-page-8229 above ever matches something inside them on your
   build, this puts the layer back in the stacking order rather
   than stripping its colour. Remove it if you would rather the
   background ran behind the footer as well. */
footer, .site-footer, footer.elementor-location-footer,
header, .site-header, header.elementor-location-header{
  position:relative;
  z-index:1;
}

/* ---- 5. shared details ---- */
::selection{ background:rgba(53,230,223,.28); color:#fff; }

html{ scrollbar-width:thin; scrollbar-color:rgba(53,230,223,.45) #0A1524; }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:#0A1524; }
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,#35E6DF,#2E86F5);
  border-radius:999px; border:3px solid #0A1524;
}
::-webkit-scrollbar-thumb:hover{ background:linear-gradient(180deg,#5AF6EA,#4B9CFF); }

/* ============================================================
   6. OPTIONAL — extend the background to the header and footer
   ------------------------------------------------------------
   Left commented on purpose. Uncomment only if you want the page
   background to run behind them as well, and adjust the body.elementor-page-8229s
   to whatever your theme uses.
   ============================================================ */

/*
.site-header, .site-footer,
header.elementor-location-header,
footer.elementor-location-footer{
  background-color:transparent !important;
  background-image:none !important;
}
*//* End custom CSS */