/* Shared CREOVA surfaces and subpage rhythm. */
html, body {
  background: #02061d !important;
  background-color: #02061d !important;
  color: #f7fbff !important;
}

#activation-catalog,.section-pad,.activation-hero,.core-collections,.dark-intro-section,.activation-flow-section,.dark-usecases-section,.dark-faq-section,.dark-featured-video-section{background:transparent!important;background-color:transparent!important}
#navbar, .activation-hero, #activation-catalog, footer, #footer, .section-pad, main{position:relative!important;z-index:2!important}
#navbar,#navbar.scrolled{position:fixed!important;top:0!important;left:0!important;right:0!important;background:transparent!important;background-color:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;border:none!important;box-shadow:none!important;z-index:99999!important;transition:transform .4s cubic-bezier(.16,1,.3,1),opacity .3s ease!important}#navbar.nav-hidden{transform:translateY(-115%)!important;opacity:0!important;pointer-events:none!important}
.collection-heading{display:none!important}
.dark-hero-banner{display:block!important}
.dark-breadcrumbs{background:transparent!important;padding:18px 0!important}
.activation-page-nav{display:none!important}
#activation-catalog{padding-top:24px!important;min-height:0!important}
.msd-duo-container{align-content:start!important;grid-auto-rows:auto!important;row-gap:24px!important}
.category-header-block{opacity:1!important;visibility:visible!important;transform:none!important;min-height:0!important;margin:8px 0!important;padding:12px 0!important}
.category-header-block .sec-label{display:none!important}
.category-header-block h2{font-size:clamp(24px,3vw,34px)!important;margin:0!important}
.msd-duo-item,.collection-card,.photobooth-step{background:rgba(5,14,35,.42)!important;border-color:rgba(255,255,255,.14)!important;box-shadow:none!important}
.activation-tools{margin-bottom:18px!important;opacity:1!important;visibility:visible!important;transform:none!important}
.collection-return{display:block;padding:18px 0 0;color:#00e6f5;font-size:14px;text-decoration:none}
.dark-intro-section{padding-top:26px!important}.dark-narrative-title{font-size:clamp(26px,3vw,36px)!important}
@media(max-width:600px){#navbar .nav-inner{min-height:64px}.category-header-block{text-align:left!important}.activation-page-nav .wrapper{flex-wrap:nowrap;overflow:auto}}

/* Compact collection navigation. */
.activation-hero{padding:26px 0 12px!important;border:0!important;min-height:0!important}
.activation-hero-inner{max-width:var(--wrapper-width,1280px)!important;margin:auto!important;text-align:left!important}
.activation-hero h1{font-size:clamp(28px,3vw,38px)!important;line-height:1.15!important;margin:0 0 10px!important;max-width:none!important}
.activation-hero p{font-size:14px!important;line-height:1.6!important;margin:0!important;max-width:740px!important}
.activation-hero .service-badge{display:none!important}
.core-collections{padding:16px 0 24px!important}
.core-collections-head{display:block!important;margin-bottom:14px!important}
.core-collections-head .sec-label,.core-collections-head>p{display:none!important}
.core-collections-head h2{font-size:20px!important;line-height:1.3!important;margin:0!important}
.collection-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:12px!important}
.collection-card{padding:8px!important;border-radius:12px!important;min-width:0}
.collection-card-media{aspect-ratio:16/9!important;height:auto!important;border-radius:7px!important;margin-bottom:9px!important}
.collection-card h3{font-size:12px!important;line-height:1.4!important;margin:0!important}
.collection-card>span{display:none!important}
@media(max-width:1100px){.collection-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(max-width:650px){.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.activation-hero{padding-top:20px!important}}


/* ═══════════════════════════════════════════════════
   CREOVA SVG GOOEY BUBBLE BACKGROUND FIX
   ═══════════════════════════════════════════════════ */
:root {
  --first-color: 0, 138, 214;
  --second-color: 0, 75, 180;
  --third-color: 0, 240, 255;
  --fourth-color: 3, 22, 85;
  --fifth-color: 14, 65, 175;
  --sixth-color: 0, 180, 255;
}

#bubble-bg-container, .bubble-bg-root {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 0 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(135deg, #020412 0%, #050b28 50%, #01020d 100%) !important;
}

/* Make content sections sit transparently on z-index 1 above bubbles */
body {
  background: #02061d !important;
  color: #fff !important;
}

main, section,
.tech-dedicated-hero,
.holobox-spotlight-wrap,
.use-cases-section,
.tech-specs-section,
.other-techs-section,
.dark-intro-section,
.kiosk-action-section,
.activation-flow-section,
.service-detail-hero,
.cv-section {
  background: transparent !important;
  background-color: transparent !important;
  position: relative;
  z-index: 1;
}
