/* OMT V19 — CSS-only continuous black/electric-blue background choreography
   No SVG/PNG/JPG/WebP artwork is used for page backgrounds in this file.
   Palette follows the approved reference: #000000 + #0F00D4. */

:root {
  --omt-bg-black: #000000;
  --omt-bg-blue: #0F00D4;
  --omt-bg-blue-rgb: 15, 0, 212;
  --omt-glass-border: rgba(255,255,255,.09);
  --omt-card-line: rgba(102, 91, 255, .20);
}

html,
body,
body.black-bg-7 {
  background: #000 !important;
  background-image: none !important;
}

/* ---------------------------------------------------------
   TICKER + FOGGY GLASS NAV
   --------------------------------------------------------- */
header {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

.omt-market-ticker,
.omt-market-ticker__live,
.omt-market-ticker__viewport,
.omt-market-ticker__track {
  background: #000 !important;
  background-image: none !important;
}

.tp-header-2-area,
.tp-header-2-area.mt-40 {
  position: relative !important;
  isolation: isolate;
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.78) 0%,
      rgba(2,2,12,.68) 24%,
      rgba(5,3,36,.56) 62%,
      rgba(15,0,212,.16) 100%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(122%) !important;
  backdrop-filter: blur(18px) saturate(122%) !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  border-bottom: 1px solid rgba(126,113,255,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    inset 0 -1px 0 rgba(255,255,255,.025),
    0 12px 30px rgba(0,0,0,.18) !important;
}

.tp-header-2-area::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(ellipse 38% 90% at 24% 0%, rgba(255,255,255,.055) 0%, rgba(255,255,255,0) 72%),
    radial-gradient(ellipse 50% 100% at 78% 112%, rgba(15,0,212,.10) 0%, rgba(15,0,212,0) 72%);
  opacity: .95;
}

.tp-header-2-area::after {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(120,105,255,.22), transparent);
}

/* ---------------------------------------------------------
   HERO: retain approved overlay from V18
   --------------------------------------------------------- */
.mxd-hero-02__cover {
  background:
    linear-gradient(180deg,
      rgba(0,0,0,.985) 0%,
      rgba(0,0,0,.955) 9%,
      rgba(1,0,18,.91) 18%,
      rgba(4,0,49,.84) 32%,
      rgba(7,0,82,.75) 49%,
      rgba(10,0,108,.67) 67%,
      rgba(4,0,52,.78) 100%),
    radial-gradient(ellipse 88% 70% at 50% 72%, rgba(var(--omt-bg-blue-rgb),.25) 0%, rgba(var(--omt-bg-blue-rgb),.08) 46%, rgba(var(--omt-bg-blue-rgb),0) 74%) !important;
}

/* ---------------------------------------------------------
   BACKGROUND CONTINUITY
   Each pair/group deliberately shares the exact edge colour so
   adjacent sections dissolve into one another rather than cut.
   --------------------------------------------------------- */

/* Group A — About reveal -> Studio showcase -> BLACK */
#omt-next-section {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 120% 94% at 50% 102%, rgba(var(--omt-bg-blue-rgb),.76) 0%, rgba(var(--omt-bg-blue-rgb),.47) 34%, rgba(var(--omt-bg-blue-rgb),.18) 64%, rgba(var(--omt-bg-blue-rgb),0) 88%),
    linear-gradient(180deg, #000 0%, #020018 24%, rgba(var(--omt-bg-blue-rgb),.24) 72%, rgba(var(--omt-bg-blue-rgb),.42) 100%) !important;
}

.studio-showcase-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 118% 88% at 50% -8%, rgba(var(--omt-bg-blue-rgb),.56) 0%, rgba(var(--omt-bg-blue-rgb),.34) 28%, rgba(var(--omt-bg-blue-rgb),.11) 56%, rgba(var(--omt-bg-blue-rgb),0) 78%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.42) 0%, rgba(var(--omt-bg-blue-rgb),.18) 32%, #050020 58%, #000 100%) !important;
}

/* The physical gap below showcase must be black — no orphan blue strip. */
.studio-showcase-area.mb-200 {
  margin-bottom: 0 !important;
  padding-bottom: 200px !important;
}

