/* OMT V18 — CSS-only black + electric-blue background system
   Reference palette extracted from the supplied SVG:
   black #000000 + blue #0F00D4.
   No SVG/PNG background artwork is used by this stylesheet. */

:root {
  --omt-yellow: #F8C800;
  --omt-black: #000000;
  --omt-blue: #0F00D4;
  --omt-ticker-h: 32px;
  --omt-nav-h: 82px;
}

html,
body {
  margin: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(circle at 50% 120%, rgba(15, 0, 212, .82) 0%, rgba(15, 0, 212, .34) 27%, rgba(15, 0, 212, 0) 62%),
    linear-gradient(180deg, #000 0%, #000 28%, rgba(15, 0, 212, .10) 56%, rgba(15, 0, 212, .44) 100%) !important;
  background-attachment: scroll !important;
}

body {
  overflow-x: clip;
  isolation: auto !important;
}

/* Remove older generated ambient/background layers. */
body::before,
body::after {
  content: none !important;
  display: none !important;
  background: none !important;
  animation: none !important;
  filter: none !important;
  backdrop-filter: none !important;
}

/* ----------------------------------------------------------
   TOP BAR + NAVIGATION
   ---------------------------------------------------------- */
header {
  position: relative !important;
  z-index: 5000 !important;
  display: flow-root !important;
  box-sizing: border-box !important;
  padding-top: var(--omt-ticker-h) !important;
  min-height: calc(var(--omt-ticker-h) + var(--omt-nav-h)) !important;
  margin: 0 !important;
  isolation: isolate;
  background: linear-gradient(180deg,
    #000 0%,
    #000 18%,
    rgba(15, 0, 212, .10) 48%,
    rgba(15, 0, 212, .30) 76%,
    rgba(15, 0, 212, .52) 100%) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, .28);
}

/* Ticker requested as pure black: no blue / no gradient. */
.omt-market-ticker {
  position: absolute !important;
  z-index: 5002 !important;
  inset: 0 0 auto 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: var(--omt-ticker-h) !important;
  margin: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: #000 !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, .08) !important;
  box-shadow: none !important;
}

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

/* Navigation: black at the top, gradually opening into the supplied blue. */
.tp-header-2-area,
.tp-header-2-area.mt-40 {
  position: relative !important;
  z-index: 5001 !important;
  display: block !important;
  min-height: var(--omt-nav-h) !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  background: linear-gradient(180deg,
    #000 0%,
    rgba(0, 0, 0, .98) 20%,
    rgba(15, 0, 212, .08) 52%,
    rgba(15, 0, 212, .26) 78%,
    rgba(15, 0, 212, .46) 100%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .055) !important;
}

.tp-header-2-area .container,
.tp-header-2-area .row {
  min-height: var(--omt-nav-h) !important;
}

.tp-header-logo,
.tp-header-logo a,
.tp-header-logo img,
.tp-header-2-right,
.tp-header-2-bar,
.tp-header-2-bar span,
.tp-header-2-bar span i {
  position: relative;
  z-index: 2;
  opacity: 1 !important;
  visibility: visible !important;
}

.tp-header-logo img {
  display: block !important;
}

.tp-header-2-bar span {
  color: #fff !important;
}

.tp-header-2-bar span i {
  background-color: #fff !important;
}

/* ----------------------------------------------------------
   CSS-ONLY SITE BACKGROUNDS
   The three variants reproduce the same black/electric-blue family
   without loading any image background.
   ---------------------------------------------------------- */

