/* OMT V21 — two targeted corrections
   1) Hero outro typography is forced to the exact same display system as the intro.
   2) Rise & Roar + footer use one continuous footer background, independent of Awards. */

:root {
  --omt-v21-yellow: #F8C800;
  --omt-v21-blue: #0F00D4;
  --omt-v21-blue-rgb: 15, 0, 212;
}

/* =========================================================
   HERO OUTRO: exact visual parity with the main hero heading
   ========================================================= */
.omt-typography-hero .mxd-hero-02__intro h1,
.omt-typography-hero .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;
  color: var(--omt-v21-yellow) !important;
  -webkit-text-fill-color: var(--omt-v21-yellow) !important;
  text-rendering: geometricPrecision;
  font-kerning: normal;
  font-feature-settings: "kern" 1;
  text-shadow: 0 4px 26px rgba(0,0,0,.28) !important;
}

.omt-typography-hero .mxd-hero-02__intro,
.omt-typography-hero .mxd-hero-02__outro {
  width: min(68%, 1080px) !important;
  padding-inline: 24px !important;
}

.omt-typography-hero .mxd-hero-02__intro .omt-hero-word,
.omt-typography-hero .mxd-hero-02__outro .omt-hero-word {
  display: inline-block !important;
  margin-right: .16em !important;
  white-space: nowrap;
  font-family: inherit !important;
  font-weight: inherit !important;
}

.omt-typography-hero .mxd-hero-02__intro .omt-hero-char,
.omt-typography-hero .mxd-hero-02__outro .omt-hero-char {
  display: inline-block !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  letter-spacing: inherit !important;
}

/* Keep the final hero gateway image completely clean and bright. */
.mxd-hero-02__cover-img::before,
.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 {
  opacity: 1 !important;
  filter: none !important;
}

/* =========================================================
   AWARDS / FOOTER SEPARATION
   Awards closes itself to black. Footer starts independently.
   ========================================================= */
#omt-awards {
  margin-bottom: 0 !important;
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 108% 76% at 50% 48%,
      rgba(var(--omt-v21-blue-rgb), .70) 0%,
      rgba(var(--omt-v21-blue-rgb), .34) 30%,
      rgba(var(--omt-v21-blue-rgb), .10) 58%,
      rgba(var(--omt-v21-blue-rgb), 0) 78%),
    linear-gradient(180deg,
      #000 0%,
      #030019 26%,
      #080061 52%,
      #020012 82%,
      #000 100%) !important;
}

/* One canvas for Rise & Roar + footer + copyright.
   Child sections are transparent, so no seam can form between them. */
footer {
  position: relative;
  isolation: isolate;
  background-color: #000 !important;
  background-image:
    radial-gradient(ellipse 120% 74% at 50% 38%,
      rgba(var(--omt-v21-blue-rgb), .86) 0%,
      rgba(var(--omt-v21-blue-rgb), .54) 24%,
      rgba(var(--omt-v21-blue-rgb), .24) 48%,
      rgba(var(--omt-v21-blue-rgb), .06) 68%,
      rgba(var(--omt-v21-blue-rgb), 0) 82%),
    linear-gradient(180deg,
      #000 0%,
      #03001d 16%,
      #080063 36%,
      #090078 52%,
      #05003a 70%,
      #010008 88%,
      #000 100%) !important;
}

footer .design-footer-area,
footer .tp-footer-area,
footer .tp-copyright-area {
  margin: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
}

/* Remove any pseudo background layers inherited from older versions. */
footer .design-footer-area::before,
footer .design-footer-area::after,
footer .tp-footer-area::before,
footer .tp-footer-area::after,
footer .tp-copyright-area::before,
footer .tp-copyright-area::after {
  content: none !important;
  display: none !important;
  background: none !important;
}

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

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

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

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