/* Group B — Studio About -> Moving Text -> BLACK */
#omt-studio-about {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 96% 82% at 50% 98%, rgba(var(--omt-bg-blue-rgb),.78) 0%, rgba(var(--omt-bg-blue-rgb),.45) 33%, rgba(var(--omt-bg-blue-rgb),.10) 64%, rgba(var(--omt-bg-blue-rgb),0) 82%),
    linear-gradient(180deg, #000 0%, #030018 38%, rgba(var(--omt-bg-blue-rgb),.16) 74%, rgba(var(--omt-bg-blue-rgb),.42) 100%) !important;
}

#omt-moving-text {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 105% 88% at 50% 0%, rgba(var(--omt-bg-blue-rgb),.60) 0%, rgba(var(--omt-bg-blue-rgb),.38) 30%, rgba(var(--omt-bg-blue-rgb),.13) 58%, rgba(var(--omt-bg-blue-rgb),0) 82%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.42) 0%, rgba(var(--omt-bg-blue-rgb),.26) 30%, #04001d 64%, #000 100%) !important;
}

/* Recent Work — BLACK -> radial BLUE -> BLACK */
#omt-recent-work {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 118% 72% at 50% 52%, rgba(var(--omt-bg-blue-rgb),.70) 0%, rgba(var(--omt-bg-blue-rgb),.36) 31%, rgba(var(--omt-bg-blue-rgb),.09) 58%, rgba(var(--omt-bg-blue-rgb),0) 78%),
    linear-gradient(180deg, #000 0%, #030019 26%, #060034 52%, #020013 78%, #000 100%) !important;
}

/* Group C — How We Work -> Creative Work; team then hands blue to Reviews */
.omt-how-we-work {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 116% 88% at 50% 104%, rgba(var(--omt-bg-blue-rgb),.74) 0%, rgba(var(--omt-bg-blue-rgb),.38) 35%, rgba(var(--omt-bg-blue-rgb),.08) 68%, rgba(var(--omt-bg-blue-rgb),0) 86%),
    linear-gradient(180deg, #000 0%, #020015 36%, rgba(var(--omt-bg-blue-rgb),.15) 72%, rgba(var(--omt-bg-blue-rgb),.40) 100%) !important;
}

.omt-creative-work {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 112% 84% at 50% -6%, rgba(var(--omt-bg-blue-rgb),.56) 0%, rgba(var(--omt-bg-blue-rgb),.30) 31%, rgba(var(--omt-bg-blue-rgb),.08) 62%, rgba(var(--omt-bg-blue-rgb),0) 84%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.40) 0%, rgba(var(--omt-bg-blue-rgb),.20) 32%, #04001e 68%, #000 100%) !important;
}

.omt-team-members {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 112% 88% at 50% 108%, rgba(var(--omt-bg-blue-rgb),.72) 0%, rgba(var(--omt-bg-blue-rgb),.42) 34%, rgba(var(--omt-bg-blue-rgb),.10) 66%, rgba(var(--omt-bg-blue-rgb),0) 84%),
    linear-gradient(180deg, #000 0%, #020017 38%, rgba(var(--omt-bg-blue-rgb),.17) 72%, rgba(var(--omt-bg-blue-rgb),.44) 100%) !important;
}

#omt-reviews {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 112% 84% at 50% -8%, rgba(var(--omt-bg-blue-rgb),.62) 0%, rgba(var(--omt-bg-blue-rgb),.34) 32%, rgba(var(--omt-bg-blue-rgb),.09) 62%, rgba(var(--omt-bg-blue-rgb),0) 82%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.44) 0%, rgba(var(--omt-bg-blue-rgb),.18) 30%, #030018 64%, #000 100%) !important;
}

/* Video stays black so Choose begins cleanly from black. */
.st-video-area {
  background: #000 !important;
  background-image: none !important;
}

/* Design Choose — BLACK -> BLUE */
.design-choose-area.design-choose-2-style {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 118% 94% at 50% 112%, rgba(var(--omt-bg-blue-rgb),.78) 0%, rgba(var(--omt-bg-blue-rgb),.43) 34%, rgba(var(--omt-bg-blue-rgb),.10) 64%, rgba(var(--omt-bg-blue-rgb),0) 84%),
    linear-gradient(180deg, #000 0%, #030019 42%, rgba(var(--omt-bg-blue-rgb),.17) 74%, rgba(var(--omt-bg-blue-rgb),.46) 100%) !important;
}