/* Black top -> blue lower field */
#omt-next-section,
#omt-moving-text,
.omt-team-members,
.tp-footer-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(circle at 50% 128%, rgba(15, 0, 212, .90) 0%, rgba(15, 0, 212, .42) 28%, rgba(15, 0, 212, 0) 66%),
    linear-gradient(180deg, #000 0%, #000 34%, rgba(15, 0, 212, .12) 66%, rgba(15, 0, 212, .42) 100%) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

/* Blue glow rises from bottom, black dominates upper field */
.studio-showcase-area,
#omt-studio-about,
.omt-how-we-work,
#omt-reviews,
.design-award-area,
.tp-copyright-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 92% 78% at 50% 118%, rgba(15, 0, 212, .92) 0%, rgba(15, 0, 212, .46) 30%, rgba(15, 0, 212, .08) 58%, rgba(15, 0, 212, 0) 75%),
    linear-gradient(180deg, #000 0%, #000 54%, rgba(15, 0, 212, .10) 100%) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

/* Blue halo around upper area, fading into black */
#omt-recent-work,
.omt-creative-work,
.tp-showcase-slider,
.design-footer-area {
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 100% 74% at 50% -16%, rgba(15, 0, 212, .72) 0%, rgba(15, 0, 212, .26) 32%, rgba(15, 0, 212, 0) 66%),
    linear-gradient(180deg, rgba(15, 0, 212, .12) 0%, #000 46%, #000 100%) !important;
  background-repeat: no-repeat !important;
  background-size: 100% 100% !important;
}

/* Kill all old image/pseudo background layers from V16/V17. */
#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,
.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;
  animation: none !important;
  filter: none !important;
  backdrop-filter: none !important;
  transform: none !important;
}

#omt-next-section,
.studio-showcase-area,
#omt-studio-about,
#omt-moving-text,
#omt-recent-work,
.omt-how-we-work,
.omt-creative-work,
.omt-team-members,
#omt-reviews,
.tp-showcase-slider,
.design-award-area,
.design-footer-area,
.tp-footer-area,
.tp-copyright-area {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

/* ----------------------------------------------------------
   HERO — deeper blue/black overlay for better focus
   ---------------------------------------------------------- */
.omt-hero-section {
  position: relative;
  z-index: 1;
  background: #000 !important;
}

.omt-hero-bg-video {
  opacity: .54 !important;
  filter: none !important;
  transform: translate3d(0, 0, 0) scale(1.003) !important;
  backface-visibility: hidden;
  will-change: auto !important;
}

/* Strongest darkness at the top; subtle electric-blue tint lower down. */
.mxd-hero-02__cover {
  background:
    linear-gradient(180deg,
      rgba(0, 0, 0, .975) 0%,
      rgba(0, 0, 0, .94) 8%,
      rgba(0, 0, 0, .88) 17%,
      rgba(4, 0, 48, .82) 31%,
      rgba(7, 0, 78, .74) 48%,
      rgba(10, 0, 104, .66) 67%,
      rgba(4, 0, 48, .76) 100%),
    radial-gradient(ellipse 86% 66% at 50% 72%, rgba(15, 0, 212, .24) 0%, rgba(15, 0, 212, .08) 46%, rgba(15, 0, 212, 0) 72%) !important;
}

.mxd-hero-02__cover::before {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

.mxd-hero-02__cover-img::after {
  background:
    linear-gradient(180deg,
      rgba(0, 0, 0, .84) 0%,
      rgba(3, 0, 38, .68) 28%,
      rgba(7, 0, 88, .42) 54%,
      rgba(0, 0, 0, .66) 100%),
    radial-gradient(ellipse 80% 70% at 50% 58%, rgba(15, 0, 212, .18) 0%, rgba(15, 0, 212, 0) 64%) !important;
}

.mxd-hero-02__intro,
.mxd-hero-02__outro {
  mix-blend-mode: normal !important;
}

.mxd-hero-02__intro h1,
.mxd-hero-02__outro p {
  color: var(--omt-yellow) !important;
  -webkit-text-fill-color: var(--omt-yellow) !important;
  background: none !important;
  background-image: none !important;
  text-shadow: 0 8px 28px rgba(0, 0, 0, .48) !important;
}

/* Keep performance predictable: no large blurred/animated background layers. */
.design-project-item,
.design-testimonial-item,
.studio-team-thumb,
.tp-showcase-slider-content,
.omt-project-modal__panel {
  box-shadow: none !important;
}

@media (max-width: 767px) {
  :root {
    --omt-ticker-h: 30px;
    --omt-nav-h: 72px;
  }

  header {
    padding-top: var(--omt-ticker-h) !important;
  }

  .omt-market-ticker {
    height: var(--omt-ticker-h) !important;
  }
}
