/* OMT V20 — continuity polish
   1) final hero gateway stays bright (no overlay)
   2) outro typography exactly matches hero intro typography
   3) paired sections share mathematically identical edge colours/gradients
   4) Inside the Game image begins immediately, without a black lead-in
   5) Rise & Roar + footer read as one continuous background flow */

:root {
  --omt-black: #000000;
  --omt-blue: #0F00D4;
  --omt-blue-rgb: 15, 0, 212;
  --omt-seam-blue: #090086;
  --omt-seam-blue-bright: #0b009d;
  --omt-footer-blue: #080071;
}

/* ---------------------------------------------------------
   HERO FINAL GATEWAY — bright image, no overlay
   --------------------------------------------------------- */
.mxd-hero-02__cover-img::after {
  content: none !important;
  display: none !important;
  background: none !important;
  opacity: 0 !important;
}

.mxd-hero-02__cover-img,
.mxd-hero-02__cover-img img {
  filter: none !important;
  opacity: 1 !important;
}

/* "Ready for one more trade?" = exact intro display treatment. */
.mxd-hero-02__outro {
  width: min(68%, 1080px) !important;
  padding-inline: 24px !important;
}

.mxd-hero-02__outro p {
  font-family: 'ClashDisplay-Bold', sans-serif !important;
  font-size: clamp(64px, 6vw, 96px) !important;
  font-weight: 700 !important;
  line-height: 1.02 !important;
  letter-spacing: -.012em !important;
  word-spacing: .08em !important;
  max-width: none !important;
  color: #F8C800 !important;
  -webkit-text-fill-color: #F8C800 !important;
}

.mxd-hero-02__outro .omt-hero-word {
  margin-right: .16em !important;
}

/* ---------------------------------------------------------
   STUDIO ABOUT -> MOVING TEXT
   Same radial field is mirrored exactly across the join.
   --------------------------------------------------------- */
#omt-studio-about {
  margin-bottom: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 112% 90% at 50% 100%,
      rgba(var(--omt-blue-rgb), .88) 0%,
      rgba(var(--omt-blue-rgb), .58) 28%,
      rgba(var(--omt-blue-rgb), .24) 56%,
      rgba(var(--omt-blue-rgb), 0) 82%),
    linear-gradient(180deg,
      #000 0%,
      #020010 24%,
      #050033 58%,
      var(--omt-seam-blue-bright) 100%) !important;
}

#omt-moving-text {
  margin-top: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 112% 90% at 50% 0%,
      rgba(var(--omt-blue-rgb), .88) 0%,
      rgba(var(--omt-blue-rgb), .58) 28%,
      rgba(var(--omt-blue-rgb), .24) 56%,
      rgba(var(--omt-blue-rgb), 0) 82%),
    linear-gradient(180deg,
      var(--omt-seam-blue-bright) 0%,
      #050033 40%,
      #020010 72%,
      #000 100%) !important;
}

/* ---------------------------------------------------------
   HOW WE WORK -> CREATIVE WORK
   One continuous blue field across the physical seam.
   --------------------------------------------------------- */
.omt-how-we-work {
  margin-bottom: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 118% 92% at 50% 100%,
      rgba(var(--omt-blue-rgb), .82) 0%,
      rgba(var(--omt-blue-rgb), .52) 30%,
      rgba(var(--omt-blue-rgb), .20) 58%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg,
      #000 0%,
      #020012 28%,
      #050032 60%,
      var(--omt-seam-blue) 100%) !important;
}

.omt-creative-work {
  margin-top: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 118% 92% at 50% 0%,
      rgba(var(--omt-blue-rgb), .82) 0%,
      rgba(var(--omt-blue-rgb), .52) 30%,
      rgba(var(--omt-blue-rgb), .20) 58%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg,
      var(--omt-seam-blue) 0%,
      #050032 36%,
      #020012 70%,
      #000 100%) !important;
}

/* Keep the creative-work master panel in the same palette, not a separate navy block. */
.omt-creative-work .creative-work-bg {
  background:
    radial-gradient(ellipse 86% 100% at 50% 0%, rgba(var(--omt-blue-rgb), .19) 0%, rgba(var(--omt-blue-rgb), 0) 68%),
    linear-gradient(155deg, rgba(0,0,0,.97) 0%, rgba(4,2,26,.96) 50%, rgba(10,3,65,.90) 100%) !important;
  border: 1px solid rgba(104, 89, 255, .16) !important;
  border-radius: 0 !important;
}

/* ---------------------------------------------------------
   TEAM -> REVIEWS
   Remove margin gap and carry the identical blue seam through.
   --------------------------------------------------------- */