/* Inside the Game — full viewport image stage. */
.omt-single-showcase-section,
.omt-single-showcase-section .tp-showcase-slider-main,
.omt-single-showcase-section .omt-single-showcase,
.omt-single-showcase-section .swiper-wrapper,
.omt-single-showcase-section .swiper-slide,
.omt-single-showcase-section .tp-showcase-slider-bg {
  width: 100% !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  height: 100vh !important;
  height: 100svh !important;
}

.omt-single-showcase-section {
  margin-bottom: 0 !important;
  background: #000 !important;
}

.omt-single-showcase-section .tp-showcase-slider-bg {
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  display: flex !important;
  align-items: center !important;
}

/* Group D — Awards -> Rise & Roar -> Footer blue -> BLACK */
#omt-awards {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 116% 92% at 50% 104%, rgba(var(--omt-bg-blue-rgb),.78) 0%, rgba(var(--omt-bg-blue-rgb),.43) 34%, rgba(var(--omt-bg-blue-rgb),.10) 66%, rgba(var(--omt-bg-blue-rgb),0) 84%),
    linear-gradient(180deg, #000 0%, #030019 38%, rgba(var(--omt-bg-blue-rgb),.18) 72%, rgba(var(--omt-bg-blue-rgb),.46) 100%) !important;
}

.design-footer-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 122% 94% at 50% -10%, rgba(var(--omt-bg-blue-rgb),.68) 0%, rgba(var(--omt-bg-blue-rgb),.42) 32%, rgba(var(--omt-bg-blue-rgb),.17) 65%, rgba(var(--omt-bg-blue-rgb),0) 86%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.46) 0%, rgba(var(--omt-bg-blue-rgb),.34) 48%, rgba(var(--omt-bg-blue-rgb),.26) 100%) !important;
}

.tp-footer-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 118% 78% at 50% -10%, rgba(var(--omt-bg-blue-rgb),.56) 0%, rgba(var(--omt-bg-blue-rgb),.28) 34%, rgba(var(--omt-bg-blue-rgb),.06) 64%, rgba(var(--omt-bg-blue-rgb),0) 82%),
    linear-gradient(180deg, rgba(var(--omt-bg-blue-rgb),.26) 0%, #050026 34%, #010008 72%, #000 100%) !important;
}

.tp-copyright-area {
  background: #000 !important;
  background-image: none !important;
}

/* ---------------------------------------------------------
   CARD / PANEL COLOUR CORRECTION
   --------------------------------------------------------- */
.creative-work-bg,
.creative-work-square-box,
.tp-work-item,
.creative-work-item,
.design-choose-2-style .design-choose-item,
#omt-reviews .design-testimonial-item {
  background-color: #03030a !important;
  background-image:
    radial-gradient(ellipse 90% 90% at 100% 100%, rgba(var(--omt-bg-blue-rgb),.20) 0%, rgba(var(--omt-bg-blue-rgb),0) 62%),
    linear-gradient(145deg, rgba(0,0,0,.96) 0%, rgba(5,3,30,.94) 54%, rgba(12,4,72,.88) 100%) !important;
  border-color: var(--omt-card-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.creative-work-square-box::before,
.creative-work-square-box::after {
  box-shadow: none !important;
}

/* Keep square visual language. */
.creative-work-bg,
.creative-work-item,
.design-choose-2-style .design-choose-item,
.tp-work-item,
#omt-reviews .design-testimonial-item {
  border-radius: 0 !important;
}

/* Disable any old section pseudo-backgrounds from prior versions. */
#omt-next-section::before,
.studio-showcase-area::before,
#omt-studio-about::before,
#omt-moving-text::before,
#omt-recent-work::before,
.omt-how-we-work::before,
.omt-creative-work::before,
.omt-team-members::before,
#omt-reviews::before,
.design-choose-area::before,
.tp-showcase-slider::before,
.design-award-area::before,
.design-footer-area::before,
.tp-footer-area::before,
.tp-copyright-area::before {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

@media (max-width: 991px) {
  .tp-header-2-area,
  .tp-header-2-area.mt-40 {
    -webkit-backdrop-filter: blur(13px) saturate(116%) !important;
    backdrop-filter: blur(13px) saturate(116%) !important;
  }

  .omt-single-showcase-section,
  .omt-single-showcase-section .tp-showcase-slider-main,
  .omt-single-showcase-section .omt-single-showcase,
  .omt-single-showcase-section .swiper-wrapper,
  .omt-single-showcase-section .swiper-slide,
  .omt-single-showcase-section .tp-showcase-slider-bg {
    min-height: 92svh !important;
    height: 92svh !important;
  }
}