.omt-team-members {
  margin-bottom: 0 !important;
  padding-bottom: 60px !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 114% 90% at 50% 100%,
      rgba(var(--omt-blue-rgb), .80) 0%,
      rgba(var(--omt-blue-rgb), .50) 30%,
      rgba(var(--omt-blue-rgb), .18) 58%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg,
      #000 0%,
      #020012 34%,
      #050032 68%,
      var(--omt-seam-blue) 100%) !important;
}

#omt-reviews {
  margin-top: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 114% 90% at 50% 0%,
      rgba(var(--omt-blue-rgb), .80) 0%,
      rgba(var(--omt-blue-rgb), .50) 30%,
      rgba(var(--omt-blue-rgb), .18) 58%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg,
      var(--omt-seam-blue) 0%,
      #050032 32%,
      #020012 66%,
      #000 100%) !important;
}

/* ---------------------------------------------------------
   CHOOSE -> INSIDE THE GAME
   Remove the visible black lead-in and let the image start at the seam.
   --------------------------------------------------------- */
.design-choose-area.design-choose-2-style {
  margin-bottom: 0 !important;
  background-image:
    radial-gradient(ellipse 118% 94% at 50% 108%,
      rgba(var(--omt-blue-rgb), .88) 0%,
      rgba(var(--omt-blue-rgb), .54) 32%,
      rgba(var(--omt-blue-rgb), .20) 62%,
      rgba(var(--omt-blue-rgb), 0) 86%),
    linear-gradient(180deg, #000 0%, #030019 40%, #060044 72%, var(--omt-seam-blue-bright) 100%) !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 {
  margin: 0 !important;
  padding: 0 !important;
  background-color: var(--omt-seam-blue-bright) !important;
}

.omt-single-showcase-section {
  min-height: 100vh !important;
  min-height: 100svh !important;
}

.omt-single-showcase-section .swiper-slide {
  position: relative !important;
  min-height: 100vh !important;
  min-height: 100svh !important;
  height: 100vh !important;
  height: 100svh !important;
}

.omt-single-showcase-section .tp-showcase-slider-bg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  background-position: center center !important;
  background-size: cover !important;
}

.omt-single-showcase-section .tp-showcase-slider-bg > .container {
  min-height: 100vh !important;
  min-height: 100svh !important;
  display: flex !important;
  align-items: center !important;
}

/* ---------------------------------------------------------
   AWARDS -> RISE & ROAR -> FOOTER
   Rise & Roar is treated as the first part of the footer.
   --------------------------------------------------------- */
#omt-awards {
  margin-bottom: 0 !important;
  background-image:
    radial-gradient(ellipse 116% 92% at 50% 106%,
      rgba(var(--omt-blue-rgb), .84) 0%,
      rgba(var(--omt-blue-rgb), .52) 32%,
      rgba(var(--omt-blue-rgb), .18) 62%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg, #000 0%, #030019 38%, #060040 70%, var(--omt-seam-blue) 100%) !important;
}

.design-footer-area {
  margin: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 120% 92% at 50% 0%,
      rgba(var(--omt-blue-rgb), .76) 0%,
      rgba(var(--omt-blue-rgb), .48) 31%,
      rgba(var(--omt-blue-rgb), .17) 62%,
      rgba(var(--omt-blue-rgb), 0) 86%),
    linear-gradient(180deg,
      var(--omt-seam-blue) 0%,
      #090066 44%,
      var(--omt-footer-blue) 100%) !important;
}

.tp-footer-area {
  margin: 0 !important;
  background-color: var(--omt-black) !important;
  background-image:
    radial-gradient(ellipse 122% 90% at 50% 0%,
      rgba(var(--omt-blue-rgb), .44) 0%,
      rgba(var(--omt-blue-rgb), .22) 34%,
      rgba(var(--omt-blue-rgb), .06) 64%,
      rgba(var(--omt-blue-rgb), 0) 84%),
    linear-gradient(180deg,
      var(--omt-footer-blue) 0%,
      #05002f 30%,
      #020014 58%,
      #000 100%) !important;
}

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

/* Remove any legacy section borders that expose section boundaries. */
#omt-studio-about,
#omt-moving-text,
.omt-how-we-work,
.omt-creative-work,
.omt-team-members,
#omt-reviews,
.design-choose-area.design-choose-2-style,
.omt-single-showcase-section,
#omt-awards,
.design-footer-area,
.tp-footer-area,
.tp-copyright-area {
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none;
}

@media (max-width: 1199px) {
  .mxd-hero-02__outro {
    width: min(82%, 900px) !important;
  }
}

@media (max-width: 767px) {
  .mxd-hero-02__outro {
    width: 94% !important;
    padding-inline: 12px !important;
  }

  .mxd-hero-02__outro p {
    font-size: clamp(44px, 12vw, 58px) !important;
    line-height: 1.04 !important;
    letter-spacing: -.008em !important;
  }

  .mxd-hero-02__outro .omt-hero-word {
    margin-right: .13em !important;
  }
}
