/*! File name: main.css
 * ------------------------------------------------
 * ------------------------------------------------
 * Table of Contents
 * ------------------------------------------------
 *  01. Fonts
 *  02. Variables
 *  03. Template Backgrounds
 *  04. Basic Styles
 *  05. Elements - Page Structure
 *  06. Elements - Typography
 *  07. Elements - Controls
 *  08. Elements - Forms
 *  09. Elements - Components
 *  10. Elements - Common Classes
 *  11. Block - Header
 *  12. Block - Menu
 *  13. Block - CTA
 *  14. Block - Footer
 *  15. Block - Popup
 *  16. Block - Hero Section #00
 *  17. Block - Hero Section #01
 *  18. Block - Hero Section #02
 *  19. Block - Hero Section #03
 *  20. Block - Hero Section #04
 *  21. Block - Hero Section #05
 *  22. Block - Hero Section #06
 *  22. Block - Hero Section #07
 *  23. Block - Hero Section #08
 *  24. Block - Hero Section #09
 *  25. Block - Blog
 *  26. Block - Blog Article
 *  27. Block - 404 Error
 *  28. Block - Demo List
 *  29. Block - Demo Cards
 *  30. Block - Demo Responsive Promo
 *  31. Block - Demo Inner Pages Slider
 *  32. Block - Demo Components
 *  33. Block - Demo Features
 *  34. Block - Demo CTA
 *  35. Block - Demo Footer
 *  36. Features - Hover Reveal
 *  37. Features - About
 *  38. Features - Pinned Image
 *  39. Features - Pinned Universal
 *  40. Features - Pinned Projects
 *  41. Features - Projects List
 *  42. Features - Projects Masonry
 *  43. Features - Awards List
 *  44. Features - Statistics Simple
 *  45. Features - Statistics Cards
 *  46. Features - Services Cards #01
 *  47. Features - Services Cards #02
 *  48. Features - Services List
 *  49. Features - Capabilities List
 *  50. Features - Resume List
 *  51. Features - Approach List
 *  52. Features - Divider Image Parallax
 *  53. Features - Marquee
 *  54. Features - Stack Services #01
 *  55. Features - Stack Services #02
 *  56. Features - Stack Projects
 *  57. Features - Testimonials Style #01
 *  58. Features - Testimonials Style #02
 *  59. Features - Partners Cards
 *  60. Features - Tech Stack Cards
 *  61. Features - Blog Preview
 *  62. Features - Accordion
 *  63. Features - Pricing Cards
 *  64. Features - Team Cards
 *  65. Features - Values
 *  66. Features - Project Details
 * ------------------------------------------------
 * Table of Contents End
 * ------------------------------------------------ */
/* ------------------------------------------------*/
/* Fonts Start */
/* ------------------------------------------------*/
/* Funnel Display font */
@import url("https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&display=swap");
/* Funnel Sans font */
@import url("https://fonts.googleapis.com/css2?family=Funnel+Sans:ital,wght@0,300..800;1,300..800&display=swap");
/* Playfair Display - elegant serif italic for headline accents */
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@1,400&display=swap");

/* ------------------------------------------------*/
/* Fonts End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Variables Start */
/* ------------------------------------------------*/
:root {
  --_size: 1.8rem;
  --_font-default: "Funnel Sans", sans-serif;
  --_font-accent: "Funnel Display", sans-serif;
  --_radius-s: 1rem;
  --_radius-m: 1.6rem;
  --_radius-pt-m: 1.6rem;
  --_radius-l: 3.8rem;
  --_radius-xl: 6rem;
  --_animspeed-fast: 0.1s;
  --_animspeed-medium: 0.3s;
  --_animspeed-slow: 0.6s;
  --_animbezier: cubic-bezier(0.23, 0.65, 0.74, 1.09);
  /* light color scheme */
  --base--light: #FAF7F6;
  --base-rgb--light: 250, 247, 246;
  --base-tint--light: #FFFFFF;
  --base-shade--light: #e0dddb;
  --base-opp--light: #161616;
  --base-opp-tint--light: #1C1C1C;
  --accent--light: #9F8BE7;
  --accent-rgb--light: 159, 139, 231;
  --additional--light: #DDF160;
  --additional-rgb--light: 221, 241, 96;
  --neutral-transparent--light: rgba(255, 255, 255, 0.3);
  --st-bright--light: #161616;
  --st-medium--light: #7C7C7C;
  --st-muted--light: #E0DDDB;
  --st-opp-bright--light: #FFFFFF;
  --fw-regular--light: 400;
  --fw-medium--light: 600;
  --fw-semibold--light: 700;
  --fw-bold--light: 800;
  --fw-regular-opp--light: 300;
  --fw-medium-opp--light: 500;
  --t-bright--light: #161616;
  --t-medium--light: #303030;
  --t-muted--light: #585858;
  --t-muted-extra--light: #B2AEAD;
  --t-opp-bright--light: #FFFFFF;
  --t-opp-medium--light: #ACACAC;
  --t-opp-muted--light: #838383;
  --bg-demo-screen-01--light: url(../img/demo/screens/01.webp);
  --bg-demo-screen-02--light: url(../img/demo/screens/02.webp);
  --bg-demo-screen-03--light: url(../img/demo/screens/03.webp);
  --bg-demo-screen-04--light: url(../img/demo/screens/04.webp);
  --bg-demo-screen-05--light: url(../img/demo/screens/05.webp);
  --bg-demo-screen-06--light: url(../img/demo/screens/06.webp);
  --bg-demo-screen-07--light: url(../img/demo/screens/07.webp);
  --bg-demo-screen-08--light: url(../img/demo/screens/08.webp);
  --bg-demo-screen-09--light: url(../img/demo/screens/09.webp);
  /* dark color scheme */
  --base--dark: #161616;
  --base-rgb--dark: 22, 22, 22;
  --base-tint--dark: #1C1C1C;
  --base-shade--dark: #0a0a0a;
  --base-opp--dark: #FAF7F6;
  --base-opp-tint--dark: #ffffff;
  --accent--dark: #DDF160;
  --accent-rgb--dark: 221, 241, 96;
  --additional--dark: #9F8BE7;
  --additional-rgb--dark: 159, 139, 231;
  --neutral-transparent--dark: rgba(0, 0, 0, 0.3);
  --st-bright--dark: #FFFFFF;
  --st-medium--dark: #646464;
  --st-muted--dark: #252525;
  --st-opp-bright--dark: #0f0f0f;
  --fw-regular--dark: 300;
  --fw-medium--dark: 500;
  --fw-semibold--dark: 600;
  --fw-bold--dark: 700;
  --fw-regular-opp--dark: 400;
  --fw-medium-opp--dark: 600;
  --t-bright--dark: #FFFFFF;
  --t-medium--dark: #ACACAC;
  --t-muted--dark: #838383;
  --t-muted-extra--dark: #535151;
  --t-opp-bright--dark: #161616;
  --t-opp-medium--dark: #303030;
  --t-opp-muted--dark: #969696;
  --bg-demo-screen-01--dark: url(../img/demo/screens/01-d.webp);
  --bg-demo-screen-02--dark: url(../img/demo/screens/02-d.webp);
  --bg-demo-screen-03--dark: url(../img/demo/screens/03-d.webp);
  --bg-demo-screen-04--dark: url(../img/demo/screens/04-d.webp);
  --bg-demo-screen-05--dark: url(../img/demo/screens/05-d.webp);
  --bg-demo-screen-06--dark: url(../img/demo/screens/06-d.webp);
  --bg-demo-screen-07--dark: url(../img/demo/screens/07-d.webp);
  --bg-demo-screen-08--dark: url(../img/demo/screens/08-d.webp);
  --bg-demo-screen-09--dark: url(../img/demo/screens/09-d.webp);
  /* permanent colors */
  --pt-base: #FFFFFF;
  --pt-base-dark: #161616;
  --pt-t-light-bright: #FFFFFF;
  --pt-t-dark-bright: #161616;
  --pt-st-light-bright: #FFFFFF;
  --pt-st-dark-bright: #161616;
  --pt-purple-rgb: 159, 139, 231;
  --pt-purple-dark-rgb: 33, 10, 113;
  /* neutral colors */
  --nl-white: #ffffff;
  --nl-black: #000000;
}

@media only screen and (min-width: 768px) {
  :root {
    --_radius-m: 2.6rem;
    --_radius-l: 5rem;
    --_radius-xl: 8rem;
  }
}

@media only screen and (min-width: 1200px) {
  :root {
    --_radius-xl: 8rem;
  }
}

/* defaults — dark is the default scheme; light applies only when the user
   explicitly opts in via [color-scheme=light]. This keeps the pre-JS paint dark
   regardless of the OS preference, so there is no light flash on first load. */
:root {
  --base: var(--base--dark);
  --base-rgb: var(--base-rgb--dark);
  --base-tint: var(--base-tint--dark);
  --base-shade: var(--base-shade--dark);
  --base-opp: var(--base-opp--dark);
  --base-opp-tint: var(--base-opp-tint--dark);
  --accent: var(--accent--dark);
  --accent-rgb: var(--accent-rgb--dark);
  --additional: var(--additional--dark);
  --additional-rgb: var(--additional-rgb--dark);
  --neutral-transparent: var(--neutral-transparent--dark);
  --st-bright: var(--st-bright--dark);
  --st-medium: var(--st-medium--dark);
  --fw-semibold: var(--fw-semibold--dark);
  --st-muted: var(--st-muted--dark);
  --st-opp-bright: var(--st-opp-bright--dark);
  --fw-regular: var(--fw-regular--dark);
  --fw-medium: var(--fw-medium--dark);
  --fw-bold: var(--fw-bold--dark);
  --fw-regular-opp: var(--fw-regular-opp--dark);
  --fw-medium-opp: var(--fw-medium-opp--dark);
  --t-bright: var(--t-bright--dark);
  --t-medium: var(--t-medium--dark);
  --t-muted: var(--t-muted--dark);
  --t-muted-extra: var(--t-muted-extra--dark);
  --t-opp-bright: var(--t-opp-bright--dark);
  --t-opp-medium: var(--t-opp-medium--dark);
  --t-opp-muted: var(--t-opp-muted--dark);
  --bg-demo-screen-01: var(--bg-demo-screen-01--dark);
  --bg-demo-screen-02: var(--bg-demo-screen-02--dark);
  --bg-demo-screen-03: var(--bg-demo-screen-03--dark);
  --bg-demo-screen-04: var(--bg-demo-screen-04--dark);
  --bg-demo-screen-05: var(--bg-demo-screen-05--dark);
  --bg-demo-screen-06: var(--bg-demo-screen-06--dark);
  --bg-demo-screen-07: var(--bg-demo-screen-07--dark);
  --bg-demo-screen-08: var(--bg-demo-screen-08--dark);
  --bg-demo-screen-09: var(--bg-demo-screen-09--dark);
}

[color-scheme=light] {
  --base: var(--base--light);
  --base-rgb: var(--base-rgb--light);
  --base-tint: var(--base-tint--light);
  --base-shade: var(--base-shade--light);
  --base-opp: var(--base-opp--light);
  --base-opp-tint: var(--base-opp-tint--light);
  --accent: var(--accent--light);
  --accent-rgb: var(--accent-rgb--light);
  --additional: var(--additional--light);
  --additional-rgb: var(--additional-rgb--light);
  --neutral-transparent: var(--neutral-transparent--light);
  --st-bright: var(--st-bright--light);
  --st-medium: var(--st-medium--light);
  --st-muted: var(--st-muted--light);
  --st-opp-bright: var(--st-opp-bright--light);
  --fw-regular: var(--fw-regular--light);
  --fw-medium: var(--fw-medium--light);
  --fw-semibold: var(--fw-semibold--light);
  --fw-bold: var(--fw-bold--light);
  --fw-regular-opp: var(--fw-regular-opp--light);
  --fw-medium-opp: var(--fw-medium-opp--light);
  --t-bright: var(--t-bright--light);
  --t-medium: var(--t-medium--light);
  --t-muted: var(--t-muted--light);
  --t-muted-extra: var(--t-muted-extra--light);
  --t-opp-bright: var(--t-opp-bright--light);
  --t-opp-medium: var(--t-opp-medium--light);
  --t-opp-muted: var(--t-opp-muted--light);
  --bg-demo-screen-01: var(--bg-demo-screen-01--light);
  --bg-demo-screen-02: var(--bg-demo-screen-02--light);
  --bg-demo-screen-03: var(--bg-demo-screen-03--light);
  --bg-demo-screen-04: var(--bg-demo-screen-04--light);
  --bg-demo-screen-05: var(--bg-demo-screen-05--light);
  --bg-demo-screen-06: var(--bg-demo-screen-06--light);
  --bg-demo-screen-07: var(--bg-demo-screen-07--light);
  --bg-demo-screen-08: var(--bg-demo-screen-08--light);
  --bg-demo-screen-09: var(--bg-demo-screen-09--light);
}

[color-scheme=dark] {
  --base: var(--base--dark);
  --base-rgb: var(--base-rgb--dark);
  --base-tint: var(--base-tint--dark);
  --base-shade: var(--base-shade--dark);
  --base-opp: var(--base-opp--dark);
  --base-opp-tint: var(--base-opp-tint--dark);
  --accent: var(--accent--dark);
  --accent-rgb: var(--accent-rgb--dark);
  --additional: var(--additional--dark);
  --additional-rgb: var(--additional-rgb--dark);
  --neutral-transparent: var(--neutral-transparent--dark);
  --st-bright: var(--st-bright--dark);
  --st-medium: var(--st-medium--dark);
  --st-muted: var(--st-muted--dark);
  --st-opp-bright: var(--st-opp-bright--dark);
  --fw-regular: var(--fw-regular--dark);
  --fw-medium: var(--fw-medium--dark);
  --fw-semibold: var(--fw-semibold--dark);
  --fw-bold: var(--fw-bold--dark);
  --fw-regular-opp: var(--fw-regular-opp--dark);
  --fw-medium-opp: var(--fw-medium-opp--dark);
  --t-bright: var(--t-bright--dark);
  --t-medium: var(--t-medium--dark);
  --t-muted: var(--t-muted--dark);
  --t-muted-extra: var(--t-muted-extra--dark);
  --t-opp-bright: var(--t-opp-bright--dark);
  --t-opp-medium: var(--t-opp-medium--dark);
  --t-opp-muted: var(--t-opp-muted--dark);
  --bg-demo-screen-01: var(--bg-demo-screen-01--dark);
  --bg-demo-screen-02: var(--bg-demo-screen-02--dark);
  --bg-demo-screen-03: var(--bg-demo-screen-03--dark);
  --bg-demo-screen-04: var(--bg-demo-screen-04--dark);
  --bg-demo-screen-05: var(--bg-demo-screen-05--dark);
  --bg-demo-screen-06: var(--bg-demo-screen-06--dark);
  --bg-demo-screen-07: var(--bg-demo-screen-07--dark);
  --bg-demo-screen-08: var(--bg-demo-screen-08--dark);
  --bg-demo-screen-09: var(--bg-demo-screen-09--dark);
}

/* ------------------------------------------------*/
/* Variables End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Template Backgrounds Start */
/* ------------------------------------------------*/
.about-image-1 {
  background-image: url(../img/hero/cinematic-production.jpg);
}

.divider-image-1 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-2 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-3 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-4 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-5 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-6 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-7 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-8 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-9 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.divider-image-10 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.mxd-promo__bg {
  background-image: url(../img/hero/film-camera.jpg);
}

.preview-image-1 {
  background-image: url(https://img.youtube.com/vi/05-DxbIdICI/maxresdefault.jpg);
}

.preview-image-2 {
  background-image: url(https://img.youtube.com/vi/Yg1V54WjjWI/maxresdefault.jpg);
}

.preview-image-3 {
  background-image: url(../img/portfolio/candyman-storybook.jpg);
}

.preview-image-4 {
  background-image: url(https://img.youtube.com/vi/L6W9-BjVgNA/maxresdefault.jpg);
}

.preview-image-5 {
  background-image: url(https://img.youtube.com/vi/74iJQoDSka8/maxresdefault.jpg);
}

.preview-image-6 {
  background-image: url(../img/portfolio/chings-chilli-oil.jpg);
}

.preview-image-7 {
  background-image: url(../img/portfolio/goodday-multilingual.jpg);
}

.blog-preview-image-1 {
  background-image: url(../img/blog/lipsync-pipeline.jpg);
}

.blog-preview-image-2 {
  background-image: url(../img/blog/broadcast-films.jpg);
}

.blog-preview-image-3 {
  background-image: url(../img/blog/webgl-performance.jpg);
}

.headline-img-01::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-02::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-03::after {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-04::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-05::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-06::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.headline-img-07::before {
  background-image: url(../img/hero/film-camera.jpg);
}

.image-values-1 {
  background-image: url(../img/portfolio/film-production.jpg);
}

.image-values-2 {
  background-image: url(../img/portfolio/broadcast-studio.jpg);
}

.prj-details-img-01 {
  background-image: url(../img/hero/divider-cta.jpg);
}

.prj-details-img-02 {
  background-image: url(../img/hero/divider-cta.jpg);
}

/* ------------------------------------------------*/
/* Template Backgrounds End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Basic Styles Start */
/* ------------------------------------------------*/
*,
*::before,
*::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

button:active,
button:focus {
  outline: none !important;
}

button::-moz-focus-inner {
  border: 0 !important;
}

input::-moz-focus-inner {
  border: 0 !important;
}

[type=search]::-webkit-search-cancel-button,
[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
  appearance: none;
}

a:focus,
button:focus,
input:focus,
textarea:focus {
  -webkit-tap-highlight-color: transparent;
}

input,
textarea,
button,
select,
a {
  -webkit-tap-highlight-color: transparent;
}

::-moz-selection {
  background-color: var(--accent);
  color: var(--t-opp-bright);
  text-shadow: none;
}

::selection {
  background-color: var(--accent);
  color: var(--t-opp-bright);
  text-shadow: none;
}

::-webkit-scrollbar {
  display: none;
  width: 6px;
  background: var(--base-shade);
}

@media only screen and (min-width: 768px) {
  ::-webkit-scrollbar {
    display: block;
  }
}

::-webkit-scrollbar-track {
  background-color: var(--base-shade);
}

::-webkit-scrollbar-thumb {
  background-color: var(--accent);
  border-radius: var(--_radius-s);
}

html {
  width: 100%;
  height: 100%;
  font-family: sans-serif;
  font-size: 62.5%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  position: relative;
  width: 100%;
  min-width: 360px;
  overflow-x: unset !important;
  font: normal 400 var(--_size)/1.6 var(--_font-default);
  text-rendering: optimizeLegibility;
  background-color: var(--base);
  color: var(--t-medium);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

section {
  position: relative;
  width: 100%;
  min-width: 360px;
}

a {
  text-decoration: none;
  outline: 0;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

img {
  display: block;
  width: 100%;
  height: auto;
}

.overflow-hidden {
  overflow: hidden !important;
}

.components {
  position: relative;
}

.components__item {
  position: relative;
  padding: 8rem 10%;
  border-bottom: 1px solid var(--st-muted);
}

.components__item.no-padding {
  padding: 0;
}

.components__caption {
  display: block;
  font: normal 400 1.3rem/1 var(--_font-default);
  color: var(--t-medium);
  text-transform: uppercase;
  letter-spacing: 0.1rem;
  margin-bottom: 2rem;
}

.width-50-desktop {
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .width-50-desktop {
    width: 50%;
  }
}

.mxd-spacer {
  position: relative;
  width: 100%;
  height: 100px;
}

html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  -ms-scroll-chaining: none;
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* ------------------------------------------------*/
/* Basic Styles End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Page Structure Start */
/* ------------------------------------------------*/
.mxd-page-content {
  position: relative;
}

.mxd-page-content.inner-page-content {
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-page-content.inner-page-content {
    padding-top: 9.6rem;
  }
}

.mxd-wrapper {
  position: relative;
  width: 100%;
  min-width: 360px;
}

.mxd-wrapper.mxd-wrapper-opposite {
  background-color: var(--base-opp);
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

.mxd-wrapper.padding-top-pre-title {
  padding-top: 13rem;
}

.mxd-wrapper.margin-bottom-pre-title {
  margin-bottom: 13rem;
}

@media only screen and (min-width: 768px) {
  .mxd-wrapper.padding-top-pre-title {
    padding-top: 14.3rem;
  }

  .mxd-wrapper.margin-bottom-pre-title {
    margin-bottom: 14.3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-wrapper.padding-top-pre-title {
    padding-top: 18.3rem;
  }

  .mxd-wrapper.margin-bottom-pre-title {
    margin-bottom: 18.3rem;
  }
}

.mxd-section {
  position: relative;
  width: 100%;
  min-width: 360px;
}

.mxd-section.padding-blog-default-pre-grid {
  padding-bottom: 3rem;
}

.mxd-section.padding-blog-descr-pre-grid {
  padding-bottom: 2.2rem;
}

.mxd-section.padding-default {
  padding-bottom: 8rem;
}

.mxd-section.padding-default.mobile-title {
  padding-bottom: 8rem;
}

.mxd-section.padding-pre-footer {
  padding-bottom: 11rem;
}

.mxd-section.padding-pre-pinned-img {
  padding-bottom: 14rem;
}

.mxd-section.padding-pre-grid {
  padding-bottom: 11rem;
}

.mxd-section.padding-pre-grid.mobile-grid-s {
  padding-bottom: 12.5rem;
}

.mxd-section.padding-pre-grid.mobile-grid-title {
  padding-bottom: 10rem;
}

.mxd-section.padding-pre-title {
  padding-bottom: 13rem;
}

.mxd-section.padding-pre-manifest {
  padding-bottom: 13.7rem;
}

.mxd-section.padding-pre-manifest.mobile-point-subtitle {
  padding-bottom: 13.7rem;
}

.mxd-section.padding-pre-stack {
  padding-bottom: 11rem;
}

.mxd-section.padding-stacked-section {
  padding-bottom: 10.1rem;
}

.mxd-section.padding-stacked-pre-mtext {
  padding-bottom: 8.1rem;
}

.mxd-section.padding-grid-pre-pinned {
  padding-bottom: 13rem;
}

.mxd-section.padding-grid-pre-mtext {
  padding-bottom: 11.3rem;
}

.mxd-section.padding-pinned-img-pre-mtext {
  padding-bottom: 10.4rem;
}

.mxd-section.padding-mtext {
  padding-bottom: 12.6rem;
}

.mxd-section.padding-mtext.mobile-title {
  padding-bottom: 11.6rem;
}

.mxd-section.padding-mtext-pre-title {
  padding-bottom: 11.6rem;
}

.mxd-section.padding-mtext-pre-grid {
  padding-bottom: 9.8rem;
}

.mxd-section.padding-mtext-pre-grid.mobile-grid-s {
  padding-bottom: 11.3rem;
}

.mxd-section.padding-mtext-pre-pinned {
  padding-bottom: 10.8rem;
}

.mxd-section.padding-mtext-pre-stack {
  padding-bottom: 2rem;
}

.mxd-section.padding-blog {
  padding-bottom: 8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section.padding-default {
    padding-bottom: 9rem;
  }

  .mxd-section.padding-default.mobile-title {
    padding-bottom: 9rem;
  }

  .mxd-section.padding-pre-footer {
    padding-bottom: 10.7rem;
  }

  .mxd-section.padding-pre-pinned-img {
    padding-bottom: 16rem;
  }

  .mxd-section.padding-pre-grid {
    padding-bottom: 13rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-s {
    padding-bottom: 13rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-title {
    padding-bottom: 11.3rem;
  }

  .mxd-section.padding-pre-title {
    padding-bottom: 14.3rem;
  }

  .mxd-section.padding-pre-manifest {
    padding-bottom: 13.9rem;
  }

  .mxd-section.padding-pre-manifest.mobile-point-subtitle {
    padding-bottom: 15.7rem;
  }

  .mxd-section.padding-pre-stack {
    padding-bottom: 10rem;
  }

  .mxd-section.padding-stacked-section {
    padding-bottom: 11.3rem;
  }

  .mxd-section.padding-stacked-pre-mtext {
    padding-bottom: 7.3rem;
  }

  .mxd-section.padding-grid-pre-pinned {
    padding-bottom: 14.3rem;
  }

  .mxd-section.padding-grid-pre-mtext {
    padding-bottom: 10.4rem;
  }

  .mxd-section.padding-pinned-img-pre-mtext {
    padding-bottom: 10rem;
  }

  .mxd-section.padding-mtext {
    padding-bottom: 13.4rem;
  }

  .mxd-section.padding-mtext.mobile-title {
    padding-bottom: 11.6rem;
  }

  .mxd-section.padding-mtext-pre-title {
    padding-bottom: 11.6rem;
  }

  .mxd-section.padding-mtext-pre-grid {
    padding-bottom: 10.6rem;
  }

  .mxd-section.padding-mtext-pre-grid.mobile-grid-s {
    padding-bottom: 10.6rem;
  }

  .mxd-section.padding-mtext-pre-pinned {
    padding-bottom: 10.8rem;
  }

  .mxd-section.padding-mtext-pre-stack {
    padding-bottom: 0;
  }

  .mxd-section.padding-blog {
    padding-bottom: 9rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-section.padding-pre-footer {
    padding-bottom: 8.7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section.padding-blog-default-pre-grid {
    padding-bottom: 9rem;
  }

  .mxd-section.padding-blog-descr-pre-grid {
    padding-bottom: 7.2rem;
  }

  .mxd-section.padding-default {
    padding-bottom: 9rem;
  }

  .mxd-section.padding-default.mobile-title {
    padding-bottom: 9rem;
  }

  .mxd-section.padding-pre-footer {
    padding-bottom: 7.2rem;
  }

  .mxd-section.padding-pre-pinned-img {
    padding-bottom: 10rem;
  }

  .mxd-section.padding-pre-grid {
    padding-bottom: 13rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-s {
    padding-bottom: 13rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-title {
    padding-bottom: 13rem;
  }

  .mxd-section.padding-pre-title {
    padding-bottom: 14.3rem;
  }

  .mxd-section.padding-pre-manifest {
    padding-bottom: 13.9rem;
  }

  .mxd-section.padding-pre-manifest.mobile-point-subtitle {
    padding-bottom: 13.9rem;
  }

  .mxd-section.padding-pre-stack {
    padding-bottom: 10rem;
  }

  .mxd-section.padding-grid-pre-pinned {
    padding-bottom: 10rem;
  }

  .mxd-section.padding-grid-pre-mtext {
    padding-bottom: 10.4rem;
  }

  .mxd-section.padding-pinned-img-pre-mtext {
    padding-bottom: 4.3rem;
  }

  .mxd-section.padding-mtext {
    padding-bottom: 13.4rem;
  }

  .mxd-section.padding-mtext.mobile-title {
    padding-bottom: 13.4rem;
  }

  .mxd-section.padding-mtext-pre-pinned {
    padding-bottom: 7.6rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-section.padding-pre-footer {
    padding-bottom: 5.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section.padding-blog-default-pre-grid {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-default {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-default.mobile-title {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-pre-footer {
    padding-bottom: 6rem;
  }

  .mxd-section.padding-pre-pinned-img {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-pre-grid {
    padding-bottom: 17rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-s {
    padding-bottom: 17rem;
  }

  .mxd-section.padding-pre-grid.mobile-grid-title {
    padding-bottom: 17rem;
  }

  .mxd-section.padding-pre-title {
    padding-bottom: 18.3rem;
  }

  .mxd-section.padding-pre-manifest {
    padding-bottom: 17.9rem;
  }

  .mxd-section.padding-pre-manifest.mobile-point-subtitle {
    padding-bottom: 17.9rem;
  }

  .mxd-section.padding-pre-stack {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-stacked-section {
    padding-bottom: 12.3rem;
  }

  .mxd-section.padding-stacked-pre-mtext {
    padding-bottom: 8.3rem;
  }

  .mxd-section.padding-grid-pre-pinned {
    padding-bottom: 11rem;
  }

  .mxd-section.padding-grid-pre-mtext {
    padding-bottom: 14.4rem;
  }

  .mxd-section.padding-pinned-img-pre-mtext {
    padding-bottom: 5.3rem;
  }

  .mxd-section.padding-mtext {
    padding-bottom: 17.3rem;
  }

  .mxd-section.padding-mtext.mobile-title {
    padding-bottom: 17.3rem;
  }

  .mxd-section.padding-mtext-pre-title {
    padding-bottom: 15.6rem;
  }

  .mxd-section.padding-mtext-pre-grid {
    padding-bottom: 14.6rem;
  }

  .mxd-section.padding-mtext-pre-grid.mobile-grid-s {
    padding-bottom: 14.6rem;
  }

  .mxd-section.padding-mtext-pre-pinned {
    padding-bottom: 5.6rem;
  }

  .mxd-section.padding-mtext-pre-stack {
    padding-bottom: 3.7rem;
  }

  .mxd-section.padding-blog {
    padding-bottom: 11rem;
  }
}

.mxd-section.padding-hero-07 {
  padding-top: 14rem;
}

.mxd-section.padding-hero-09,
.mxd-section.padding-hero-06 {
  padding-top: 13rem;
}

.mxd-section.padding-hero-08 {
  padding-top: 3.4rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section.padding-hero-07 {
    padding-top: 16rem;
  }

  .mxd-section.padding-hero-09,
  .mxd-section.padding-hero-06 {
    padding-top: 13.8rem;
  }

  .mxd-section.padding-hero-08 {
    padding-top: 2.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section.padding-hero-01 {
    padding-top: 12rem;
  }

  .mxd-section.padding-hero-07 {
    padding-top: 12rem;
  }

  .mxd-section.padding-hero-09 {
    padding-top: 6rem;
  }

  .mxd-section.padding-hero-06 {
    padding-top: 5.4rem;
  }

  .mxd-section.padding-hero-08 {
    padding-top: 0rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section.padding-hero-01 {
    padding-top: 16rem;
  }

  .mxd-section.padding-hero-07 {
    padding-top: 16rem;
  }

  .mxd-section.padding-hero-06 {
    padding-top: 6.4rem;
  }

  .mxd-section.padding-hero-09 {
    padding-top: 7rem;
  }
}

.mxd-section-inner-headline {
  padding-top: 13rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-inner-headline {
    padding-top: 15rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-inner-headline {
    padding-top: 13.6rem;
  }

  .mxd-section-inner-headline.grid-headline {
    padding-top: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-inner-headline {
    padding-top: 17rem;
  }

  .mxd-section-inner-headline.grid-headline {
    padding-top: 20rem;
  }
}

.mxd-section-inner-headline.padding-default {
  padding-bottom: 14rem;
}

.mxd-section-inner-headline.padding-headline-pre-block {
  padding-bottom: 13rem;
}

.mxd-section-inner-headline.padding-headline-pre-grid {
  padding-bottom: 10rem;
}

.mxd-section-inner-headline.padding-s-headline-pre-grid {
  padding-bottom: 2rem;
}

.mxd-section-inner-headline.padding-headline-pre-stack {
  padding-bottom: 2.3rem;
}

.mxd-section-inner-headline.padding-text-pre-block {
  padding-bottom: 13rem;
}

.mxd-section-inner-headline.padding-s-text-pre-block {
  padding-bottom: 4.9rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-inner-headline.padding-default {
    padding-bottom: 16rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-block {
    padding-bottom: 14.6rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-grid {
    padding-bottom: 11.6rem;
  }

  .mxd-section-inner-headline.padding-s-headline-pre-grid {
    padding-bottom: 3.6rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-stack {
    padding-bottom: 1rem;
  }

  .mxd-section-inner-headline.padding-text-pre-block {
    padding-bottom: 14.8rem;
  }

  .mxd-section-inner-headline.padding-s-text-pre-form {
    padding-bottom: 0;
  }

  .mxd-section-inner-headline.padding-s-text-pre-block {
    padding-bottom: 6.9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-inner-headline.padding-headline-pre-block {
    padding-bottom: 14.2rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-grid {
    padding-bottom: 11.2rem;
  }

  .mxd-section-inner-headline.padding-s-headline-pre-grid {
    padding-bottom: 3.2rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-stack {
    padding-bottom: 0.6rem;
  }

  .mxd-section-inner-headline.padding-s-text-pre-form {
    padding-bottom: 3.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-inner-headline.padding-default {
    padding-bottom: 20rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-block {
    padding-bottom: 18rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-grid {
    padding-bottom: 15rem;
  }

  .mxd-section-inner-headline.padding-s-headline-pre-grid {
    padding-bottom: 4.9rem;
  }

  .mxd-section-inner-headline.padding-headline-pre-stack {
    padding-bottom: 4.4rem;
  }

  .mxd-section-inner-headline.padding-text-pre-block {
    padding-bottom: 18.7rem;
  }

  .mxd-section-inner-headline.padding-s-text-pre-form {
    padding-bottom: 3rem;
  }

  .mxd-section-inner-headline.padding-s-text-pre-block {
    padding-bottom: 8.8rem;
  }
}

.mxd-section-fullscreen {
  width: 100%;
  height: 100vh;
  padding-top: 7.6rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-section-fullscreen {
    padding-top: 9.6rem;
  }
}

.mxd-container {
  position: relative;
  width: 100%;
  max-width: 1920px;
  padding: 0 3rem;
  margin: 0 auto;
}

.mxd-container.fullwidth-container {
  max-width: none;
  padding: 0;
}

.mxd-container.fullscreen-container {
  height: 100%;
}

.mxd-container.no-padding-container {
  padding: 0;
  overflow: hidden;
}

.mxd-container.grid-container {
  padding: 0 1.5rem;
}

.mxd-container.grid-l-container {
  padding: 0 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-container {
    padding: 0 6rem;
  }

  .mxd-container.grid-container {
    padding: 0 4.5rem;
  }

  .mxd-container.grid-l-container {
    padding: 0 4.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-container.grid-container.no-padding-right {
    padding-right: 0;
  }

  .mxd-container.grid-l-container {
    padding: 0 3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-container {
    padding: 0 9rem;
  }

  .mxd-container.grid-container {
    padding: 0 7.5rem;
  }

  .mxd-container.grid-l-container {
    padding: 0 4.5rem;
  }
}

.mxd-container__circle {
  z-index: 2;
  position: relative;
  margin-bottom: -10rem;
  text-align: center;
}

@media only screen and (min-width: 1200px) {
  .mxd-container__circle {
    margin-bottom: 0;
    position: absolute;
    top: -10rem;
    right: 12rem;
  }

  .mxd-container__circle.circle-fit {
    right: 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-container__circle {
    right: 18rem;
  }

  .mxd-container__circle.circle-fit {
    right: 9rem;
  }
}

.mxd-grid-item {
  padding: 0 1.5rem;
  margin-top: 3rem;
}

.mxd-grid-item.no-margin {
  margin: 0;
}

.mxd-grid-item.no-margin-desktop {
  margin-top: 3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-grid-item.no-margin-desktop {
    margin: 0;
  }
}

.mxd-grid-item-l {
  padding: 0 1.5rem;
  margin-top: 3rem;
}

.mxd-grid-item-l.no-margin {
  margin: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-grid-item-l {
    padding: 0 3rem;
  }
}

.mxd-block {
  position: relative;
}

.mxd-block.pre-stack-block {
  margin-bottom: -3rem;
  z-index: 1;
}

.mxd-block.fullscreen-block {
  height: 100%;
}

.mxd-block.absolute-centered-block {
  position: absolute;
  left: 0;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

@media only screen and (min-width: 768px) {
  .mxd-block.pre-stack-block {
    margin-bottom: -6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-block.pre-stack-block {
    margin-bottom: -9rem;
  }
}

.mxd-block__image {
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
  overflow: hidden;
  margin-bottom: 3.8rem;
}

.mxd-block__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-block__image {
    height: 600px;
    margin-bottom: 4.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-block__image {
    height: 100%;
  }
}

.mxd-block__name {
  position: relative;
}

.mxd-block__name.name-manifest {
  margin-bottom: 2.8rem;
  padding-top: 0;
}

.mxd-block__name.name-inner-headline {
  margin-bottom: 0.2rem;
}

.mxd-block__name.name-project-link {
  margin-top: 0;
  margin-bottom: 0.1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-block__name.name-manifest {
    margin-bottom: 3.2rem;
  }

  .mxd-block__name.name-inner-headline {
    margin-bottom: 0.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-block__name.name-manifest {
    margin-bottom: 0;
    padding-top: 1.5rem;
  }

  .mxd-block__name.name-inner-headline {
    margin-bottom: 0;
    margin-top: 2rem;
  }

  .mxd-block__name.name-project-link {
    margin-top: 1.3rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-block__name.name-inner-headline {
    margin-top: 2.6rem;
  }

  .mxd-block__name.name-project-link {
    margin-top: 2rem;
  }
}

.mxd-block__content.content-flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-block__content.content-flex {
    gap: 9rem;
  }
}

.inner-headline__title {
  position: relative;
}

.inner-headline__title.headline-img-before::before {
  content: "";
  display: inline-block;
  width: 8rem;
  height: 4.3rem;
  -moz-border-radius: 4.2rem;
  border-radius: 4.2rem;
  margin-right: 1.6rem;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

.inner-headline__title.headline-img-after::after {
  content: "";
  display: inline-block;
  width: 8rem;
  height: 4.3rem;
  -moz-border-radius: 4.2rem;
  border-radius: 4.2rem;
  margin-left: 1.6rem;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

@media only screen and (min-width: 768px) {
  .inner-headline__title.headline-img-before::before {
    width: 11rem;
    height: 5.8rem;
    margin-right: 2.2rem;
  }

  .inner-headline__title.headline-img-after::after {
    width: 11rem;
    height: 5.8rem;
    margin-left: 2.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .inner-headline__title.headline-img-before::before {
    width: 14rem;
    height: 7rem;
    margin-right: 2.6rem;
  }

  .inner-headline__title.headline-img-after::after {
    width: 14rem;
    height: 7rem;
    margin-left: 2.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__title.headline-img-before::before {
    width: 16rem;
    height: 8.4rem;
    margin-right: 3.3rem;
  }

  .inner-headline__title.headline-img-after::after {
    width: 16rem;
    height: 8.4rem;
    margin-left: 3.3rem;
  }
}

/* ---------------------------------------------------------------- */
/* Headline "develop" — diffusion denoise pill                       */
/* The image resolves out of grain/blur as --rz tweens 1 -> 0 (JS).  */
/* Static / no-JS / reduced-motion fallback is the crisp frame.      */
/* ---------------------------------------------------------------- */
.hl-resolve {
  --rz: 0;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 8rem;
  height: 4.3rem;
  margin-right: 1.6rem;
  border-radius: 4.2rem;
  overflow: hidden;
  isolation: isolate;
  /* nudge optically onto the cap-height of the headline */
  transform: translateY(-0.4rem);
}

.hl-resolve__img,
.hl-resolve__grain,
.hl-resolve__scan {
  position: absolute;
  inset: 0;
  border-radius: inherit;
}

/* The actual frame — blur + scale + desaturation lift as it resolves */
.hl-resolve__img {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transform: scale(calc(1 + var(--rz) * 0.07));
  filter:
    blur(calc(var(--rz) * 16px))
    saturate(calc(1 - var(--rz) * 0.85))
    contrast(calc(1 + var(--rz) * 0.25))
    brightness(calc(1 + var(--rz) * 0.04));
  will-change: filter, transform;
}

/* Animated fractal noise — the "denoise" that burns off */
.hl-resolve__grain {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  mix-blend-mode: overlay;
  opacity: calc(var(--rz) * 0.95);
  animation: hl-grain-shift 0.5s steps(4) infinite;
  will-change: opacity, background-position;
}

/* A single processing sweep that passes once as it settles */
.hl-resolve__scan {
  background: linear-gradient(
    105deg,
    transparent 38%,
    rgba(255, 255, 255, 0.55) 50%,
    transparent 62%
  );
  background-size: 260% 100%;
  background-position: calc(var(--rz) * 130% - 15%) 0;
  opacity: calc(var(--rz) * 0.9);
  mix-blend-mode: screen;
}

@keyframes hl-grain-shift {
  0%   { background-position: 0 0; }
  25%  { background-position: -40px 30px; }
  50%  { background-position: 50px -20px; }
  75%  { background-position: -30px -40px; }
  100% { background-position: 0 0; }
}

/* Once resolved, drop the looping layers so nothing keeps animating */
.hl-resolve.is-done .hl-resolve__grain,
.hl-resolve.is-done .hl-resolve__scan {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .hl-resolve__grain,
  .hl-resolve__scan {
    display: none;
  }
}

@media only screen and (min-width: 768px) {
  .hl-resolve {
    width: 11rem;
    height: 5.8rem;
    margin-right: 2.2rem;
    transform: translateY(-0.5rem);
  }
}

@media only screen and (min-width: 1200px) {
  .hl-resolve {
    width: 14rem;
    height: 7rem;
    margin-right: 2.6rem;
    transform: translateY(-0.7rem);
  }
}

@media only screen and (min-width: 1600px) {
  .hl-resolve {
    width: 16rem;
    height: 8.4rem;
    margin-right: 3.3rem;
    transform: translateY(-0.9rem);
  }
}

.inner-headline__descr {
  margin-top: 3.8rem;
}

@media only screen and (min-width: 1200px) {
  .inner-headline__descr {
    margin-top: 1.8rem;
    padding-left: 3rem;
    max-width: 560px;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__descr {
    margin-top: 2rem;
    max-width: 620px;
  }
}

.inner-headline__text {
  margin-top: 3.3rem;
}

@media only screen and (min-width: 768px) {
  .inner-headline__text {
    margin-top: 4.9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .inner-headline__text {
    margin-top: 4.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__text {
    margin-top: 5.9rem;
  }
}

.inner-headline__paragraph {
  margin-top: 3.8rem;
}

@media only screen and (min-width: 768px) {
  .inner-headline__paragraph {
    margin-top: 3.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .inner-headline__paragraph {
    margin-top: 4.1rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__paragraph {
    margin-top: 4.5rem;
  }
}

.inner-headline__data {
  margin-top: 4.4rem;
}

@media only screen and (min-width: 1200px) {
  .inner-headline__data {
    margin-top: 5.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__data {
    margin-top: 6.1rem;
  }
}

.inner-headline__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 5.5rem;
}

@media only screen and (min-width: 768px) {
  .inner-headline__tags {
    margin-top: 5.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .inner-headline__tags {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    gap: 1rem;
    height: 100%;
    margin-top: 0;
  }

  .inner-headline__tags .tag {
    -ms-flex-item-align: end;
    align-self: flex-end;
  }
}

.inner-headline__blogtags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 4.9rem;
}

@media only screen and (min-width: 1200px) {
  .inner-headline__blogtags {
    margin-top: 5.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__blogtags {
    margin-top: 5.9rem;
  }
}

.inner-headline__breadcrumbs {
  margin-top: 4.9rem;
}

@media only screen and (min-width: 1200px) {
  .inner-headline__breadcrumbs {
    margin-top: 5.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .inner-headline__breadcrumbs {
    margin-top: 5.9rem;
  }
}

.mxd-block__decoration {
  display: block;
  width: 7rem;
  height: auto;
}

.mxd-block__manifest.centered {
  text-align: center;
}

.mxd-manifest__controls {
  margin-top: 4.4rem;
}

@media only screen and (min-width: 768px) {
  .mxd-manifest__controls {
    margin-top: 5rem;
  }
}

.mxd-block__paragraph {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2rem;
  margin-top: 1.8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-block__paragraph {
    margin-top: 1.3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-block__paragraph {
    margin-top: 0.4rem;
    gap: 3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-block__paragraph {
    max-width: 855px;
  }
}

.mxd-paragraph__lists-item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.2rem;
  margin-bottom: 2.1rem;
}

.mxd-paragraph__lists-item:last-of-type {
  margin-bottom: 0;
}

.mxd-paragraph__lists-item ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-paragraph__lists-item ul li {
  display: block;
  font: normal var(--fw-regular) 1.8rem/1.4 var(--_font-accent);
}

.mxd-paragraph__lists-item ul li a {
  font: normal var(--fw-regular) 1.8rem/1.4 var(--_font-accent);
  color: var(--t-medium);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .mxd-paragraph__lists-item ul li a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

@media only screen and (min-width: 1200px) {
  .mxd-paragraph__lists-item {
    gap: 1.8rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-paragraph__lists-item ul li a {
    font-size: 1.8rem;
  }
}

.mxd-paragraph__controls {
  margin-top: 1.3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-paragraph__controls {
    margin-top: 1.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-paragraph__controls {
    margin-top: 1.7rem;
  }
}

.mxd-paragraph__client {
  margin-top: 0.2rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-paragraph__client {
    margin-top: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-paragraph__client {
    margin-top: 0.2rem;
  }
}

.mxd-pinned-fullscreen {
  position: relative;
}

.mxd-pinned-fullscreen__static {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 1;
}

.mxd-pinned-fullscreen__scroll {
  width: 100%;
  position: relative;
  top: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 20vh;
  z-index: 3;
}

.mxd-pinned-fullscreen__scroll p {
  font-size: 30rem;
}

.mxd-pinned-fullscreen__tl-trigger {
  position: absolute;
  right: 0;
  bottom: 30vh;
  width: 1px;
  height: 1px;
}

/* ------------------------------------------------*/
/* Elements - Page Structure End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Typography Start */
/* ------------------------------------------------*/
h1 {
  font: normal var(--fw-medium) 6rem/1.1 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  h1 {
    font-size: 8rem;
  }

  h1.h1-small {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1200px) {
  h1 {
    font-size: 10rem;
  }

  h1.h1-small {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1400px) {
  h1.h1-small {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1600px) {
  h1 {
    font-size: 12rem;
  }

  h1.h1-small {
    font-size: 9rem;
  }
}

.typed-cursor {
  color: var(--accent);
}

h2 {
  font: normal var(--fw-medium) 4.4rem/1.1 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

h2.opposite {
  color: var(--t-opp-bright);
}

h2.permanent-light {
  color: var(--pt-t-light-bright);
}

h2.permanent-dark {
  color: var(--pt-t-dark-bright);
}

@media only screen and (min-width: 768px) {
  h2 {
    font-size: 7rem;
  }

  h2.h2-small {
    font-size: 5rem;
  }

  h2.h2-large {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1600px) {
  h2 {
    font-size: 7rem;
  }

  h2.h2-small {
    font-size: 7rem;
  }

  h2.h2-large {
    font-size: 12rem;
  }
}

h3 {
  font: normal var(--fw-medium) 3.6rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

h3.opposite {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 768px) {
  h3 {
    font-size: 5rem;
  }
}

h4 {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {
  h4 {
    font-size: 4.4rem;
  }
}

h5 {
  font: normal var(--fw-medium) 2.6rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

h5 small {
  display: block;
  font: normal var(--fw-regular) 1.6rem/1.2 var(--_font-accent);
  color: var(--t-medium);
  margin-top: 0.2rem;
}

h5 a {
  color: var(--t-bright);
}

h5.opposite {
  color: var(--t-opp-bright);
}

h5.opposite a {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 768px) {
  h5 {
    font-size: 3.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  h5 small {
    font-size: 1.8rem;
  }
}

h6 {
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

h6 a {
  color: var(--t-bright);
}

h6.opposite {
  color: var(--t-opp-bright);
}

h6.opposite a {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 1200px) {
  h6 {
    font-size: 3rem;
  }
}

p {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

p span,
p a {
  color: var(--t-bright);
}

p span {
  font-weight: var(--fw-semibold);
}

p a {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-medium)), to(var(--t-medium))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-medium), var(--t-medium)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-medium), var(--t-medium)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

p a.opposite {
  background: -webkit-gradient(linear, left top, right top, from(var(--t-opp-medium)), to(var(--t-opp-medium))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-opp-medium), var(--t-opp-medium)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-opp-medium), var(--t-opp-medium)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
}

.no-touch p a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.no-touch p a:hover.opposite {
  color: var(--t-opp-bright);
}

p.t-120 {
  line-height: 1.2;
}

p.t-140 {
  line-height: 1.4;
}

p.t-xsmall {
  font-size: 1.4rem;
  line-height: 1.2;
}

p.t-small {
  font-size: 1.6rem;
}

p.t-small-mobile {
  font-size: 1.6rem;
}

p.t-large {
  font-family: var(--_font-accent);
  font-size: 2.5rem;
  color: var(--t-bright);
}

p.t-caption {
  line-height: 1.4;
  font-weight: var(--fw-medium);
}

p.t-muted {
  color: var(--t-muted);
}

p.t-muted span {
  color: var(--t-medium);
}

p.t-muted a {
  font-weight: var(--fw-regular);
  color: var(--t-muted);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch p.t-muted a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

p.t-muted a.no-effect {
  background: none;
}

p.t-opposite {
  color: var(--t-opp-bright);
}

p.t-opposite-medium {
  color: var(--t-opp-medium);
}

p.t-opposite-medium a {
  color: var(--t-opp-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-opp-medium)), to(var(--t-opp-medium))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-opp-medium), var(--t-opp-medium)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-opp-medium), var(--t-opp-medium)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch p.t-opposite-medium a:hover {
  color: var(--t-opp-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

p.t-bright {
  color: var(--t-bright);
}

p.t-bright.opposite {
  color: var(--t-opp-bright);
}

p.t-medium {
  font-weight: var(--fw-medium);
}

p.t-semibold {
  font-weight: var(--fw-semibold);
}

@media only screen and (min-width: 768px) {
  p.t-small-mobile {
    font-size: 1.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  p {
    font-size: 2.2rem;
  }

  p.t-large {
    font-size: 3rem;
  }

  p.t-small {
    font-size: 1.8rem;
  }

  p.t-small-mobile {
    font-size: 2.2rem;
  }
}

.mxd-point-subtitle {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: left;
  -moz-box-pack: left;
  -ms-flex-pack: left;
  justify-content: left;
  gap: 1rem;
  font: normal var(--fw-regular) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.mxd-point-subtitle svg {
  width: 1.9rem;
  height: 1.9rem;
  fill: var(--t-bright);
}

.mxd-point-subtitle span {
  font-weight: var(--fw-regular);
}

.mxd-point-subtitle a {
  color: var(--t-bright);
  background: none;
}

.no-touch .mxd-point-subtitle:hover a {
  color: var(--t-medium);
}

.mxd-manifest {
  font: normal var(--fw-regular) 2.8rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-manifest {
    font-size: 4.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-manifest {
    max-width: 855px;
  }

  .mxd-manifest.mxd-manifest-l {
    max-width: none;
  }
}

.mxd-stats-number {
  font: normal var(--fw-medium) 7rem/0.8 var(--_font-accent);
  color: var(--t-bright);
  letter-spacing: -0.1rem;
}

.mxd-stats-number.opposite {
  color: var(--t-opp-bright);
}

.mxd-stats-number.small {
  font-size: 5rem;
}

.mxd-stats-number.xsmall {
  font-size: 5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-stats-number.small {
    font-size: 7rem;
  }

  .mxd-stats-number.xsmall {
    font-size: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-stats-number {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-stats-number {
    font-size: 12rem;
  }
}

/* ------------------------------------------------*/
/* Elements - Typography End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Controls Start */
/* ------------------------------------------------*/
.mxd-color-switcher {
  position: relative;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 4.6rem;
  height: 4.6rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border: none;
  outline: 0;
  cursor: pointer;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  color: var(--t-bright);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.mxd-color-switcher::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1);
  -moz-transform: translateX(-50%) translateY(-50%) scale(1);
  -ms-transform: translateX(-50%) translateY(-50%) scale(1);
  transform: translateX(-50%) translateY(-50%) scale(1);
  width: 100%;
  height: 100%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: transparent;
  -webkit-transition: background-color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  transition: background-color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), background-color var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), background-color var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium), background-color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
}

.mxd-color-switcher i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  font-size: 2rem;
  overflow: hidden;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .mxd-color-switcher:hover::before {
  background-color: var(--base-tint);
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1.04);
  -moz-transform: translateX(-50%) translateY(-50%) scale(1.04);
  -ms-transform: translateX(-50%) translateY(-50%) scale(1.04);
  transform: translateX(-50%) translateY(-50%) scale(1.04);
}

.no-touch .mxd-color-switcher:hover i {
  -webkit-transform: scale(0.92);
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  transform: scale(0.92);
}

@media only screen and (min-width: 768px) {
  .mxd-color-switcher {
    width: 5.6rem;
    height: 5.6rem;
  }

  .mxd-color-switcher i {
    font-size: 3rem;
  }
}

.btn-rotating {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  color: var(--t-bright);
  font-size: 2.2rem;
}

.btn-rotating .btn-rotating__text {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
}

.btn-rotating .btn-rotating__text text {
  fill: var(--t-bright);
  font-family: var(--_font-accent);
  font-weight: 500;
  text-transform: uppercase;
  -webkit-transition: var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: var(--_animspeed-medium) var(--_animbezier);
  transition: var(--_animspeed-medium) var(--_animbezier);
}

.btn-rotating .btn-rotating__image {
  display: block;
  height: auto;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .btn-rotating:hover .btn-rotating__image {
  -webkit-transform: scale(0.92);
  -moz-transform: scale(0.92);
  -ms-transform: scale(0.92);
  transform: scale(0.92);
}

.btn-rotating-160 {
  width: 160px;
  height: 160px;
}

.btn-rotating-160 .btn-rotating__text {
  width: 160px;
  height: 160px;
}

.btn-rotating-160 .btn-rotating__text text {
  font-size: 1.39rem;
  letter-spacing: normal;
}

.btn-rotating-160 .btn-rotating__image {
  width: 6rem;
}

.btn-rotating-120-160 {
  width: 120px;
  height: 120px;
}

.btn-rotating-120-160 .btn-rotating__text {
  width: 120px;
  height: 120px;
}

.btn-rotating-120-160 .btn-rotating__text text {
  font-size: 1.4rem;
  letter-spacing: normal;
}

.btn-rotating-120-160 .btn-rotating__image {
  width: 5rem;
}

@media only screen and (min-width: 1600px) {
  .btn-rotating-120-160 {
    width: 160px;
    height: 160px;
  }

  .btn-rotating-120-160 .btn-rotating__text {
    width: 160px;
    height: 160px;
  }

  .btn-rotating-120-160 .btn-rotating__text text {
    font-size: 1.39rem;
    letter-spacing: normal;
  }

  .btn-rotating-120-160 .btn-rotating__image {
    width: 6rem;
  }
}

.btn-rotating-180 {
  width: 180px;
  height: 180px;
}

.btn-rotating-180 .btn-rotating__text {
  width: 180px;
  height: 180px;
}

.btn-rotating-180 .btn-rotating__text text {
  font-size: 1.53rem;
  letter-spacing: 0.1rem;
}

.btn-rotating-180 .btn-rotating__image {
  width: 7.6rem;
}

.btn-rotating-180.ver-02 .btn-rotating__text text {
  font-size: 1.36rem;
}

.btn-rotating-blur-outline {
  width: 200px;
  height: 200px;
  border: 1px solid var(--st-opp-bright);
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: var(--neutral-transparent);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.btn-rotating-blur-outline .btn-rotating__text {
  width: 180px;
  height: 180px;
  top: 1rem;
  left: 1rem;
}

.btn-rotating-blur-outline .btn-rotating__text text {
  font-size: 1.4rem;
  letter-spacing: 0.09rem;
}

.btn-rotating-blur-outline .btn-rotating__image {
  width: 8rem;
}

.btn-rotating-blur-outline.ver-02 .btn-rotating__text text {
  font-size: 1.374rem;
  letter-spacing: 0.09rem;
}

.btn-rotating-blur-outline.ver-03 .btn-rotating__text text {
  font-size: 1.54rem;
  letter-spacing: 0.1rem;
}

.btn-rotating-blur-outline.ver-04 {
  width: 147px;
  height: 147px;
  color: var(--nl-white);
}

.btn-rotating-blur-outline.ver-04 .btn-rotating__text {
  width: 130px;
  height: 130px;
  top: 0.8rem;
  left: 0.8rem;
}

.btn-rotating-blur-outline.ver-04 .btn-rotating__text text {
  font-size: 1.54rem;
  letter-spacing: 0.1rem;
}

.btn-rotating-blur-outline.ver-04 .btn-rotating__image {
  width: 5rem;
}

@media only screen and (min-width: 1200px) {
  .btn-rotating-blur-outline.permanent-desktop {
    border: 1px solid rgba(255, 255, 255, 0.5);
    background-color: rgba(255, 255, 255, 0.05);
  }

  .btn-rotating-blur-outline.permanent-desktop .btn-rotating__text {
    fill: var(--nl-white);
  }

  .btn-rotating-blur-outline.permanent-desktop .btn-rotating__text text {
    fill: var(--nl-white);
  }
}

.btn {
  position: relative;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.4rem;
  border: none;
  outline: 0;
  padding: 0;
  font: inherit;
  background-color: transparent;
  cursor: pointer;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.btn-to-top {
  position: fixed;
  right: 3rem;
  bottom: 3rem;
  width: 4.6rem;
  height: 4.6rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border-width: 2px;
  background-color: rgba(255, 255, 255, 0.03);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: var(--nl-white);
  mix-blend-mode: difference;
  font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  z-index: 9;
  overflow: hidden;
}

.btn-to-top i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  font-size: 2.2rem;
  overflow: hidden;
}

.no-touch .btn-to-top:hover {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

@media only screen and (min-width: 768px) {
  .btn-to-top {
    right: 6rem;
    bottom: 4rem;
    width: 5.6rem;
    height: 5.6rem;
  }

  .btn-to-top i {
    font-size: 2.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .btn-to-top {
    right: 9rem;
  }
}

.btn-line-default {
  gap: 1rem;
  font: normal var(--fw-medium) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.btn-line-default i,
.btn-line-default .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}

.btn-line-default i {
  font-size: 2.2rem;
  overflow: hidden;
}

@media only screen and (min-width: 1600px) {
  .btn-line-default {
    font-size: 2.2rem;
  }

  .btn-line-default i {
    font-size: 2.6rem;
  }
}

.btn-line-medium {
  gap: 1rem;
  font: normal var(--fw-regular) 1.6rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.btn-line-medium i,
.btn-line-medium .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}

.btn-line-medium i {
  font-size: 1.8rem;
  overflow: hidden;
}

@media only screen and (min-width: 1600px) {
  .btn-line-medium {
    font-size: 1.8rem;
  }

  .btn-line-medium i {
    font-size: 2rem;
  }
}

.btn-line-small {
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-muted);
}

.btn-line-small i,
.btn-line-small .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}

.btn-line-small i {
  font-size: 2.2rem;
  overflow: hidden;
}

.btn-line-xsmall {
  font: normal var(--fw-regular) 1.4rem/1.2 var(--_font-accent);
  gap: 0.6rem;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  width: auto;
}

.btn-line-xsmall i,
.btn-line-xsmall .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}

.btn-line-xsmall i {
  font-size: 1.6rem;
  overflow: hidden;
}

.btn-line-headline {
  flex-wrap: wrap;
  gap: 1rem;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: auto;
  font: normal var(--fw-medium) clamp(1.6rem, 2.5vw + 0.5rem, 3.2rem)/1.4 var(--_font-accent);
  letter-spacing: 0.02em;
  color: var(--t-muted-extra);
  margin-top: 1rem;
}

.btn-line-headline i,
.btn-line-headline .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  max-width: 100%;
  white-space: pre-wrap;
  word-wrap: break-word;
}

.btn-line-headline i {
  font-size: 3.1rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .btn-line-headline {
    margin-top: 0;
  }

  .btn-line-headline i {
    font-size: 0.85em;
  }
}

@media only screen and (min-width: 1200px) {
  .btn-line-headline i {
    font-size: 0.85em;
  }

  .no-touch .btn-line-headline:hover {
    color: var(--accent);
  }
}

@media only screen and (min-width: 1600px) {
  .btn-line-headline i {
    font-size: 0.85em;
  }
}

.btn-default {
  height: 5.6rem;
  line-height: 5.6rem;
  gap: 1.2rem;
  padding: 0 2.2rem;
  -moz-border-radius: 2.8rem;
  border-radius: 2.8rem;
  border-width: 2px;
  font: normal var(--fw-medium) 2.2rem/1.5 var(--_font-accent);
}

.btn-default i,
.btn-default .btn-caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
}

.btn-default i {
  font-size: 2.6rem;
  overflow: hidden;
}

.btn-small {
  height: 4.4rem;
  line-height: 4.4rem;
  gap: 0.8rem;
  padding: 0 1.5rem;
  -moz-border-radius: 2.2rem;
  border-radius: 2.2rem;
  border-width: 1px;
  font: normal var(--fw-regular) 1.6rem/1.5 var(--_font-accent);
}

.btn-small i {
  font-size: 1.8rem;
}

.btn-large {
  height: 5.6rem;
  line-height: 5.6rem;
  gap: 1.2rem;
  padding: 0 2.2rem;
  -moz-border-radius: 2.8rem;
  border-radius: 2.8rem;
  border-width: 2px;
  font: normal var(--fw-medium) 2.2rem/1.5 var(--_font-accent);
}

.btn-large i {
  font-size: 2.6rem;
}

@media only screen and (min-width: 768px) {
  .btn-large {
    height: 8.4rem;
    line-height: 8.4rem;
    gap: 1.6rem;
    padding: 0 3.2rem;
    -moz-border-radius: 4.2rem;
    border-radius: 4.2rem;
    border-width: 2px;
    font: normal var(--fw-medium) 3rem/1.5 var(--_font-accent);
  }

  .btn-large i {
    font-size: 3.6rem;
  }
}

.btn-round {
  width: 5.6rem;
  height: 5.6rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  border-width: 2px;
  font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.btn-round i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  font-size: 2.5rem;
  overflow: hidden;
}

.no-touch .btn-round:hover {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.btn-round-large {
  width: 5.6rem;
  height: 5.6rem;
  border-width: 2px;
}

.btn-round-large i {
  font-size: 2.6rem;
}

@media only screen and (min-width: 768px) {
  .btn-round-large {
    width: 8.2rem;
    height: 8.2rem;
  }

  .btn-round-large i {
    font-size: 3rem;
  }
}

.btn-round-medium {
  width: 5.6rem;
  height: 5.6rem;
  border-width: 1px;
}

.btn-round-medium i {
  font-size: 2.4rem;
}

.btn-round-small {
  width: 4rem;
  height: 4rem;
  border-width: 1px;
}

.btn-round-small i {
  font-size: 1.8rem;
}

.btn-form {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: end;
  width: 6rem;
  height: 6rem;
  border-width: 2px;
  font: normal var(--fw-regular) 2.2rem/1.5 var(--_font-accent);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
}

.btn-form i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  font-size: 2.6rem;
  overflow: hidden;
}

.no-touch .btn-form:hover {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.no-touch .btn-form:hover.no-scale {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.btn-absolute-right {
  position: absolute;
  top: 0;
  right: 0;
}

.btn-fullwidth {
  width: 100%;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.btn-outline {
  background-color: transparent;
  border-style: solid;
  border-color: var(--st-bright);
  color: var(--t-bright);
}

.btn-outline.opposite {
  border-color: var(--st-opp-bright);
  color: var(--t-opp-bright);
}

.btn-outline.permanent {
  border-color: var(--pt-base);
  color: var(--pt-t-light-bright);
}

.btn-accent {
  background-color: var(--accent);
  border-style: solid;
  border-color: var(--accent);
  color: var(--t-opp-bright);
}

.btn-additional {
  background-color: var(--additional);
  border-style: solid;
  border-color: var(--additional);
  color: var(--t-bright);
}

.btn-opposite {
  background-color: var(--base-opp);
  border-style: solid;
  border-color: var(--base-opp);
  color: var(--t-opp-bright);
}

.btn-base {
  background-color: var(--base);
  border-style: solid;
  border-color: var(--base);
  color: var(--t-bright);
}

.btn-permanent {
  background-color: var(--pt-base);
  border-style: solid;
  border-color: var(--pt-st-light-bright);
  color: var(--pt-t-dark-bright);
}

.btn-muted {
  background-color: transparent;
  color: var(--t-muted);
}

.no-touch .btn-muted:hover {
  color: var(--t-bright);
}

.btn-bright {
  background-color: transparent;
  color: var(--t-bright);
}

.no-touch .btn-bright:hover {
  color: var(--t-bright);
}

.btn-anim.play .btn-anim__letter {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
}

.btn-anim:hover .btn-anim__letter {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
}

.btn-anim .btn-caption {
  display: block !important;
  height: 3.3rem;
  line-height: 3.3rem;
  overflow: hidden;
}

.btn-anim.btn-anim-medium .btn-caption {
  height: 2.3rem;
  line-height: 2.3rem;
}

.btn-anim__letter {
  display: inline-block;
  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.024, 1);
  transition: -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.024, 1);
  -moz-transition: transform 0.5s cubic-bezier(0.76, 0, 0.024, 1), -moz-transform 0.5s cubic-bezier(0.76, 0, 0.024, 1);
  transition: transform 0.5s cubic-bezier(0.76, 0, 0.024, 1);
  transition: transform 0.5s cubic-bezier(0.76, 0, 0.024, 1), -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.024, 1), -moz-transform 0.5s cubic-bezier(0.76, 0, 0.024, 1);
}

.btn-anim .btn-anim__block:last-child {
  color: var(--primary);
}

.btn-anim__letter:nth-child(1) {
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  transition-delay: 0s;
}

.btn-anim__letter:nth-child(2) {
  -webkit-transition-delay: 0.03s;
  -moz-transition-delay: 0.03s;
  transition-delay: 0.03s;
}

.btn-anim__letter:nth-child(3) {
  -webkit-transition-delay: 0.06s;
  -moz-transition-delay: 0.06s;
  transition-delay: 0.06s;
}

.btn-anim__letter:nth-child(4) {
  -webkit-transition-delay: 0.09s;
  -moz-transition-delay: 0.09s;
  transition-delay: 0.09s;
}

.btn-anim__letter:nth-child(5) {
  -webkit-transition-delay: 0.12s;
  -moz-transition-delay: 0.12s;
  transition-delay: 0.12s;
}

.btn-anim__letter:nth-child(6) {
  -webkit-transition-delay: 0.15s;
  -moz-transition-delay: 0.15s;
  transition-delay: 0.15s;
}

.btn-anim__letter:nth-child(7) {
  -webkit-transition-delay: 0.18s;
  -moz-transition-delay: 0.18s;
  transition-delay: 0.18s;
}

.btn-anim__letter:nth-child(8) {
  -webkit-transition-delay: 0.21s;
  -moz-transition-delay: 0.21s;
  transition-delay: 0.21s;
}

.btn-anim__letter:nth-child(9) {
  -webkit-transition-delay: 0.24s;
  -moz-transition-delay: 0.24s;
  transition-delay: 0.24s;
}

.btn-anim__letter:nth-child(10) {
  -webkit-transition-delay: 0.27s;
  -moz-transition-delay: 0.27s;
  transition-delay: 0.27s;
}

.btn-anim__letter:nth-child(11) {
  -webkit-transition-delay: 0.3s;
  -moz-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.btn-anim__letter:nth-child(12) {
  -webkit-transition-delay: 0.33s;
  -moz-transition-delay: 0.33s;
  transition-delay: 0.33s;
}

.btn-anim__letter:nth-child(13) {
  -webkit-transition-delay: 0.36s;
  -moz-transition-delay: 0.36s;
  transition-delay: 0.36s;
}

.btn-anim__letter:nth-child(14) {
  -webkit-transition-delay: 0.39s;
  -moz-transition-delay: 0.39s;
  transition-delay: 0.39s;
}

.btn-anim__letter:nth-child(15) {
  -webkit-transition-delay: 0.42s;
  -moz-transition-delay: 0.42s;
  transition-delay: 0.42s;
}

.btn-anim__letter:nth-child(16) {
  -webkit-transition-delay: 0.45s;
  -moz-transition-delay: 0.45s;
  transition-delay: 0.45s;
}

.btn-anim__letter:nth-child(17) {
  -webkit-transition-delay: 0.48s;
  -moz-transition-delay: 0.48s;
  transition-delay: 0.48s;
}

.btn-anim__letter:nth-child(18) {
  -webkit-transition-delay: 0.51s;
  -moz-transition-delay: 0.51s;
  transition-delay: 0.51s;
}

.btn-anim__letter:nth-child(19) {
  -webkit-transition-delay: 0.54s;
  -moz-transition-delay: 0.54s;
  transition-delay: 0.54s;
}

.btn-anim__letter:nth-child(20) {
  -webkit-transition-delay: 0.57s;
  -moz-transition-delay: 0.57s;
  transition-delay: 0.57s;
}

.btn-anim__letter:nth-child(21) {
  -webkit-transition-delay: 0.6s;
  -moz-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

.btn-anim__letter:nth-child(22) {
  -webkit-transition-delay: 0.63s;
  -moz-transition-delay: 0.63s;
  transition-delay: 0.63s;
}

.btn-anim__letter:nth-child(23) {
  -webkit-transition-delay: 0.66s;
  -moz-transition-delay: 0.66s;
  transition-delay: 0.66s;
}

.btn-anim__letter:nth-child(24) {
  -webkit-transition-delay: 0.69s;
  -moz-transition-delay: 0.69s;
  transition-delay: 0.69s;
}

.btn-anim__letter:nth-child(25) {
  -webkit-transition-delay: 0.72s;
  -moz-transition-delay: 0.72s;
  transition-delay: 0.72s;
}

.btn-anim__letter:nth-child(26) {
  -webkit-transition-delay: 0.75s;
  -moz-transition-delay: 0.75s;
  transition-delay: 0.75s;
}

.btn-anim__letter:nth-child(27) {
  -webkit-transition-delay: 0.78s;
  -moz-transition-delay: 0.78s;
  transition-delay: 0.78s;
}

.btn-anim__letter:nth-child(28) {
  -webkit-transition-delay: 0.81s;
  -moz-transition-delay: 0.81s;
  transition-delay: 0.81s;
}

.btn-anim__letter:nth-child(29) {
  -webkit-transition-delay: 0.84s;
  -moz-transition-delay: 0.84s;
  transition-delay: 0.84s;
}

.btn-anim__letter:nth-child(30) {
  -webkit-transition-delay: 0.87s;
  -moz-transition-delay: 0.87s;
  transition-delay: 0.87s;
}

.btn-mobile-icon {
  width: 4.6rem;
  height: 4.6rem;
  padding: 0;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.btn-mobile-icon i {
  font-size: 2rem;
}

.btn-mobile-icon .btn-caption {
  display: none !important;
}

@media only screen and (min-width: 768px) {
  .btn-mobile-icon {
    width: auto;
    height: 5.6rem;
    padding: 0 2.2rem;
    -moz-border-radius: 2.8rem;
    border-radius: 2.8rem;
  }

  .btn-mobile-icon i {
    font-size: 2.6rem;
  }

  .btn-mobile-icon .btn-caption {
    display: block !important;
  }
}

.tag {
  position: relative;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.8rem;
  border: none;
  outline: 0;
  padding: 0;
  font: inherit;
  background-color: transparent;
  text-decoration: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.tag-default {
  height: 3.2rem;
  line-height: 3.2rem;
  padding: 0 1.2rem;
  -moz-border-radius: 1.6rem;
  border-radius: 1.6rem;
  border-width: 1px;
  font: normal var(--fw-regular) 1.4rem/1.5 var(--_font-accent);
}

@media only screen and (min-width: 1600px) {
  .tag-default {
    height: 3.6rem;
    line-height: 3.6rem;
    padding: 0 1.4rem;
    -moz-border-radius: 1.8rem;
    border-radius: 1.8rem;
    font-size: 1.6rem;
  }
}

.tag-opposite {
  background-color: var(--base-opp);
  border-style: solid;
  border-color: var(--base-opp);
  color: var(--t-opp-bright);
}

.tag-link-opposite {
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.tag-link-opposite a {
  color: var(--t-opp-bright);
}

.no-touch .tag-link-opposite:hover {
  background-color: transparent;
  border-color: var(--st-bright);
  color: var(--t-bright);
}

.no-touch .tag-link-opposite:hover a {
  color: var(--t-bright);
}

.tag-outline {
  background-color: transparent;
  border-style: solid;
  border-color: var(--st-bright);
  color: var(--t-bright);
}

.tag-link-outline {
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.tag-link-outline a {
  color: var(--t-bright);
}

.no-touch .tag-link-outline:hover {
  background-color: var(--base-opp);
  border-color: var(--base-opp);
  color: var(--t-opp-bright);
}

.no-touch .tag-link-outline:hover a {
  color: var(--t-opp-bright);
}

.tag-outline-opposite {
  background-color: transparent;
  border-style: solid;
  border-color: var(--st-opp-bright);
  color: var(--t-opp-bright);
}

.tag-outline-medium {
  background-color: transparent;
  border-style: solid;
  border-color: var(--st-medium);
  color: var(--t-medium);
}

.tag-outline-permanent {
  background-color: transparent;
  border-style: solid;
  border-color: var(--pt-st-light-bright);
  color: var(--pt-t-light-bright);
}

.tag-link-outline-premanent {
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.tag-link-outline-premanent a {
  color: var(--pt-t-light-bright);
}

.no-touch .tag-link-outline-premanent:hover {
  background-color: var(--pt-base);
  border-color: var(--pt-st-light-bright);
  color: var(--pt-t-dark-bright);
}

.no-touch .tag-link-outline-premanent:hover a {
  color: var(--pt-t-dark-bright);
}

.tag-permanent {
  background-color: var(--pt-base);
  border-style: solid;
  border-color: var(--pt-st-light-bright);
  color: var(--pt-t-dark-bright);
}

.tag-permanent-opposite {
  background-color: var(--pt-base-dark);
  border-style: solid;
  border-color: var(--pt-st-dark-bright);
  color: var(--pt-t-light-bright);
}

.tag-accent {
  background-color: var(--accent);
  border-style: solid;
  border-color: var(--accent);
  color: var(--t-opp-bright);
}

.tag-additional {
  background-color: var(--additional);
  border-style: solid;
  border-color: var(--additional);
  color: var(--t-bright);
}

.slide-right:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRight;
  -moz-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRight;
  animation: 0.6s var(--_animbezier) 0.3s 1 both slideRight;
}

.slide-right-up:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightUp;
  -moz-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightUp;
  animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightUp;
}

.slide-right-down:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightDown;
  -moz-animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightDown;
  animation: 0.6s var(--_animbezier) 0.3s 1 both slideRightDown;
}

.slide-left:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideLeft;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideLeft;
  animation: 0.6s var(--_animbezier) 0s 1 both slideLeft;
}

.slide-left-up:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideLeftUp;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideLeftUp;
  animation: 0.6s var(--_animbezier) 0s 1 both slideLeftUp;
}

.slide-left-down:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideLeftDown;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideLeftDown;
  animation: 0.6s var(--_animbezier) 0s 1 both slideLeftDown;
}

.slide-down:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0.3s 1 both slideDown;
  -moz-animation: 0.6s var(--_animbezier) 0.3s 1 both slideDown;
  animation: 0.6s var(--_animbezier) 0.3s 1 both slideDown;
}

.slide-up:hover i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideUp;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideUp;
  animation: 0.6s var(--_animbezier) 0s 1 both slideUp;
}

.anim-no-delay:hover i::before {
  -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
}

@-webkit-keyframes slideRight {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-moz-keyframes slideRight {
  0% {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -moz-transform: translateX(100%);
    transform: translateX(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideRight {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    transform: translateX(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    transform: translateX(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes slideRightUp {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-moz-keyframes slideRightUp {
  0% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -moz-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@keyframes slideRightUp {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(100%) translateY(-100%);
    -moz-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%) translateY(100%);
    -moz-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-webkit-keyframes slideRightDown {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-moz-keyframes slideRightDown {
  0% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -moz-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@keyframes slideRightDown {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(100%) translateY(100%);
    -moz-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(-100%) translateY(-100%);
    -moz-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-webkit-keyframes slideLeft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-moz-keyframes slideLeft {
  0% {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -moz-transform: translateX(-100%);
    transform: translateX(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slideLeft {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    transform: translateX(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    transform: translateX(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes slideLeftUp {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-moz-keyframes slideLeftUp {
  0% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -moz-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@keyframes slideLeftUp {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(-100%) translateY(-100%);
    -moz-transform: translateX(-100%) translateY(-100%);
    transform: translateX(-100%) translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%) translateY(100%);
    -moz-transform: translateX(100%) translateY(100%);
    transform: translateX(100%) translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-webkit-keyframes slideLeftDown {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-moz-keyframes slideLeftDown {
  0% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -moz-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@keyframes slideLeftDown {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }

  50% {
    -webkit-transform: translateX(-100%) translateY(100%);
    -moz-transform: translateX(-100%) translateY(100%);
    transform: translateX(-100%) translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateX(100%) translateY(-100%);
    -moz-transform: translateX(100%) translateY(-100%);
    transform: translateX(100%) translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateX(0) translateY(0);
    -moz-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
  }
}

@-webkit-keyframes slideDown {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@-moz-keyframes slideDown {
  0% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -moz-transform: translateY(100%);
    transform: translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideDown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

@-webkit-keyframes slideUp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@-moz-keyframes slideUp {
  0% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -moz-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes slideUp {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  51% {
    opacity: 0;
  }

  52% {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}

.mxd-spin {
  -webkit-animation: spin 15s linear infinite;
  -moz-animation: spin 15s linear infinite;
  animation: spin 15s linear infinite;
}

.mxd-spin-hover img {
  -webkit-animation: spin 5s linear infinite;
  -moz-animation: spin 5s linear infinite;
  animation: spin 5s linear infinite;
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
  animation-play-state: paused;
}

.mxd-spin-hover:hover img {
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  animation-play-state: running;
}

@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* ------------------------------------------------*/
/* Elements - Controls End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Forms Start */
/* ------------------------------------------------*/
.form-container {
  position: relative;
}

.form {
  opacity: 1;
  -webkit-transition: opacity var(--_animspeed-slow) ease-in-out;
  -moz-transition: opacity var(--_animspeed-slow) ease-in-out;
  transition: opacity var(--_animspeed-slow) ease-in-out;
}

.form.is-hidden {
  opacity: 0;
}

form {
  position: relative;
  width: 100%;
}

form input,
form textarea {
  position: relative;
  display: block;
  width: 100%;
  border: none;
  outline: none;
  margin: 0;
  padding: 1.2rem 0.2rem;
  background-color: transparent;
  border-bottom: 2px solid var(--st-medium);
  font: normal var(--fw-regular) 2.2rem var(--_font-accent);
  height: 6rem;
  line-height: 6rem;
  color: var(--t-bright);
}

form input:focus,
form textarea:focus {
  border-bottom: 2px solid var(--st-bright);
}

form textarea {
  height: 16rem;
  line-height: 1.6;
  resize: none;
}

form ::-webkit-input-placeholder {
  color: var(--t-muted);
}

form :-moz-placeholder {
  color: var(--t-muted);
}

form ::-moz-placeholder {
  color: var(--t-muted);
}

form :-ms-input-placeholder {
  color: var(--t-muted);
}

form input:focus:required:invalid,
form textarea:focus:required:invalid {
  color: var(--t-bright);
}

form input:required:valid,
form textarea:required:valid {
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  form textarea {
    height: 23rem;
  }
}

@media only screen and (min-width: 1600px) {

  form input,
  form textarea {
    font-size: 2.2rem;
  }
}

.form__reply {
  position: absolute;
  top: auto;
  right: auto;
  bottom: 0;
  left: 0;
  opacity: 0;
  -webkit-transition: opacity var(--_animspeed-slow) ease-in-out;
  -moz-transition: opacity var(--_animspeed-slow) ease-in-out;
  transition: opacity var(--_animspeed-slow) ease-in-out;
}

.form__reply.centered {
  position: absolute;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  max-width: 400px;
}

.form__reply.is-visible {
  opacity: 1;
}

.reply__icon {
  display: block;
  font-size: 6rem;
  color: var(--t-bright);
  margin-bottom: 1.2rem;
}

.reply__title {
  font: normal var(--fw-medium) 3.6rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  margin-bottom: 1.4rem;
}

.reply__text {
  display: block;
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

/* ------------------------------------------------*/
/* Elements - Forms End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Components Start */
/* ------------------------------------------------*/
.mxd-logo {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: left;
  -moz-box-pack: left;
  -ms-flex-pack: left;
  justify-content: left;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-logo {
    gap: 1.4rem;
  }
}

.mxd-logo__image {
  display: block;
  width: 4.6rem;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-logo__image {
    width: 5.6rem;
  }
}

/* Header brand: render the wordmark image in place of the stacked text.
   The text is kept in the markup (visually hidden) so it remains the link's
   accessible name. Default paint is dark, so the white wordmark is the
   baseline; light mode swaps in the dark wordmark. */
.mxd-logo__text {
  display: block;
  width: 15.5rem;
  height: 2.9rem;
  /* Hide the text robustly: text-indent only shifts the first line, and the
     markup is "insanely<br>elegant", so the second line would otherwise leak
     out in the default link colour. Transparent text keeps it as the link's
     accessible name while staying invisible regardless of per-page font-size. */
  text-indent: -9999px;
  color: transparent;
  text-decoration: none;
  white-space: nowrap;
  overflow: hidden;
  background: left center / contain no-repeat url(../img/logo_in_white.svg);
}

[color-scheme=light] .mxd-logo__text {
  background-image: url(../img/logo_dark.png);
}

@media only screen and (min-width: 768px) {
  .mxd-logo__text {
    width: 19.5rem;
    height: 3.6rem;
  }
}

.mxd-section-title {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.4rem;
  text-align: left;
  margin-bottom: 7rem;
}

.mxd-section-title.h2-only {
  margin-bottom: 6.2rem;
}

.mxd-section-title.no-controls {
  margin-bottom: 6rem;
}

.mxd-section-title.title-large {
  gap: 4.2rem;
}

.mxd-section-title.pre-grid {
  margin-bottom: 4rem;
}

.mxd-section-title.pre-block {
  margin-bottom: 4.4rem;
}

.mxd-section-title.no-margin {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-section-title {
    margin-bottom: 8rem;
  }

  .mxd-section-title.h2-only {
    margin-bottom: 6.6rem;
  }

  .mxd-section-title.no-controls {
    margin-bottom: 7rem;
  }

  .mxd-section-title.pre-grid {
    margin-bottom: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title {
    margin-bottom: 6.7rem;
  }

  .mxd-section-title.no-controls {
    margin-bottom: 6.7rem;
  }

  .mxd-section-title.no-margin-desktop {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title.title-large {
    gap: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title {
    gap: 4.2rem;
    margin-bottom: 6.7rem;
  }
}

.mxd-section-title__text {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.4rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title__text {
    gap: 2.6rem;
  }
}

.mxd-section-title__controls {
  position: relative;
}

.mxd-section-title__image-link {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.mxd-section-title__image-link svg,
.mxd-section-title__image-link img {
  width: 140px;
  height: auto;
}

@media only screen and (min-width: 1600px) {

  .mxd-section-title__image-link svg,
  .mxd-section-title__image-link img {
    width: 160px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__title.card-split-title {
    margin-top: -1.6rem;
  }
}

.mxd-section-title__descr {
  padding-right: 6rem;
  margin-top: 2.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-title__descr {
    margin-top: 1.8rem;
    max-width: 620px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__descr {
    margin-top: 2.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title__descr {
    margin-top: 2.5rem;
  }
}

.mxd-section-title__controls {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 3.2rem;
}

.mxd-section-title__controls.pre-title {
  margin-top: 3.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-title__controls.pre-title {
    margin-top: 2.9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__controls {
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 4.2rem;
  }

  .mxd-section-title__controls.pre-title {
    margin-top: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title__controls {
    margin-top: 4.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__hrtitle {
    padding-right: 6rem;
    margin-bottom: 0;
  }
}

.mxd-section-title__hrdescr {
  margin-top: 2.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-title__hrdescr {
    padding-right: 6rem;
    margin-top: 1.8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__hrdescr {
    margin-top: 0;
    padding-top: 0.7rem;
  }
}

.mxd-section-title__hrcontrols {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 3.2rem;
}

.mxd-section-title__hrcontrols.pre-title {
  margin-top: 3.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-section-title__hrcontrols.pre-title {
    margin-top: 2.9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__hrcontrols {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-top: 1.7rem;
    margin-top: 0;
  }

  .mxd-section-title__hrcontrols.pre-title {
    margin-top: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title__hrcontrols {
    padding-top: 1.7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-section-title__hrparagraph {
    margin-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-section-title__hrparagraph {
    margin-top: 5.3rem;
  }
}

.mxd-data-list {
  position: relative;
}

.mxd-data-list__column {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.8rem;
  margin-bottom: 2.8rem;
}

.mxd-data-list__column:last-of-type {
  margin-bottom: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-data-list__column {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-data-list__column {
    gap: 3.4rem;
  }
}

.mxd-data-list__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.6rem;
}

.mxd-data-list__name {
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-medium);
}

.mxd-data-list__content {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.mxd-data-list__content a {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--st-medium)), to(var(--st-medium))), -webkit-gradient(linear, left top, right top, from(var(--accent)), to(var(--accent)));
  background: -moz-linear-gradient(left, var(--st-medium), var(--st-medium)), -moz-linear-gradient(left, var(--accent), var(--accent));
  background: linear-gradient(to right, var(--st-medium), var(--st-medium)), linear-gradient(to right, var(--accent), var(--accent));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  -webkit-transform-origin: bottom right;
  -moz-transform-origin: bottom right;
  -ms-transform-origin: bottom right;
  transform-origin: bottom right;
}

.no-touch .mxd-data-list__content a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
  -webkit-transform-origin: bottom left;
  -moz-transform-origin: bottom left;
  -ms-transform-origin: bottom left;
  transform-origin: bottom left;
}

.mxd-avatars-group {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-avatars-group {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .mxd-avatars-group.align-right {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-align: right;
  }
}

.mxd-avatars-group__text {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-avatars-group__text p,
.mxd-avatars-group__text a {
  line-height: 1.2;
  color: var(--t-medium);
  font-size: 1.8rem;
}

@media only screen and (min-width: 768px) {

  .mxd-avatars-group__text p,
  .mxd-avatars-group__text a {
    font-size: 2.2rem;
  }
}

.mxd-avatars {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.mxd-avatars.align-right {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  text-align: right;
}

.mxd-avatars__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 8rem;
  height: 8rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  margin-left: -2.2rem;
}

.mxd-avatars__item:first-of-type {
  margin-left: 0;
}

.mxd-avatars__item.small {
  width: 4.6rem;
  height: 4.6rem;
  margin-left: -1.4rem;
}

.mxd-avatars__item.small:first-of-type {
  margin-left: 0;
}

.mxd-avatars__item img {
  width: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-avatars__item.small {
    width: 5.6rem;
    height: 5.6rem;
    margin-left: -1.6rem;
  }
}

.mxd-avatars__icon {
  width: 4rem;
  height: auto;
}

.mxd-avatars__icon.small {
  width: 3rem;
  height: auto;
}

.mxd-preview-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.8rem;
  opacity: 0;
  -webkit-transition: fbackdrop-filter var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: fbackdrop-filter var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier);
  transition: fbackdrop-filter var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier);
}

.mxd-preview-hover__icon {
  display: block;
  width: 10rem;
}

.mxd-preview-hover__icon.icon-small {
  width: 8rem;
}

.mxd-preview-hover__icon img {
  width: 100%;
  height: auto;
}

.mxd-preview-hover__text {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--pt-t-light-bright);
}

.mxd-counter {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.mxd-counter.small {
  gap: 2rem;
}

.mxd-counter.horizontal {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.4rem;
}

@media only screen and (min-width: 768px) {
  .mxd-counter.align-end {
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    text-align: right;
  }
}

.mxd-counter__descr {
  max-width: 250px;
}

.mxd-btngroup {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
}

.mxd-btngroup.centered {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (min-width: 576px) {
  .mxd-btngroup {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 2rem;
  }
}

.mxd-divider {
  position: relative;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  height: auto;
  min-height: 300px;
}

@media only screen and (min-width: 768px) {
  .mxd-divider {
    min-height: 400px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-divider {
    min-height: 500px;
  }

  .mxd-divider.divider-hero-01 {
    padding-top: 14rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-divider {
    min-height: 600px;
  }
}

.mxd-divider__image {
  position: relative;
  width: 100%;
  height: auto;
  min-height: 300px;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

.mxd-divider__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

@media only screen and (min-width: 768px) {
  .mxd-divider__image {
    min-height: 400px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-divider__image {
    min-height: 500px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-divider__image {
    min-height: 600px;
  }
}

.mxd-divider__video {
  position: relative;
  width: 100%;
  height: 460px;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
  overflow: hidden;
}

.mxd-divider__video video {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  background-position: center center;
  -moz-background-size: contain;
  background-size: contain;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-divider__video img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-divider__video {
    height: 600px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-divider__video {
    height: 760px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-divider__video {
    height: 930px;
  }
}

.mxd-divider__trigger {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

.mxd-project-item__media {
  position: relative;
  display: block;
  margin-bottom: 1.4rem;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-project-item__media {
    margin-bottom: 2.3rem;
  }
}

.mxd-project-item__preview {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  min-height: 220px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

.mxd-project-item__tags {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 2.6rem 3rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-project-item__tags {
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project-item__tags {
    gap: 1.4rem;
  }
}

.mxd-project-item__promo {
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-project-item__promo {
    padding: 0 4rem;
  }
}

.mxd-project-item__name a {
  display: inline;
  font: normal var(--fw-regular) 2.2rem/1.4 var(--_font-accent);
  color: var(--t-medium);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .mxd-project-item__name a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-project-item__name a span {
  font-weight: var(--fw-medium);
  color: var(--t-bright);
}

.mxd-project-item__name.small a {
  font-size: 2.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-project-item__name a {
    font-size: 3rem;
  }

  .mxd-project-item__name.small a {
    font-size: 2.2rem;
  }
}

.mxd-links-lines {
  position: relative;
}

@media (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-links-lines>.mxd-links-lines__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-links-lines:hover>.mxd-links-lines__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-links-lines__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-links-lines__item:first-of-type {
  margin-top: 0;
}

.mxd-links-lines__divider {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-links-lines__link {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 3rem 0;
  overflow: hidden;
}

.no-touch .mxd-links-lines__link:hover .mxd-links-lines__title {
  -webkit-transform: translateX(1rem);
  -moz-transform: translateX(1rem);
  -ms-transform: translateX(1rem);
  transform: translateX(1rem);
}

.no-touch .mxd-links-lines__link:hover .mxd-links-lines__icon i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
  animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
}

.mxd-links-lines__title {
  position: relative;
  color: var(--t-bright);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
}

.mxd-links-lines__icon {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 3rem;
  -webkit-transform: translateX(0) rotate(0deg);
  -moz-transform: translateX(0) rotate(0deg);
  -ms-transform: translateX(0) rotate(0deg);
  transform: translateX(0) rotate(0deg);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.mxd-links-lines__icon i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: color var(--_animspeed-medium) var(--_animbezier);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.mxd-check-list {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.4rem;
}

.mxd-check-list li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.2rem;
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

.mxd-floating-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
}

.mxd-floating-img.floating-bg {
  overflow: hidden;
  z-index: -1;
}

.mxd-floating-img__item {
  position: absolute;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: auto;
  bottom: 20%;
  right: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-floating-img__item {
    bottom: 4rem;
    right: 6rem;
    width: 600px;
    height: auto;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-floating-img__item {
    width: 46%;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-floating-img__item {
    right: 9rem;
    width: 40%;
  }
}

/* ------------------------------------------------*/
/* Elements - Components End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Elements - Common Classes Start */
/* ------------------------------------------------*/
.bg-accent {
  background-color: var(--accent);
}

.bg-additional {
  background-color: var(--additional);
}

.bg-base {
  background-color: var(--base);
}

.bg-base-tint {
  background-color: var(--base-tint);
}

.bg-base-shade {
  background-color: var(--base-shade);
}

.bg-base-opp {
  background-color: var(--base-opp);
}

.st-accent {
  border: 1px solid var(--accent);
}

.st-additional {
  border: 1px solid var(--additional);
}

.st-base {
  border: 1px solid var(--base);
}

.st-base-tint {
  border: 1px solid var(--base-tint);
}

.st-base-shade {
  border: 1px solid var(--base-shade);
}

.st-base-opp {
  border: 1px solid var(--base-opp);
}

.t-accent {
  color: var(--accent);
}

.t-additional {
  color: var(--additional);
}

.radius-s {
  -moz-border-radius: var(--_radius-s);
  border-radius: var(--_radius-s);
}

.radius-m {
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

.radius-l {
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

.radius-xl {
  -moz-border-radius: var(--_radius-xl);
  border-radius: var(--_radius-xl);
}

.fullheight-l {
  height: auto;
}

@media only screen and (min-width: 992px) {
  .fullheight-l {
    height: 100%;
  }
}

.fullheight-xl {
  height: auto;
}

@media only screen and (min-width: 1200px) {
  .fullheight-xl {
    height: 100%;
  }
}

.anim-zoom-in-container,
.anim-zoom-out-container {
  -webkit-transform-origin: center;
  -moz-transform-origin: center;
  -ms-transform-origin: center;
  transform-origin: center;
}

.padding-4 {
  padding: 2.6rem 3rem;
}

@media only screen and (min-width: 768px) {
  .padding-4 {
    padding: 3.6rem 4rem;
  }
}

.padding-5x4 {
  padding: 2.6rem 3rem;
}

@media only screen and (min-width: 768px) {
  .padding-5x4 {
    padding: 4rem 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .card-desktop-4 {
    width: -moz-calc(40% - 1.5rem);
    width: calc(40% - 1.5rem);
  }
}

@media only screen and (min-width: 1200px) {
  .card-desktop-6 {
    width: -moz-calc(60% - 1.5rem);
    width: calc(60% - 1.5rem);
  }
}

/* ------------------------------------------------*/
/* Elements - Common Classes End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Header Start */
/* ------------------------------------------------*/
.mxd-header {
  position: absolute;
  top: 0;
  left: 3rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  width: -moz-calc(100% - 11.6rem);
  width: calc(100% - 11.6rem);
  padding-top: 3rem;
  z-index: 101;
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  transform: scaleY(1);
  opacity: 1;
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.mxd-header.is-hidden {
  -webkit-transform: scaleY(1.2);
  -moz-transform: scaleY(1.2);
  -ms-transform: scaleY(1.2);
  transform: scaleY(1.2);
  opacity: 0;
}

.mxd-header.menu-is-visible {
  z-index: 10;
}

@media only screen and (min-width: 768px) {
  .mxd-header {
    left: 6rem;
    width: -moz-calc(100% - 19.6rem);
    width: calc(100% - 19.6rem);
    padding-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-header {
    left: 9rem;
    width: -moz-calc(100% - 25.6rem);
    width: calc(100% - 25.6rem);
  }
}

.mxd-header__logo {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.mxd-header__controls {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-header__controls {
    gap: 2rem;
  }
}

/* ------------------------------------------------*/
/* Block - Header End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Menu Start */
/* ------------------------------------------------*/
.mxd-nav__wrap {
  position: fixed;
  top: auto;
  right: 0;
  bottom: auto;
  left: 0;
  z-index: 100;
}

/* While the menu is open the page is scroll-locked via body{position:fixed;
   top:-scrollY} (see js/app.js). Because the nav wrap is fixed with top:auto it
   derives its vertical position from the now-shifted in-flow body, so it — and the
   close ✕ it carries — floats off the top of the viewport by the scroll amount.
   Pin it explicitly (like the panel's inset:0) so the ✕ is always on-screen,
   regardless of how far the page was scrolled when the menu opened. */
body.ie-menu-locked .mxd-nav__wrap {
  top: 0;
}

.mxd-nav__contain {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  min-height: 4.6rem;
  margin-top: 3rem;
  padding: 0 3rem;
  z-index: 2;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.mxd-nav__contain>* {
  pointer-events: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-nav__contain {
    min-height: 5.6rem;
    margin-top: 4rem;
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-nav__contain {
    padding: 0 9rem;
  }
}

.nav_link_wrap {
  position: relative;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.nav_link_svg {
  display: block;
  width: 5rem;
}

.mxd-nav__hamburger {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.7rem;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 4.6rem;
  height: 4.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-nav__hamburger {
    width: 5.6rem;
    height: 5.6rem;
  }
}

.hamburger__base {
  position: absolute;
  inset: 0%;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  background-color: var(--base-opp-tint);
  z-index: 1;
}

/* While closing, the pill surface is reparented back into the hamburger and
   shrunk by GSAP. Lift it above the menu content layer for the duration of that
   morph so the dark panel cleanly covers everything as it collapses (the class
   is removed by js/app.js the instant the morph finishes). */
.hamburger__base.is-morphing {
  z-index: 9999;
}

.nav_hamburger_bg {
  position: absolute;
  inset: 0%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: black;
  z-index: 2;
}

.hamburger__line {
  position: relative;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
  width: 50%;
  height: 0.3rem;
  -moz-border-radius: 0.3rem;
  border-radius: 0.3rem;
  background-color: var(--t-opp-bright);
  /* colour is swapped when the menu opens (see .nav-open rule) — ease it so it
     hands off cleanly alongside the pill's colour morph */
  -webkit-transition: background-color 0.3s ease;
  -moz-transition: background-color 0.3s ease;
  transition: background-color 0.3s ease;
  z-index: 2;
}

/* Once open, the pill has morphed into the menu panel (var(--base)) and the two
   lines form the close ✕. They must contrast with that panel, not with the
   closed-state pill they were coloured for. --t-bright tracks the panel: white on
   the dark panel, near-black on the light panel — so the ✕ is always visible. */
.mxd-nav__hamburger.nav-open .hamburger__line {
  background-color: var(--t-bright);
}

/* ====================================================== */
/*  Fullscreen Menu — redesigned (Insanely Elegant)        */
/*  Theme-aware luxury overlay. Structural hook classes     */
/*  (.mxd-menu__wrapper/base/contain/inner, .main-menu__item,*/
/*  .menu-promo__video, .menu-fade-in) are kept for the      */
/*  existing GSAP open/close timeline in js/app.js.          */
/* ====================================================== */
/* Body lock while the nav menu is open. position:fixed is the only thing iOS
   Safari reliably honours to stop the page scrolling under the overlay; the top
   offset (set inline in js/app.js) keeps the page visually in place. */
body.ie-menu-locked {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  overflow: hidden;
}

.mxd-menu__wrapper {
  position: fixed;
  inset: 0;
  display: none;
  width: 100%;
  height: 100vh;
  /* dvh tracks the *current* visible viewport. svh (small viewport) is shorter
     than the screen once Safari's URL bar collapses, which left a strip of the
     page bleeding through below the panel. dvh always fills the visible area. */
  height: 100dvh;
  z-index: 1;
  overflow: hidden;
  /* the menu is a navigation surface — never let the morph/clicks drag-select
     the big link text */
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

/* the email is the one thing worth copying */
.ie-menu__email {
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
}

/* Dimmed, blurred backdrop behind the floating panel — gives the rounded card
   depth and catches click-to-close on the surrounding frame. */
.mxd-menu__base {
  position: absolute;
  inset: 0;
  z-index: 1;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.82);
  -webkit-backdrop-filter: blur(12px) saturate(115%);
  backdrop-filter: blur(12px) saturate(115%);
}

/* The panel surface IS the hamburger pill, Flipped into the menu and expanded
   by js/app.js. It settles as a rounded, inset floating card (never a hard-edged
   full-bleed rectangle) so the morph stays soft and rounded throughout. */
.mxd-menu__contain .hamburger__base {
  inset: clamp(0.8rem, 1.3vw, 1.8rem);
  background-color: var(--base);
  background-image:
    radial-gradient(115% 80% at 100% -10%, rgba(var(--accent-rgb), 0.18), transparent 55%),
    radial-gradient(95% 75% at -10% 110%, rgba(var(--accent-rgb), 0.10), transparent 52%);
  border-radius: clamp(2rem, 2.4vw, 3.2rem);
  overflow: hidden;
  box-shadow:
    0 4rem 9rem -2rem rgba(0, 0, 0, 0.6),
    0 0 0 1px rgba(var(--accent-rgb), 0.06);
}

.mxd-menu__contain .hamburger__base::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(var(--accent-rgb), 0.5) 0.6px, transparent 0.7px);
  background-size: 26px 26px;
  opacity: 0.05;
  pointer-events: none;
}

.mxd-menu__contain {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* re-enable interaction only on actual controls so clicking empty space closes */
.mxd-menu__contain a,
.mxd-menu__contain button {
  pointer-events: auto;
}

.mxd-menu__inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  /* Top padding is tuned so the brand row centres on the fixed close ✕ (which is
     positioned by the global header at ~5.3rem, not by this panel). Keeping them
     level avoids the ✕ floating alone in the corner above the logo on mobile. */
  padding: 4rem 2rem 2rem;
  overflow-y: auto;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* The panel must capture touch so it scrolls its own overflow (tall menus on
     short phones) instead of the gesture falling through to the page behind.
     .mxd-menu__contain sets pointer-events:none; re-enable it here. Empty-space
     tap-to-close is restored in js/app.js. */
  pointer-events: auto;
}

.mxd-menu__inner::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-menu__inner {
    padding: 7rem 4rem 2.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-menu__inner {
    padding: 8rem 6rem 3rem;
    overflow: hidden;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-menu__inner {
    padding: 9rem 9rem 4rem;
  }
}

/* ---- Top bar ---- */
/* Brand + status live as a left-aligned cluster; the top-right corner is left
   clear for the floating close button so the two never collide. */
.ie-menu__top {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 2.4rem;
  align-items: center;
  justify-content: flex-start;
  padding-right: 6rem;
  padding-bottom: 2.4rem;
  border-bottom: 1px solid var(--st-muted);
}

@media only screen and (min-width: 768px) {
  .ie-menu__top { padding-right: 8rem; }
}

.ie-menu__brand {
  display: inline-flex;
  align-items: center;
}

.ie-menu__logo {
  display: block;
  width: auto;
  height: 3.4rem;
}

@media only screen and (max-width: 600px) {
  .ie-menu__logo { height: 2.8rem; }
}

.ie-menu__status {
  display: inline-flex;
  align-items: center;
  gap: 0.8rem;
  font-family: var(--_font-default);
  font-size: 1.2rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--t-muted);
}

@media only screen and (min-width: 600px) {
  .ie-menu__status {
    padding-left: 2.4rem;
    border-left: 1px solid var(--st-muted);
  }
}

.ie-menu__dot {
  width: 0.8rem;
  height: 0.8rem;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.6);
  animation: ie-menu-pulse 2.4s ease-out infinite;
}

@keyframes ie-menu-pulse {
  0% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.55); }
  70% { box-shadow: 0 0 0 0.7rem rgba(var(--accent-rgb), 0); }
  100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}

/* ---- Body grid ---- */
.ie-menu__body {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 3.2rem;
  align-content: center;
  padding: 3.2rem 0;
  min-height: 0;
}

/* On phones the menu is taller than the screen. Top-align the body (instead of
   vertically centering it) so its content overflows the scrollable .mxd-menu__
   inner and can actually be scrolled to — Contact, Appearance and the footer. */
@media only screen and (max-width: 1199px) {
  .ie-menu__body {
    flex: 0 0 auto;
    align-content: start;
  }
}

@media only screen and (min-width: 1200px) {
  .ie-menu__body {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    gap: clamp(3rem, 5vw, 7rem);
    align-content: center;
    padding: 0;
  }
}

/* ---- Left: primary nav ---- */
.ie-menu__nav {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  min-width: 0;
}

.ie-nav {
  display: flex;
  flex-direction: column;
}

.ie-nav__item {
  border-top: 1px solid var(--st-muted);
}

.ie-nav__item:last-child {
  border-bottom: 1px solid var(--st-muted);
}

.ie-nav__link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 1.6rem;
  padding: 1.2rem 0.4rem;
  text-decoration: none;
  color: var(--t-bright);
  overflow: hidden;
}

/* accent wash that sweeps in on hover */
.ie-nav__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, rgba(var(--accent-rgb), 0.14), transparent 70%);
  transform: translateX(-101%);
  transition: transform 0.55s var(--_animbezier);
  z-index: 0;
  pointer-events: none;
}

.no-touch .ie-nav__link:hover::before,
.ie-nav__link:focus-visible::before {
  transform: translateX(0);
}

.ie-nav__index {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: 3.4rem;
  font-family: var(--_font-default);
  font-size: 1.3rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.1em;
  color: var(--t-muted);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-nav__text {
  position: relative;
  z-index: 1;
  font-family: var(--_font-accent);
  font-weight: var(--fw-medium);
  font-size: clamp(3.4rem, 6.4vw, 6.2rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  transition: transform 0.5s var(--_animbezier), color var(--_animspeed-medium) var(--_animbezier);
}

.ie-nav__arrow {
  position: relative;
  z-index: 1;
  margin-left: auto;
  font-size: clamp(2rem, 3vw, 2.8rem);
  color: var(--accent);
  opacity: 0;
  transform: translate(-1.2rem, 0.6rem) rotate(-8deg);
  transition: opacity 0.45s var(--_animbezier), transform 0.45s var(--_animbezier);
}

.no-touch .ie-nav__link:hover .ie-nav__text,
.ie-nav__link:focus-visible .ie-nav__text {
  transform: translateX(1.4rem);
}

.no-touch .ie-nav__link:hover .ie-nav__index,
.ie-nav__link:focus-visible .ie-nav__index {
  color: var(--accent);
}

.no-touch .ie-nav__link:hover .ie-nav__arrow,
.ie-nav__link:focus-visible .ie-nav__arrow {
  opacity: 1;
  transform: translate(0, 0) rotate(0deg);
}

/* secondary "more" row */
.ie-nav__more {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.4rem 2rem;
  margin-top: 0.8rem;
}

.ie-nav__more-label {
  font-family: var(--_font-default);
  font-size: 1.15rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--t-muted);
}

.ie-nav__more a {
  position: relative;
  font-family: var(--_font-default);
  font-size: 1.6rem;
  color: var(--t-medium);
  text-decoration: none;
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-nav__more a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -0.4rem;
  width: 100%;
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.4s var(--_animbezier);
}

.no-touch .ie-nav__more a:hover {
  color: var(--t-bright);
}

.no-touch .ie-nav__more a:hover::after {
  transform: scaleX(1);
}

/* ---- Right: aside ---- */
.ie-menu__aside {
  display: flex;
  flex-direction: column;
  gap: 2.8rem;
  min-width: 0;
}

@media only screen and (min-width: 1200px) {
  .ie-menu__aside {
    gap: clamp(2rem, 2.4vw, 3rem);
  }
}

/* featured video card */
.ie-menu__feature {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  border-radius: var(--_radius-m);
  overflow: hidden;
  /* Always a rich near-black surface (independent of theme) so the white meta text
     and the accent waveform read identically in light and dark mode. */
  background-color: #0c0c0d;
  border: 1px solid var(--st-muted);
  text-decoration: none;
  isolation: isolate;
  /* Entrance/exit is state-driven off .mxd-menu__wrapper.is-open (toggled by the
     GSAP open/close in js/app.js). CSS transitions are deterministic here, so the
     card reliably fades IN on open and — crucially — fades OUT fast on close
     instead of lingering over the dissolving backdrop. Resting (closed) state is
     hidden with a quick exit; the open state gives it a graceful, delayed entrance. */
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.mxd-menu__wrapper.is-open .ie-menu__feature {
  opacity: 1;
  transform: none;
  /* delayed so the card eases in AFTER the staggered nav links have appeared,
     not before them */
  transition: opacity 0.6s var(--_animbezier) 0.85s, transform 0.6s var(--_animbezier) 0.85s;
}

@media (prefers-reduced-motion: reduce) {
  .ie-menu__feature,
  .mxd-menu__wrapper.is-open .ie-menu__feature { transition: none; }
}

/* Living backdrop: a deep vignette plus a soft accent glow that drifts toward the
   top, sitting BEHIND the animated waveform canvas. This is the static, paint-cheap
   foundation the canvas plays over (and the graceful fallback if JS never runs). */
.ie-menu__feature::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(120% 90% at 50% 8%, rgba(var(--accent-rgb), 0.20) 0%, rgba(var(--accent-rgb), 0) 55%),
    radial-gradient(140% 120% at 50% 120%, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 60%),
    linear-gradient(180deg, #121214 0%, #0a0a0b 100%);
  transform: scale(1.02);
  transition: transform 0.9s var(--_animbezier);
}

.no-touch .ie-menu__feature:hover::before {
  transform: scale(1.06);
}

/* Animated audio-reactive wave field (drawn in js/app.js → createWaveField). */
.ie-menu__feature-canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  display: block;
  /* a touch of bloom so the accent strokes feel emissive rather than flat */
  filter: drop-shadow(0 0 10px rgba(var(--accent-rgb), 0.28));
}

/* Film grain — an inline SVG turbulence tile, blended so it sits in the shadows
   and gives the panel a luxurious, textured finish instead of clean flat pixels. */
.ie-menu__feature-grain {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0.5;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 220px 220px;
}

@media only screen and (min-width: 1200px) {
  .ie-menu__feature {
    aspect-ratio: 16 / 9;
  }
}

.ie-menu__feature-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, 0.72) 100%);
  z-index: 2;
}

.ie-menu__feature-meta {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 0.7rem;
  padding: 2rem;
  width: 100%;
}

.ie-menu__feature-tag {
  font-family: var(--_font-default);
  font-size: 1.1rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.75);
}

.ie-menu__feature-title {
  font-family: var(--_font-accent);
  font-weight: var(--fw-medium);
  font-size: clamp(2rem, 2.4vw, 2.6rem);
  line-height: 1.05;
  letter-spacing: -0.01em;
  color: #fff;
}

.ie-menu__feature-cta {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 0.4rem;
  font-family: var(--_font-default);
  font-size: 1.4rem;
  font-weight: var(--fw-medium);
  color: #fff;
}

.ie-menu__feature-cta i {
  transition: transform 0.4s var(--_animbezier);
}

.no-touch .ie-menu__feature:hover .ie-menu__feature-cta i {
  transform: translate(0.3rem, -0.3rem);
}

/* shared label */
.ie-menu__label {
  display: block;
  margin-bottom: 1.2rem;
  font-family: var(--_font-default);
  font-size: 1.15rem;
  font-weight: var(--fw-medium);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--t-muted);
}

/* contact */
.ie-menu__email {
  display: inline-block;
  font-family: var(--_font-accent);
  font-weight: var(--fw-medium);
  font-size: clamp(1.8rem, 2.1vw, 2.4rem);
  letter-spacing: -0.01em;
  color: var(--t-bright);
  text-decoration: none;
  background-image: linear-gradient(var(--accent), var(--accent));
  background-size: 0% 1px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.45s var(--_animbezier), color var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .ie-menu__email:hover {
  color: var(--accent);
  background-size: 100% 1px;
}

.ie-menu__socials {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 2rem;
  margin-top: 1.6rem;
}

.ie-menu__socials a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-family: var(--_font-default);
  font-size: 1.45rem;
  color: var(--t-medium);
  text-decoration: none;
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-menu__socials a i {
  font-size: 1.2rem;
  opacity: 0;
  transform: translate(-0.4rem, 0.2rem);
  transition: opacity 0.35s var(--_animbezier), transform 0.35s var(--_animbezier);
}

.no-touch .ie-menu__socials a:hover {
  color: var(--t-bright);
}

.no-touch .ie-menu__socials a:hover i {
  opacity: 1;
  transform: translate(0, 0);
}

/* appearance / theme toggle */
.ie-menu__appearance {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.ie-theme {
  position: relative;
  display: inline-flex;
  align-items: stretch;
  align-self: flex-start;
  padding: 0.4rem;
  border: 1px solid var(--st-muted);
  border-radius: 999px;
  background: var(--base-tint);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.ie-theme__opt {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.9rem 1.8rem;
  font-family: var(--_font-default);
  font-size: 1.35rem;
  font-weight: var(--fw-medium);
  color: var(--t-muted);
  border-radius: 999px;
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-theme__thumb {
  position: absolute;
  top: 0.4rem;
  left: 0.4rem;
  z-index: 0;
  width: calc(50% - 0.4rem);
  height: calc(100% - 0.8rem);
  border-radius: 999px;
  background: var(--accent);
  transition: transform 0.45s var(--_animbezier);
}

/* highlight the active mode based on the document color-scheme */
[color-scheme=light] .ie-theme__thumb { transform: translateX(0); }
[color-scheme=dark] .ie-theme__thumb { transform: translateX(100%); }
[color-scheme=light] .ie-theme__opt[data-mode=light],
[color-scheme=dark] .ie-theme__opt[data-mode=dark] {
  color: var(--nl-black);
}

/* ---- Foot ---- */
.ie-menu__foot {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  align-items: center;
  justify-content: space-between;
  padding-top: 2.4rem;
  border-top: 1px solid var(--st-muted);
}

.ie-menu__foot p,
.ie-menu__foot a {
  font-family: var(--_font-default);
  font-size: 1.25rem;
  color: var(--t-muted);
}

.ie-menu__foot-copy {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.ie-menu__foot-links {
  display: flex;
  gap: 1.8rem;
}

.ie-menu__foot a {
  text-decoration: none;
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .ie-menu__foot a:hover {
  color: var(--t-bright);
}

/* keep the GSAP hook class valid even though styling is theme-native now */
.menu-promo__video {
  position: relative;
  overflow: hidden;
}

/* On small screens the panel is one scrolling column (.mxd-menu__inner handles
   the overflow). The body must therefore keep its NATURAL height — if it stays
   `flex: 1 1 auto` it shrinks below its content, the grid spills out of the box
   and the foot rides up over the contact/appearance block. Pinning it to
   `flex: 0 0 auto` lets the inner scroll cleanly with nothing overlapping. */
@media only screen and (max-width: 1199px) {
  .ie-menu__body {
    flex: 0 0 auto;
    align-content: start;
  }
  .ie-menu__aside {
    order: 2;
  }
  /* momentum scrolling + room so the last control never sits flush to the edge */
  .mxd-menu__inner {
    -webkit-overflow-scrolling: touch;
    padding-bottom: 3.2rem;
  }
  /* space-between flings the site link off the right edge on a phone — let the
     foot items flow from the left and wrap naturally instead */
  .ie-menu__foot {
    justify-content: flex-start;
  }
  .ie-menu__foot-site {
    flex-basis: 100%;
  }
}

/* ====================================================== */
/*  Nav submenus — Works / Services / Product Imagery      */
/*  The parent label still navigates; a separate chevron   */
/*  toggle expands a smooth accordion submenu. Single-open  */
/*  (one at a time) keeps the panel compact on every size. */
/* ====================================================== */

/* Row holds the parent link + the expand toggle side by side, so the link
   keeps its own hover wash while the chevron stays a generous, separate
   hit area that never hijacks navigation. */
.ie-nav__row {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}

.ie-nav__item--has-sub .ie-nav__link {
  flex: 1 1 auto;
  min-width: 0;
}

/* Expand / collapse control */
.ie-nav__toggle {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: clamp(4.4rem, 5.5vw, 5.4rem);
  height: clamp(4.4rem, 5.5vw, 5.4rem);
  padding: 0;
  border: 1px solid var(--st-muted);
  border-radius: 50%;
  background: transparent;
  color: var(--t-medium);
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  transition: color var(--_animspeed-medium) var(--_animbezier),
    border-color var(--_animspeed-medium) var(--_animbezier),
    background-color var(--_animspeed-medium) var(--_animbezier),
    transform var(--_animspeed-medium) var(--_animbezier);
}

.ie-nav__toggle-icon {
  font-size: 1.9rem;
  line-height: 1;
  transition: transform 0.5s var(--_animbezier);
}

.no-touch .ie-nav__toggle:hover,
.ie-nav__toggle:focus-visible {
  color: var(--t-bright);
  border-color: rgba(var(--accent-rgb), 0.5);
  background-color: rgba(var(--accent-rgb), 0.08);
}

.no-touch .ie-nav__toggle:active {
  transform: scale(0.94);
}

/* Open state — tint the toggle and flip the chevron */
.ie-nav__item--open .ie-nav__toggle {
  color: var(--accent);
  border-color: rgba(var(--accent-rgb), 0.55);
  background-color: rgba(var(--accent-rgb), 0.1);
}

.ie-nav__item--open .ie-nav__toggle-icon {
  transform: rotate(180deg);
}

/* Collapsible region — height animates via grid-template-rows 0fr→1fr,
   the smoothest collapse with no JS measurement or hard-coded heights. */
.ie-submenu {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.55s var(--_animbezier);
}

.ie-nav__item--open .ie-submenu {
  grid-template-rows: 1fr;
}

/* The grid child owns overflow + min-height:0 so the 0fr state truly
   measures zero and clips cleanly while collapsing. */
.ie-submenu__list {
  overflow: hidden;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-left: 1.8rem;
  padding-bottom: 0.6rem;
}

.ie-submenu__item {
  border-top: 1px solid var(--st-muted);
  opacity: 0;
  transform: translateY(0.8rem);
  transition: opacity 0.45s var(--_animbezier), transform 0.45s var(--_animbezier);
}

.ie-submenu__item:first-child {
  border-top: 0;
}

/* Staggered reveal once the parent opens (covers the largest list, 7 items) */
.ie-nav__item--open .ie-submenu__item {
  opacity: 1;
  transform: none;
}

.ie-nav__item--open .ie-submenu__item:nth-child(1) { transition-delay: 0.10s; }
.ie-nav__item--open .ie-submenu__item:nth-child(2) { transition-delay: 0.14s; }
.ie-nav__item--open .ie-submenu__item:nth-child(3) { transition-delay: 0.18s; }
.ie-nav__item--open .ie-submenu__item:nth-child(4) { transition-delay: 0.22s; }
.ie-nav__item--open .ie-submenu__item:nth-child(5) { transition-delay: 0.26s; }
.ie-nav__item--open .ie-submenu__item:nth-child(6) { transition-delay: 0.30s; }
.ie-nav__item--open .ie-submenu__item:nth-child(7) { transition-delay: 0.34s; }

/* Submenu link — label over description, accent arrow to the right */
.ie-submenu__link {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 1.4rem;
  padding: 1.15rem 0.6rem;
  text-decoration: none;
  color: var(--t-medium);
  transition: padding-left 0.4s var(--_animbezier);
}

.ie-submenu__label {
  grid-column: 1;
  grid-row: 1;
  font-family: var(--_font-accent);
  font-weight: var(--fw-medium);
  font-size: clamp(1.7rem, 2.4vw, 2.1rem);
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--t-bright);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-submenu__desc {
  grid-column: 1;
  grid-row: 2;
  margin-top: 0.2rem;
  font-family: var(--_font-default);
  font-size: 1.3rem;
  line-height: 1.3;
  color: var(--t-muted);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.ie-submenu__arrow {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  font-size: 1.7rem;
  color: var(--accent);
  opacity: 0;
  transform: translate(-0.7rem, 0.3rem) rotate(-6deg);
  transition: opacity 0.4s var(--_animbezier), transform 0.4s var(--_animbezier);
}

.no-touch .ie-submenu__link:hover {
  padding-left: 1.6rem;
}

.no-touch .ie-submenu__link:hover .ie-submenu__label,
.ie-submenu__link:focus-visible .ie-submenu__label {
  color: var(--accent);
}

.no-touch .ie-submenu__link:hover .ie-submenu__desc {
  color: var(--t-medium);
}

.no-touch .ie-submenu__link:hover .ie-submenu__arrow,
.ie-submenu__link:focus-visible .ie-submenu__arrow {
  opacity: 1;
  transform: none;
}

/* Current page — keep the relevant submenu item lit so the menu always
   reflects where you are. */
.ie-submenu__link.is-current .ie-submenu__label {
  color: var(--accent);
}

.ie-submenu__link.is-current .ie-submenu__arrow {
  opacity: 1;
  transform: none;
}

/* Larger indent on tablet/desktop so items sit just past the index column */
@media only screen and (min-width: 768px) {
  .ie-submenu__list {
    padding-left: 5rem;
  }
}

/* Desktop: the panel no longer hides overflow, and the body centers only
   when it fits (safe) — so an open submenu can never get clipped above the
   fold; the panel scrolls instead. */
@media only screen and (min-width: 1200px) {
  .mxd-menu__inner {
    overflow-x: hidden;
    overflow-y: auto;
  }
  .ie-menu__body {
    align-content: safe center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ie-submenu {
    transition-duration: 0.001s;
  }
  .ie-submenu__item,
  .ie-nav__toggle,
  .ie-nav__toggle-icon,
  .ie-submenu__link,
  .ie-submenu__arrow {
    transition: none !important;
  }
  .ie-nav__item--open .ie-submenu__item {
    opacity: 1;
    transform: none;
  }
}

/* ------------------------------------------------*/
/* Block - Menu End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - CTA Start */
/* ------------------------------------------------*/
.mxd-promo {
  position: relative;
}

.mxd-promo__inner {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  background-color: var(--base-opp);
  padding-left: 3rem;
  padding-right: 3rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-promo__inner {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-promo__inner {
    padding-left: 6rem;
    padding-right: 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-promo__inner {
    padding-left: 9rem;
    padding-right: 9rem;
  }
}

.mxd-promo__bg {
  position: absolute;
  top: -4rem;
  right: -10rem;
  width: 70%;
  height: -moz-calc(100% + 4rem);
  height: calc(100% + 4rem);
  background-repeat: no-repeat;
  background-position: left center;
  -moz-background-size: cover;
  background-size: cover;
}

@media only screen and (min-width: 1200px) {
  .mxd-promo__bg {
    background-position: center;
    top: 0;
    right: 0;
    width: 50%;
  }
}

.mxd-promo__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6rem;
  margin: 12.2rem 0 14rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-promo__content {
    margin: 14rem 0 16rem 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-promo__content {
    margin: 17.6rem 0 20rem 0;
  }
}

.mxd-promo__title {
  display: block;
  color: var(--t-opp-bright);
}

.mxd-promo__title span {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 1200px) {
  .mxd-promo__title {
    width: 70%;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-promo__title {
    width: 60%;
  }
}

.mxd-promo__logo {
  display: block;
  line-height: 0;
  margin-bottom: 2.6rem;
}

.mxd-promo__logo img {
  display: block;
  width: auto;
  height: 2.8rem;
}

.mxd-promo__logo .logo-light {
  display: block;
}

.mxd-promo__logo .logo-dark {
  display: none;
}

[color-scheme=dark] .mxd-promo__logo .logo-light {
  display: none;
}

[color-scheme=dark] .mxd-promo__logo .logo-dark {
  display: block;
}

@media only screen and (min-width: 768px) {
  .mxd-promo__logo {
    margin-bottom: 3.4rem;
  }
  .mxd-promo__logo img {
    height: 3.6rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-promo__logo img {
    height: 4.4rem;
  }
}

[color-scheme=dark] .btn-rotating__image {
  filter: invert(1);
}

.mxd-promo__caption {
  font: normal var(--fw-medium) 4.4rem/1.1 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-promo__caption {
    font-size: 8rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-promo__caption {
    font-size: 10rem;
  }
}

.mxd-promo__images {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-promo__images {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    top: 0;
    right: 0;
    width: 46%;
    height: 100%;
  }

  .mxd-promo__images .promo-image {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: absolute;
  }

  .mxd-promo__images .promo-image.bottom-layer {
    -webkit-box-ordinal-group: 0;
    -moz-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
  }

  .mxd-promo__images .promo-image-1 {
    width: 330px;
    height: auto;
    right: 6rem;
    bottom: 6rem;
  }

  .mxd-promo__images .promo-image-2 {
    width: 120px;
    height: auto;
    left: 0;
    bottom: 12rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-promo__images .promo-image-2 {
    left: 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-promo__images .promo-image-1 {
    width: 396px;
    right: 9rem;
    bottom: 9rem;
  }

  .mxd-promo__images .promo-image-2 {
    width: 140px;
    left: 6rem;
    bottom: 18rem;
  }
}

/* ------------------------------------------------*/
/* Block - CTA End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Footer Start */
/* ------------------------------------------------*/
.mxd-footer {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-bottom: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-footer {
    padding-bottom: 6rem;
  }
}

.mxd-footer__text-wrap {
  position: relative;
  width: 100%;
}

.mxd-footer__fullwidth-text {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex: none;
  flex: none;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: -webkit-min-content;
  height: -moz-min-content;
  height: min-content;
  max-width: 1920px;
  padding: 0 3rem;
  color: var(--t-bright);
  z-index: -1;
  padding-top: 12.5rem;
  margin-bottom: 2rem;
}

.mxd-footer__fullwidth-text.personal {
  margin-bottom: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-footer__fullwidth-text {
    padding: 0 6rem;
    padding-top: 10.5rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-footer__fullwidth-text.personal {
    margin-bottom: 5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-footer__fullwidth-text {
    padding: 0 9rem;
    padding-top: 11.1rem;
    margin-bottom: -1rem;
  }
}

.mxd-footer__svg-v2 {
  position: relative;
  display: block;
  width: 100%;
  fill: currentColor;
  z-index: -1;
}

.fullwidth-text__tl-trigger {
  position: absolute;
  top: 0;
  right: 0;
  width: 0.1rem;
  height: 0.1rem;
}

.mxd-footer__svg {
  position: relative;
  outline: none;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  will-change: transform;
  opacity: 1;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  transform: none;
}

.mxd-footer__svg foreignObject,
.mxd-footer__svg text {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.mxd-footer__svg text {
  width: 100%;
  height: 100%;
}

.mxd-footer__text {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-style: normal;
  font-weight: var(--fw-semibold);
  line-height: 1.1;
  font-family: var(--_font-accent);
  letter-spacing: -0.006rem;
  color: var(--t-bright);
  font-size: 1.2rem;
}

.mxd-footer__caption {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-style: normal;
  font-weight: var(--fw-semibold);
  line-height: 1.1;
  font-family: var(--_font-accent);
  letter-spacing: -0.014rem;
  color: var(--t-bright);
  font-size: 1.2rem;
}

.mxd-footer__caption .word {
  display: -webkit-box !important;
  display: -moz-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -ms-flex-wrap: nowrap !important;
  flex-wrap: nowrap !important;
}

.mxd-footer__footer-blocks {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  width: 100%;
  max-width: 1920px;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-footer__footer-blocks {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-footer__footer-blocks {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-footer__footer-blocks {
    padding: 0 9rem;
  }
}

.footer-blocks__column {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  gap: 3rem;
}

@media only screen and (min-width: 1200px) {
  .footer-blocks__column {
    height: 650px;
  }
}

@media only screen and (min-width: 1600px) {
  .footer-blocks__column {
    height: 650px;
  }
}

.footer-blocks__card {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  width: 100%;
  padding: 3rem;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

.footer-blocks__card.fullheight-card {
  height: 100%;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.footer-blocks__card.fill-card {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media only screen and (min-width: 768px) {
  .footer-blocks__card {
    padding: 5rem;
  }
}

.footer-blocks__block {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.footer-blocks__nav {
  position: relative;
}

.footer-nav {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.6rem;
}

.footer-nav__item {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.2rem;
}

.footer-nav__link {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.footer-nav__link .btn-caption {
  height: 3.6rem;
  line-height: 1.2;
}

@media only screen and (min-width: 768px) {
  .footer-nav__link {
    font-size: 4.4rem;
  }

  .footer-nav__link .btn-caption {
    height: 5.3rem;
  }
}

.footer-nav__counter {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.4rem;
  background-color: var(--accent);
  color: var(--t-opp-bright);
  height: 3.6rem;
  -moz-border-radius: 1.8rem;
  border-radius: 1.8rem;
  padding: 0 1.2rem;
}

.footer-nav__counter svg {
  width: 1.5rem;
  height: 1.5rem;
}

.footer-nav__counter span {
  font-size: 2.2rem;
  letter-spacing: -0.1rem;
  color: var(--t-opp-bright);
}

.footer-blocks__links {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  text-align: left;
  gap: 1rem;
}

.footer-blocks__links p {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: left;
  gap: 0.2rem;
}

.no-touch .footer-blocks__links p a:hover {
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .footer-blocks__links {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.footer-blocks__title {
  position: relative;
}

.footer-blocks__title-m {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .footer-blocks__title-m {
    font-size: 3.6rem;
  }
}

.footer-blocks__title-l {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .footer-blocks__title-l {
    font-size: 4.4rem;
  }
}

.footer-blocks__socials {
  position: relative;
}

.footer-socials {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.footer-socials__item {
  display: block;
  margin-bottom: 0.3rem;
}

.footer-socials__item:last-of-type {
  margin-bottom: 0;
}

.footer-socials__link {
  font: normal var(--fw-regular) 2.2rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

.no-touch .footer-socials__link:hover {
  color: var(--t-medium);
}

/* Footer - contact + studio cards */
.footer-eyebrow {
  font: normal var(--fw-medium) 1.3rem/1.4 var(--_font-accent);
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--t-muted);
}

.footer-contact {
  display: flex;
  flex-direction: column;
  gap: 1.4rem;
}

.footer-cta {
  -webkit-align-self: flex-start;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.footer-presence {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}

.footer-status {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  font: normal var(--fw-regular) 1.8rem/1.5 var(--_font-accent);
  color: var(--t-bright);
}

.footer-status__dot {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  width: 0.9rem;
  height: 0.9rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: var(--accent);
  -webkit-box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.55);
  box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.55);
  -webkit-animation: footer-status-pulse 2.4s ease-out infinite;
  animation: footer-status-pulse 2.4s ease-out infinite;
}

@-webkit-keyframes footer-status-pulse {
  0% { -webkit-box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.5); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.5); }
  70% { -webkit-box-shadow: 0 0 0 1.1rem rgba(var(--accent-rgb), 0); box-shadow: 0 0 0 1.1rem rgba(var(--accent-rgb), 0); }
  100% { -webkit-box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}

@keyframes footer-status-pulse {
  0% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.5); }
  70% { box-shadow: 0 0 0 1.1rem rgba(var(--accent-rgb), 0); }
  100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}

.footer-clock {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.footer-clock__time {
  font: normal var(--fw-medium) 3.4rem/1 var(--_font-accent);
  letter-spacing: -0.01em;
  color: var(--t-bright);
  font-variant-numeric: tabular-nums;
  -moz-font-feature-settings: "tnum";
  font-feature-settings: "tnum";
}

.footer-clock__zone {
  font: normal var(--fw-regular) 1.5rem/1.4 var(--_font-accent);
  color: var(--t-muted);
}

.footer-tags {
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.footer-tags li {
  display: block;
}

.footer-tags a {
  display: inline-block;
  padding: 0.7rem 1.4rem;
  -moz-border-radius: var(--_radius-s);
  border-radius: var(--_radius-s);
  background-color: var(--base-shade);
  font: normal var(--fw-regular) 1.5rem/1 var(--_font-accent);
  color: var(--t-medium);
  -webkit-transition: color 0.3s var(--_animbezier), background-color 0.3s var(--_animbezier);
  -moz-transition: color 0.3s var(--_animbezier), background-color 0.3s var(--_animbezier);
  transition: color 0.3s var(--_animbezier), background-color 0.3s var(--_animbezier);
}

.no-touch .footer-tags a:hover {
  color: var(--base);
  background-color: var(--accent);
}

@media (prefers-reduced-motion: reduce) {
  .footer-status__dot {
    -webkit-animation: none;
    animation: none;
  }
}

/* ------------------------------------------------*/
/* Block - Footer End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Popup Start */
/* ------------------------------------------------*/
.mfp-bg {
  background-color: rgba(var(--base-rgb), 0.7);
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: var(--t-bright);
  /* overlay at start */
}

.mfp-fade.mfp-bg {
  opacity: 0;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}

/* overlay animate in */
.mfp-fade.mfp-bg.mfp-ready {
  opacity: 1;
}

/* overlay animate out */
.mfp-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

/* content at start */
.mfp-fade.mfp-wrap .mfp-content {
  opacity: 0;
  -webkit-transform: translateY(3rem);
  -moz-transform: translateY(3rem);
  -ms-transform: translateY(3rem);
  transform: translateY(3rem);
  -webkit-transition: all 0.3s var(--_animbezier);
  -moz-transition: all 0.3s var(--_animbezier);
  transition: all 0.3s var(--_animbezier);
}

/* content animate it */
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0);
}

/* content animate out */
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
  -webkit-transform: translateY(-3rem);
  -moz-transform: translateY(-3rem);
  -ms-transform: translateY(-3rem);
  transform: translateY(-3rem);
}

/* ------------------------------------------------*/
/* Block - Popup End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #00 Start */
/* ------------------------------------------------*/
.mxd-hero-00 {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

.mxd-hero-00__wrap {
  position: relative;
  width: 100%;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-00__wrap {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-00__wrap {
    height: 100%;
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-00__wrap {
    padding: 0 9rem;
  }
}

.mxd-hero-00__top {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: auto;
  padding: 11.5rem 0 11.2rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-00__top {
    padding: 12.6rem 0 12.8rem 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-00__top {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 0;
    padding-top: 12.9rem;
    padding-bottom: 11.5rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-hero-00__top {
    padding-top: 12.9rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-00__top {
    padding-top: 17rem;
    padding-bottom: 14.8rem;
  }
}

.mxd-hero-00__bottom {
  position: relative;
  width: 100%;
}

.mxd-hero-00__title-wrap {
  position: relative;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-00__title-wrap {
    width: auto;
  }
}

.mxd-hero-00__marquee {
  position: absolute;
  top: 7.6rem;
  right: 0;
  width: 100%;
  background-color: var(--accent);
  border: 1px solid var(--base);
  -moz-border-radius: 3.3rem;
  border-radius: 3.3rem;
  overflow: hidden;
}

.mxd-hero-00__marquee .marquee-flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

.mxd-hero-00__marquee .marquee__item.item-regular {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin: 0;
  color: var(--t-opp-bright);
}

.mxd-hero-00__marquee .marquee__item.item-regular p {
  font: normal var(--fw-medium) 6rem/1.1 var(--_font-accent);
  color: var(--t-opp-bright);
}

.mxd-hero-00__marquee .marquee__item.item-regular svg {
  width: 3.7rem;
  height: 3.7rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-00__marquee {
    top: 0;
    width: 484px;
    height: 88px;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
  }

  .mxd-hero-00__marquee .marquee-flex {
    gap: 2.6rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular {
    gap: 2rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular p {
    font-size: 8rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular svg {
    width: 5.1rem;
    height: 5.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-00__marquee {
    width: 719px;
    height: 132px;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular {
    gap: 2.6rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular p {
    font-size: 12rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular svg {
    width: 8.5rem;
    height: 8.5rem;
    fill: currentColor;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-00__marquee {
    width: 816px;
    height: 154px;
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular p {
    font-size: 14rem;
  }

  .mxd-hero-00__marquee .marquee__item.item-regular svg {
    width: 9.1rem;
    height: 9.1rem;
  }
}

.hero-00-title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-00-title {
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 1.4rem;
    font-size: 8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-00-title {
    gap: 2rem;
    font-size: 12rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-00-title {
    font-size: 14rem;
  }
}

.hero-00-title__row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .hero-00-title__row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-00-title__row {
    gap: 3.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-00-title__row {
    gap: 3.4rem;
  }
}

.hero-00-title__item {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.hero-00-title__item.title-item-transparent {
  opacity: 0;
}

.hero-00-title__item.title-item-image {
  display: none;
}

.hero-00-title__item.title-item-image svg {
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .hero-00-title__item {
    white-space: nowrap;
  }

  .hero-00-title__item.title-item-transparent {
    padding: 0 5rem;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
    color: var(--t-opp-bright);
  }

  .hero-00-title__item.title-item-image {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-top: 1rem;
  }

  .hero-00-title__item.title-item-image svg {
    width: 5.1rem;
    height: 5.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-00-title__item.title-item-transparent {
    padding: 0 7rem;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .hero-00-title__item.title-item-image svg {
    width: 8.5rem;
    height: 8.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-00-title__item.title-item-transparent {
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .hero-00-title__item.title-item-image svg {
    width: 9.1rem;
    height: 9.1rem;
  }
}

.mxd-hero-00__images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero-00-image {
  position: absolute;
  display: none;
}

@media only screen and (min-width: 768px) {
  .hero-00-image {
    display: block;
  }

  .hero-00-image.image-01 {
    top: -16%;
    left: -6%;
    width: 180px;
  }

  .hero-00-image.image-02 {
    top: -40%;
    left: auto;
    right: 4%;
    width: 100px;
    z-index: 1;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-00-image.image-01 {
    width: 260px;
    top: -14%;
    left: -9%;
  }

  .hero-00-image.image-02 {
    width: 140px;
    right: -6%;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-00-image.image-01 {
    width: 300px;
  }

  .hero-00-image.image-02 {
    width: 180px;
    top: -40%;
  }
}

.hero-00-manifest {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.hero-00-manifest .mxd-manifest {
  line-height: 1.5;
}

@media only screen and (min-width: 768px) {
  .hero-00-manifest .mxd-manifest {
    font-size: 3rem;
    max-width: 780px;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-00-manifest .mxd-manifest {
    font-size: 3.8rem;
    max-width: 1000px;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-00-manifest .mxd-manifest {
    font-size: 4.4rem;
    max-width: 1150px;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #00 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #01 Start */
/* ------------------------------------------------*/
.mxd-hero-section {
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-section {
    padding-top: 9.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-fullheight {
    height: 100vh;
  }
}

.mxd-hero-01 {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01 {
    height: 100%;
    padding-bottom: 4rem;
  }
}

.mxd-hero-01__wrap {
  position: relative;
  width: 100%;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-01__wrap {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__wrap {
    height: 100%;
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__wrap {
    padding: 0 9rem;
  }
}

.mxd-hero-01__top {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: auto;
  padding: 11.5rem 0 12.9rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-01__top {
    padding: 12.6rem 0 14.6rem 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__top {
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: -moz-calc(100% - 16rem);
    height: calc(100% - 16rem);
    padding: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__top {
    height: -moz-calc(100% - 20rem);
    height: calc(100% - 20rem);
  }
}

.mxd-hero-01__title-wrap {
  position: relative;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-01__title-wrap {
    width: auto;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__title-wrap {
    padding-bottom: 2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__title-wrap {
    padding-bottom: 4rem;
  }
}

.mxd-hero-01__marquee {
  position: absolute;
  top: 7.6rem;
  right: 0;
  width: 100%;
  background-color: var(--accent);
  border: 1px solid var(--base);
  -moz-border-radius: 3.3rem;
  border-radius: 3.3rem;
  overflow: hidden;
}

.mxd-hero-01__marquee .marquee-flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

.mxd-hero-01__marquee .marquee__item.item-regular {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin: 0;
  color: var(--t-opp-bright);
}

.mxd-hero-01__marquee .marquee__item.item-regular p {
  font: normal var(--fw-medium) 6rem/1.1 var(--_font-accent);
  color: var(--t-opp-bright);
}

.mxd-hero-01__marquee .marquee__item.item-regular svg {
  width: 3.7rem;
  height: 3.7rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-01__marquee {
    top: 0;
    right: 7rem;
    width: 265px;
    height: 88px;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
  }

  .mxd-hero-01__marquee .marquee-flex {
    gap: 2.6rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular {
    gap: 2rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular p {
    font-size: 8rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular svg {
    width: 5.1rem;
    height: 5.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__marquee {
    right: 11rem;
    width: 389px;
    height: 132px;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular {
    gap: 2.6rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular p {
    font-size: 12rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular svg {
    width: 8.5rem;
    height: 8.5rem;
    fill: currentColor;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__marquee {
    right: 13.3rem;
    width: 430px;
    height: 154px;
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular p {
    font-size: 14rem;
  }

  .mxd-hero-01__marquee .marquee__item.item-regular svg {
    width: 9.2rem;
    height: 9.2rem;
  }
}

.hero-01-title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-01-title {
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 1.4rem;
    font-size: 8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-01-title {
    gap: 2rem;
    font-size: 12rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-01-title {
    font-size: 14rem;
  }
}

.hero-01-title__row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .hero-01-title__row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-01-title__row {
    gap: 3.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-01-title__row {
    gap: 3.4rem;
  }
}

.hero-01-title__item {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.hero-01-title__item.title-item-transparent {
  opacity: 0;
}

.hero-01-title__item.title-item-image {
  display: none;
}

.hero-01-title__item.title-item-image svg {
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .hero-01-title__item {
    white-space: nowrap;
  }

  .hero-01-title__item.title-item-transparent {
    padding: 0 5rem;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
    color: var(--t-opp-bright);
  }

  .hero-01-title__item.title-item-image {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-top: 1rem;
  }

  .hero-01-title__item.title-item-image svg {
    width: 5.1rem;
    height: 5.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-01-title__item.title-item-transparent {
    padding: 0 7rem;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .hero-01-title__item.title-item-image svg {
    width: 8.5rem;
    height: 8.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-01-title__item.title-item-transparent {
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .hero-01-title__item.title-item-image svg {
    width: 9.2rem;
    height: 9.2rem;
  }
}

.mxd-hero-01__images {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero-01-image {
  position: absolute;
  display: none;
}

.hero-01-image.image-01 {
  width: 180px;
  top: -6%;
  left: -20%;
}

.hero-01-image.image-02 {
  top: -20%;
  right: -1.5rem;
}

.hero-01-image.image-03 {
  top: 86%;
  left: 0;
}

.hero-01-image.image-02,
.hero-01-image.image-03 {
  width: 100px;
  z-index: 1;
}

@media only screen and (min-width: 768px) {
  .hero-01-image {
    display: block;
  }

  .hero-01-image.image-01 {
    top: -26%;
    left: -5%;
  }

  .hero-01-image.image-02 {
    top: -36%;
    left: auto;
    right: 5%;
  }

  .hero-01-image.image-03 {
    top: 90%;
    left: 35%;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-01-image.image-01 {
    width: 260px;
    top: -24%;
    left: -7%;
  }

  .hero-01-image.image-02,
  .hero-01-image.image-03 {
    width: 140px;
  }

  .hero-01-image.image-02 {
    top: -34%;
    right: 6%;
  }

  .hero-01-image.image-03 {
    top: 80%;
    left: 42%;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-01-image.image-01 {
    width: 300px;
  }

  .hero-01-image.image-02,
  .hero-01-image.image-03 {
    width: 180px;
  }

  .hero-01-image.image-03 {
    top: 76%;
    left: 38%;
  }

  .hero-01-image.image-02 {
    top: -36%;
    right: 5%;
  }
}

.mxd-hero-01__bottom {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__bottom {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 6rem;
    height: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__bottom {
    height: 20rem;
  }
}

.mxd-hero-01__data-wrap {
  position: relative;
  padding: 14rem 0 13.2rem 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__data-wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__data-wrap {
    padding-right: 15rem;
  }
}

.mxd-hero-01__dash-line {
  display: none;
  width: 100%;
  height: 1rem;
  position: absolute;
  top: 0;
  left: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__dash-line {
    display: block;
  }
}

.dash-line {
  --s: 0.8rem;
  height: 3px;
  background: -moz-radial-gradient(circle closest-side, var(--st-muted) 98%, rgba(0, 0, 0, 0)) 0 0/var(--s) 100%, -moz-linear-gradient(left, var(--st-muted) 50%, rgba(0, 0, 0, 0) 0) -moz-calc(var(--s) / 2) 0/calc(2 * var(--s)) 100%;
  background: radial-gradient(circle closest-side, var(--st-muted) 98%, rgba(0, 0, 0, 0)) 0 0/var(--s) 100%, -webkit-gradient(linear, left top, right top, color-stop(50%, var(--st-muted)), color-stop(0, rgba(0, 0, 0, 0))) calc(var(--s) / 2) 0/calc(2 * var(--s)) 100%;
  background: radial-gradient(circle closest-side, var(--st-muted) 98%, rgba(0, 0, 0, 0)) 0 0/var(--s) 100%, linear-gradient(90deg, var(--st-muted) 50%, rgba(0, 0, 0, 0) 0) calc(var(--s) / 2) 0/calc(2 * var(--s)) 100%;
}

.mxd-hero-01__data-btn {
  margin-bottom: 3.1rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__data-btn {
    -ms-flex-preferred-size: 12rem;
    flex-basis: 12rem;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 12rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__data-btn {
    -ms-flex-preferred-size: 16rem;
    flex-basis: 16rem;
    height: 16rem;
  }
}

.mxd-hero-01__data-descr {
  margin-bottom: 2.3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__data-descr {
    width: 386px;
    margin-bottom: 0;
  }
}

.mxd-hero-01__data-socials ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-hero-01__data-socials ul li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.2rem;
  color: var(--t-bright);
}

.mxd-hero-01__data-socials ul li svg {
  width: 1.5rem;
  height: 1.5rem;
  fill: currentColor;
}

.mxd-hero-01__data-socials ul li a {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__data-socials ul li svg {
    width: 1.9rem;
    height: 1.9rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__data-socials ul li a {
    font-size: 2.2rem;
  }
}

.mxd-hero-01__video-wrap {
  position: relative;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-01__video-wrap {
    -ms-flex-preferred-size: 24.6rem;
    flex-basis: 24.6rem;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-01__video-wrap {
    -ms-flex-preferred-size: 30.8rem;
    flex-basis: 30.8rem;
    height: 20rem;
  }
}

.mxd-hero-01__video-btn {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 1rem;
}

.mxd-hero-01__video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-pulse {
  -webkit-animation: mxd-pulse 1.2s infinite ease-in-out alternate;
  -moz-animation: mxd-pulse 1.2s infinite ease-in-out alternate;
  animation: mxd-pulse 1.2s infinite ease-in-out alternate;
}

@-webkit-keyframes mxd-pulse {
  from {
    -webkit-transform: scale(0.94);
    transform: scale(0.94);
  }

  to {
    -webkit-transform: scale(1.06);
    transform: scale(1.06);
  }
}

@-moz-keyframes mxd-pulse {
  from {
    -moz-transform: scale(0.94);
    transform: scale(0.94);
  }

  to {
    -moz-transform: scale(1.06);
    transform: scale(1.06);
  }
}

@keyframes mxd-pulse {
  from {
    -webkit-transform: scale(0.94);
    -moz-transform: scale(0.94);
    transform: scale(0.94);
  }

  to {
    -webkit-transform: scale(1.06);
    -moz-transform: scale(1.06);
    transform: scale(1.06);
  }
}

.mxd-pulse-small {
  -webkit-animation: mxd-pulse 1.2s infinite ease-in-out alternate;
  -moz-animation: mxd-pulse 1.2s infinite ease-in-out alternate;
  animation: mxd-pulse 1.2s infinite ease-in-out alternate;
}

@keyframes mxd-pulse {
  from {
    -webkit-transform: scale(0.94);
    -moz-transform: scale(0.94);
    transform: scale(0.94);
  }

  to {
    -webkit-transform: scale(1.02);
    -moz-transform: scale(1.02);
    transform: scale(1.02);
  }
}

.mxd-move {
  -webkit-animation: mxd-move 1.2s infinite ease-in-out alternate;
  -moz-animation: mxd-move 1.2s infinite ease-in-out alternate;
  animation: mxd-move 1.2s infinite ease-in-out alternate;
}

.mxd-move-slow {
  -webkit-animation: mxd-move 2s infinite ease-in-out alternate;
  -moz-animation: mxd-move 2s infinite ease-in-out alternate;
  animation: mxd-move 2s infinite ease-in-out alternate;
}

@-webkit-keyframes mxd-move {
  from {
    -webkit-transform: translateY(-1rem);
    transform: translateY(-1rem);
  }

  to {
    -webkit-transform: translateY(1rem);
    transform: translateY(1rem);
  }
}

@-moz-keyframes mxd-move {
  from {
    -moz-transform: translateY(-1rem);
    transform: translateY(-1rem);
  }

  to {
    -moz-transform: translateY(1rem);
    transform: translateY(1rem);
  }
}

@keyframes mxd-move {
  from {
    -webkit-transform: translateY(-1rem);
    -moz-transform: translateY(-1rem);
    transform: translateY(-1rem);
  }

  to {
    -webkit-transform: translateY(1rem);
    -moz-transform: translateY(1rem);
    transform: translateY(1rem);
  }
}

.mxd-rotate {
  -webkit-animation: spin 5s linear infinite;
  -moz-animation: spin 5s linear infinite;
  animation: spin 5s linear infinite;
}

.mxd-rotate-slow {
  -webkit-animation: spin 16s linear infinite;
  -moz-animation: spin 16s linear infinite;
  animation: spin 16s linear infinite;
}

/* ------------------------------------------------*/
/* Block - Hero Section #01 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #02 Start */
/* ------------------------------------------------*/
.mxd-hero-02 {
  position: relative;
}

.hero-02-static__tl-trigger {
  position: absolute;
  top: 14%;
  right: 0;
  width: 1px;
  height: 1px;
}

.mxd-hero-02-static__top {
  position: relative;
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-static__top {
    padding-top: 9.6rem;
  }
}

.hero-02-static__caption {
  margin-top: 2rem;
}

@media only screen and (min-width: 768px) {
  .hero-02-static__caption {
    margin-top: 3rem;
  }
}

.mxd-hero-02-static__bottom {
  position: absolute;
  bottom: 3rem;
  left: 0;
  width: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-static__bottom {
    position: absolute;
    bottom: 4rem;
    left: 0;
  }
}

.mxd-hero-02-static__btn {
  display: none;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-static__btn {
    display: block;
    position: absolute;
    right: 6rem;
    bottom: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-static__btn {
    position: absolute;
    right: 9rem;
    bottom: 4rem;
  }
}

.mxd-hero-02-static__center {
  position: absolute;
  left: 0;
  top: 50%;
  bottom: auto;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 100%;
}

.mxd-hero-02-marquee {
  position: relative;
  color: var(--t-bright);
}

.mxd-hero-02-marquee .marquee__item.item-regular {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 3rem;
  margin: 0;
}

.mxd-hero-02-marquee .marquee__text {
  font-size: 10rem;
  font-weight: var(--fw-medium);
  color: var(--t-bright);
  margin: 0;
}

.mxd-hero-02-marquee .marquee__image {
  width: 7.1rem;
  height: 7.1rem;
}

.mxd-hero-02-marquee .marquee__image svg {
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-marquee .marquee__item.item-regular {
    gap: 4rem;
  }

  .mxd-hero-02-marquee .marquee__text {
    font-size: 14rem;
  }

  .mxd-hero-02-marquee .marquee__image {
    width: 9.1rem;
    height: 9.1rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-marquee .marquee__item.item-regular {
    gap: 5rem;
  }

  .mxd-hero-02-marquee .marquee__text {
    font-size: 18rem;
  }

  .mxd-hero-02-marquee .marquee__image {
    width: 12.1rem;
    height: 12.1rem;
  }
}

.mxd-hero-02-marquee__image {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  z-index: 2;
  width: 18rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-marquee__image {
    width: 30rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-marquee__image {
    width: 42rem;
  }
}

.mxd-hero-02-marquee__line .marquee__toleft {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-marquee__line .marquee__toleft {
    gap: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-marquee__line .marquee__toleft {
    gap: 5rem;
  }
}

.mxd-hero-02-scroll__wrap {
  padding: 0 3rem;
  padding-bottom: 100vh;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-scroll__wrap {
    padding: 0 6rem;
    padding-bottom: 100vh;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-scroll__wrap {
    padding-bottom: 100vh;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-scroll__wrap {
    padding: 0 9rem;
    padding-bottom: 100vh;
  }
}

.mxd-hero-02-scroll__images {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-scroll__images {
    gap: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-scroll__images {
    gap: 10rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-scroll__images {
    gap: 14rem;
  }
}

.mxd-hero-02-images__row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-images__row {
    gap: 6rem;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-images__row {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }
}

.mxd-hero-02-images__row-02,
.mxd-hero-02-images__row-03 {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.mxd-hero-02-image__landscape,
.mxd-hero-02-image__portrait {
  position: relative;
  display: block;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-image__portrait.portrait-01 {
    padding-bottom: 9rem;
  }

  .mxd-hero-02-image__portrait.portrait-02 {
    margin-top: -3rem;
  }

  .mxd-hero-02-image__portrait.portrait-03 {
    margin-top: -9rem;
  }

  .mxd-hero-02-image__portrait.portrait-04 {
    padding-top: 3rem;
  }

  .mxd-hero-02-image__portrait.portrait-05 {
    padding-left: 30%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-image__portrait.portrait-01 {
    padding-bottom: 9rem;
  }

  .mxd-hero-02-image__portrait.portrait-02 {
    margin-top: 0;
    padding-top: 8rem;
    padding-bottom: 3rem;
  }

  .mxd-hero-02-image__portrait.portrait-03 {
    margin-top: 0;
  }

  .mxd-hero-02-image__portrait.portrait-04 {
    padding-top: 0;
    margin-top: -10rem;
  }

  .mxd-hero-02-image__portrait.portrait-05 {
    padding-left: 0;
  }
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-image__landscape.landscape-02 {
    padding-top: 100px;
  }

  .mxd-hero-02-image__landscape.landscape-03 {
    padding-top: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-image__landscape.landscape-02 {
    padding-top: 100px;
  }

  .mxd-hero-02-image__landscape.landscape-03 {
    padding-top: 60px;
  }
}

.mxd-hero-02-image__inner {
  position: relative;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  -webkit-box-shadow: 0 29px 58px rgba(0, 0, 0, 0.3), 0 25px 22px rgba(0, 0, 0, 0.22);
  -moz-box-shadow: 0 29px 58px rgba(0, 0, 0, 0.3), 0 25px 22px rgba(0, 0, 0, 0.22);
  box-shadow: 0 29px 58px rgba(0, 0, 0, 0.3), 0 25px 22px rgba(0, 0, 0, 0.22);
  overflow: hidden;
}

.no-touch .mxd-hero-02-image__inner:hover .mxd-preview-hover {
  opacity: 1;
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.mxd-hero-02-image__inner.type-01,
.mxd-hero-02-image__inner.type-02 {
  width: 220px;
  height: 266px;
}

.mxd-hero-02-image__inner.type-03 {
  width: 300px;
  height: 200px;
}

.mxd-hero-02-image__inner img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-02-image__inner.type-03 {
    width: 360px;
    height: 237px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-02-image__inner.type-01 {
    width: 280px;
    height: 340px;
  }

  .mxd-hero-02-image__inner.type-02 {
    width: 500px;
    height: 640px;
  }

  .mxd-hero-02-image__inner.type-03 {
    width: 440px;
    height: 290px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-02-image__inner.type-01 {
    width: 400px;
    height: 480px;
  }

  .mxd-hero-02-image__inner.type-02 {
    width: 760px;
    height: 940px;
  }

  .mxd-hero-02-image__inner.type-03 {
    width: 620px;
    height: 420px;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #02 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #03 Start */
/* ------------------------------------------------*/
.mxd-hero-03 {
  position: relative;
  width: 100%;
}

.mxd-hero-03__wrap {
  position: relative;
  width: 100%;
}

.mxd-hero-03__top {
  position: relative;
  height: -moz-calc(100vh - 7.6rem);
  height: calc(100vh - 7.6rem);
  padding-top: 12rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-03__top {
    height: -moz-calc(100vh - 9.6rem);
    height: min(calc(100vh - 9.6rem), 76rem);
    padding-top: 14rem;
  }
}

.mxd-hero-03__bottom {
  position: relative;
}

.mxd-hero-03__marquee {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  overflow: hidden;
}

.mxd-hero-03__marquee .marquee__item {
  width: auto;
  height: auto;
  padding: 1rem 0;
  margin-right: 6rem;
  -moz-border-radius: 0;
  border-radius: 0;
  overflow: visible;
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-03__marquee .marquee__item {
    margin-right: 6rem;
  }
}

.hero-03-marquee__video {
  width: 80vw;
  height: 80vw;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
  /* Beautiful shimmering skeleton shown while the video buffers, instead of
     flashing the poster image. Stops automatically once the video is loaded. */
  background-color: #15151c;
  background-image: linear-gradient(110deg, #15151c 28%, #262635 50%, #15151c 72%);
  background-size: 220% 100%;
  animation: hero-skeleton-shimmer 1.8s ease-in-out infinite;
}

.hero-03-marquee__video:has(video.is-loaded) {
  background: transparent;
  animation: none;
}

/* The tile must never read as an empty grey circle while a video buffers.
   The poster is a tiny webp that paints immediately, so reveal it (it sits
   under the shimmer) instead of hiding the <video> until playback. The video
   still fades in on top once it actually plays. */
.hero-03-marquee__video video.lazy-video {
  opacity: 1;
}

@keyframes hero-skeleton-shimmer {
  0% {
    background-position: 220% 0;
  }

  100% {
    background-position: -120% 0;
  }
}

.hero-03-marquee__video video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .hero-03-marquee__video {
    width: 42vw;
    height: 42vw;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-03-marquee__video {
    width: 26vw;
    height: 26vw;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-03-marquee__video {
    width: 24vw;
    height: 24vw;
  }
}

.hero-03-marquee__image {
  position: relative;
  width: 80vw;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .hero-03-marquee__image {
    width: 42vw;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-03-marquee__image {
    width: 26vw;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-03-marquee__image {
    width: 24vw;
  }
}

.mxd-hero-03__headline {
  position: absolute;
  bottom: 6rem;
  left: 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding: 0 1.5rem;
  mix-blend-mode: difference;
}

.mxd-hero-03__headline svg {
  fill: #ffffff;
  mix-blend-mode: difference;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-03__headline {
    padding: 0 4.5rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-hero-03__headline {
    bottom: 2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-03__headline {
    padding: 0 7.5rem;
  }
}

.hero-03-headline__caption {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: #ffffff;
  margin-bottom: 5.2rem;
}

@media only screen and (min-width: 768px) {
  .hero-03-headline__caption {
    font-size: 4.4rem;
    margin-bottom: 4.7rem;
  }
}

@media only screen and (min-width: 992px) {
  .hero-03-headline__caption {
    margin-bottom: 1rem;
  }
}

.hero-03-headline__hidden {
  display: none;
}

.hero-03-headline__svg-mobile {
  display: block;
}

@media only screen and (min-width: 992px) {
  .hero-03-headline__svg-mobile {
    display: none;
  }
}

.hero-03-headline__svg {
  display: none;
}

@media only screen and (min-width: 992px) {
  .hero-03-headline__svg {
    display: block;
  }
}

/* Phones: size the hero's top to its CONTENT (circle + headline) instead of a
   full screen, and top-anchor the marquee so the circle sits just under the
   nav. By default the circle is vertically centered in a `100vh` box, which
   dumps all the unused height as dead space ABOVE the circle and pushes the
   next section off-screen. Anchoring the circle to the top removes that gap and
   pulls the following section up into view, while the "Cinema-grade AI"
   caption still overlaps/reflects over the circle and "insanely elegant" sits
   just below it, the same as desktop.
   Height = circle (80vw) + room for the headline that overlaps below it. */
@media only screen and (max-width: 767px) {
  .mxd-hero-03__top {
    height: -webkit-calc(80vw + 18rem);
    height: calc(80vw + 18rem);
    padding-top: 0;
  }

  .mxd-hero-03__marquee {
    top: 2rem;
    bottom: auto;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #03 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #04 Start */
/* ------------------------------------------------*/
.mxd-hero-04 {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-top: 14rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04 {
    padding-top: 16rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-04 {
    padding-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04 {
    padding-top: 4rem;
  }
}

.mxd-page-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero-04-bg {
  height: 300vh;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .hero-04-bg {
    height: 200vh;
  }
}

.hero-04-bg__obj-01,
.hero-04-bg__obj-02 {
  position: absolute;
}

.hero-04-bg__obj-01 img,
.hero-04-bg__obj-02 img {
  display: block;
  width: 100%;
  height: auto;
}

.hero-04-bg__obj-01 {
  top: 680px;
  left: -50px;
  width: 240px;
}

@media only screen and (min-width: 768px) {
  .hero-04-bg__obj-01 {
    width: 340px;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-04-bg__obj-01 {
    top: 360px;
    width: 340px;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-04-bg__obj-01 {
    top: 400px;
    left: -90px;
    width: 460px;
  }
}

.hero-04-bg__obj-02 {
  top: 10px;
  right: -30px;
  width: 200px;
}

@media only screen and (min-width: 768px) {
  .hero-04-bg__obj-02 {
    top: 40px;
    right: -60px;
    width: 360px;
  }
}

@media only screen and (min-width: 992px) {
  .hero-04-bg__obj-02 {
    top: 40px;
    right: -60px;
    width: 460px;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-04-bg__obj-02 {
    top: 410px;
    right: -60px;
    width: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-04-bg__obj-02 {
    top: 430px;
    right: -60px;
    width: 600px;
  }
}

.mxd-hero-04__wrap {
  position: relative;
  width: 100%;
  padding: 0 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__wrap {
    padding: 0 4.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-04__wrap {
    height: 100%;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04__wrap {
    padding: 0 7.5rem;
  }
}

.mxd-hero-04__left {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__left {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-04__left {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.mxd-hero-04__right {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.9rem;
  padding-bottom: 5.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__right {
    gap: 5.2rem;
    padding-bottom: 7.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-04__right {
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04__right {
    gap: 6.8rem;
  }
}

.mxd-hero-04__imageblock {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
  padding: 3rem;
  -moz-border-radius: 3.6rem;
  border-radius: 3.6rem;
  background-color: rgba(var(--accent-rgb), 0.7);
  border: 1px solid rgba(var(--accent-rgb), 0.8);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.mxd-hero-04__imageblock p {
  font: normal var(--fw-medium) 2.5rem/1.2 var(--_font-accent);
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__imageblock {
    padding: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04__imageblock {
    font-size: 3rem;
  }
}

.hero-04-imageblock__btn {
  position: absolute;
  top: 1rem;
  right: 1rem;
}

.mxd-hero-04__aboutblock {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
  padding: 3rem;
  -moz-border-radius: 3.6rem;
  border-radius: 3.6rem;
  background-color: rgba(var(--additional-rgb), 0.7);
  border: 1px solid rgba(var(--additional-rgb), 0.9);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.mxd-hero-04__aboutblock p {
  font: normal var(--fw-medium) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__aboutblock {
    padding: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04__aboutblock p {
    font-size: 2.2rem;
  }
}

.mxd-hero-04__headline {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-04__headline {
    gap: 3.8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-04__headline {
    gap: 3.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-04__headline {
    gap: 4.8rem;
  }
}

.mxd-hero-04__headline,
.mxd-hero-04__descr {
  padding: 0;
}

@media only screen and (min-width: 1200px) {

  .mxd-hero-04__headline,
  .mxd-hero-04__descr {
    padding: 0 3rem;
  }
}

@media only screen and (min-width: 1600px) {

  .mxd-hero-04__headline,
  .mxd-hero-04__descr {
    padding: 0 6rem;
  }
}

.hero-04-title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.hero-04-title__row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-04-title__row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-04-title__row {
    gap: 3.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-04-title__row {
    gap: 3.4rem;
  }
}

.hero-04-title__item {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.hero-04-title__item.title-item-transparent {
  opacity: 0;
}

.hero-04-title__item.title-item-image {
  padding-top: 1rem;
  display: none;
}

.hero-04-title__item.title-item-image svg {
  width: 3.5rem;
  height: 3.5rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .hero-04-title__item {
    white-space: nowrap;
  }

  .hero-04-title__item.title-item-transparent {
    padding: 0 5rem;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
    color: var(--t-opp-bright);
  }

  .hero-04-title__item.title-item-image {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-top: 1rem;
  }

  .hero-04-title__item.title-item-image svg {
    width: 7.5rem;
    height: 7.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-04-title__item.title-item-transparent {
    padding: 0 7rem;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .hero-04-title__item.title-item-image svg {
    width: 7.5rem;
    height: 7.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-04-title__item.title-item-transparent {
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .hero-04-title__item.title-item-image svg {
    width: 8.2rem;
    height: 8.2rem;
  }
}

.hero-04-marquee {
  position: relative;
  width: 100%;
  height: 4.6rem;
  line-height: 4.6rem;
  -moz-border-radius: 2.3rem;
  border-radius: 2.3rem;
  border: 1px solid var(--st-opp-bright);
  background-color: var(--neutral-transparent);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: var(--t-bright);
}

.hero-04-marquee p {
  font: normal var(--fw-medium) 1.8rem/4.6rem var(--_font-accent);
  color: var(--t-bright);
}

.hero-04-marquee svg {
  width: 1.7rem;
  height: 1.7rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .hero-04-marquee {
    height: 5.6rem;
    -moz-border-radius: 2.8rem;
    border-radius: 2.8rem;
  }

  .hero-04-marquee p {
    font-size: 2.2rem;
    line-height: 5.6rem;
  }

  .hero-04-marquee svg {
    width: 1.9rem;
    height: 1.9rem;
  }
}

.hero-04-marquee .marquee-flex {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

.hero-04-marquee .marquee__item.item-regular {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .hero-04-marquee .marquee-flex {
    gap: 1.4rem;
  }

  .hero-04-marquee .marquee__item.item-regular {
    gap: 1.4rem;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #04 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #05 Start */
/* ------------------------------------------------*/
.mxd-hero-05 {
  position: relative;
  width: 100%;
  max-width: 1920px;
  margin: 0 auto;
  padding-top: 12rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05 {
    padding-top: 16rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-05 {
    padding-top: 13.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-05 {
    padding-top: 17rem;
  }
}

.mxd-hero-05__wrap {
  position: relative;
  width: 100%;
  padding: 0 1.5rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05__wrap {
    padding: 0 4.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-05__wrap {
    height: 100%;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-05__wrap {
    padding: 0 7.5rem;
  }
}

.mxd-hero-05__top {
  margin-bottom: 4.9rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-05__top {
    margin-bottom: 8.2rem;
  }
}

.mxd-hero-05__bottom {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05__bottom {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

.mxd-hero-05__worksblock {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
  padding: 3rem;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  background-color: var(--base-tint);
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05__worksblock {
    -ms-flex-preferred-size: 30rem;
    flex-basis: 30rem;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    padding: 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-05__worksblock {
    -ms-flex-preferred-size: 43rem;
    flex-basis: 43rem;
    padding: 4rem 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-05__worksblock {
    -ms-flex-preferred-size: 55.5rem;
    flex-basis: 55.5rem;
    padding: 4rem 8rem;
  }
}

.hero-05-worksblock__descr {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 3rem;
  text-align: center;
}

.mxd-hero-05__videoblock {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding: 3rem;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
}

.mxd-hero-05__videoblock img {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05__videoblock {
    padding: 4rem;
  }
}

.mxd-hero-05-videoblock__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.mxd-hero-05-videoblock__video video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-hero-05-videoblock__descr {
  position: relative;
  padding: 3rem;
  background-color: rgba(255, 255, 255, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.3);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

.mxd-hero-05-videoblock__descr p {
  color: var(--pt-t-dark-bright);
  font-weight: 500;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-05-videoblock__descr {
    padding: 3rem 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-05-videoblock__descr {
    max-width: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-05-videoblock__descr {
    max-width: 535px;
  }
}

.hero-05-title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 3.5rem;
}

@media only screen and (min-width: 1200px) {
  .hero-05-title {
    margin-top: 0;
  }
}

.hero-05-title__row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-05-title__row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-05-title__row {
    gap: 3.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-05-title__row {
    gap: 3.4rem;
  }
}

.hero-05-title__item {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.hero-05-title__item.title-item-transparent {
  opacity: 0;
}

.hero-05-title__item.title-item-image {
  padding-top: 1rem;
  display: none;
}

.hero-05-title__item.title-item-image svg {
  width: 3.5rem;
  height: 3.5rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .hero-05-title__item.title-item-transparent {
    padding: 0 5rem;
    -moz-border-radius: 4.4rem;
    border-radius: 4.4rem;
    color: var(--t-opp-bright);
  }

  .hero-05-title__item.title-item-image {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-top: 1rem;
  }

  .hero-05-title__item.title-item-image svg {
    width: 4.1rem;
    height: 4.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-05-title__item.title-item-transparent {
    padding: 0 7rem;
    -moz-border-radius: 6.6rem;
    border-radius: 6.6rem;
  }

  .hero-05-title__item.title-item-image svg {
    width: 7.5rem;
    height: 7.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-05-title__item.title-item-transparent {
    -moz-border-radius: 7.7rem;
    border-radius: 7.7rem;
  }

  .hero-05-title__item.title-item-image svg {
    width: 8.2rem;
    height: 8.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-05-headline__avatars {
    padding-top: 2.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-05-headline__avatars {
    padding-top: 3rem;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #05 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #06 Start */
/* ------------------------------------------------*/
.mxd-hero-06 {
  position: relative;
  width: 100%;
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06 {
    padding-top: 9.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06 {
    height: 100vh;
  }
}

.mxd-hero-06__wrap {
  position: relative;
  width: 100%;
  height: 100%;
  padding-top: 10.9rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__wrap {
    padding-top: 14.9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__wrap {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 4rem 6rem 0 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-06__wrap {
    padding: 4rem 9rem 0 9rem;
  }
}

.mxd-hero-06__top {
  position: relative;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__top {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }
}

.mxd-hero-06__bottom {
  position: relative;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__bottom {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__bottom {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 4rem 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-06__bottom {
    padding: 4rem 0;
  }
}

.mxd-hero-06__btn-mobile {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 3rem;
  margin-top: 5.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__btn-mobile {
    padding: 0 6rem;
    margin-top: 7.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__btn-mobile {
    display: none;
  }
}

.mxd-hero-06__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  width: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    height: 100%;
  }
}

.mxd-hero-06__video {
  padding: 0 3rem;
  margin-bottom: 1.5rem;
}

.mxd-hero-06__video video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__video {
    padding: 0 6rem;
    margin-bottom: 3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    margin-bottom: 0;
    -moz-border-radius: var(--_radius-l);
    border-radius: var(--_radius-l);
    overflow: hidden;
  }

  .mxd-hero-06__video video {
    -moz-border-radius: none;
    border-radius: none;
  }
}

.hero-06-video__cover {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .hero-06-video__cover {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--base);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.6)));
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0.6) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0.6) 100%);
  }
}

.mxd-hero-06__data {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__data {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

.mxd-hero-06__list {
  position: relative;
  width: 100%;
  padding: 0 3rem;
  margin-bottom: 5.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__list {
    padding: 0 6rem;
    margin-bottom: 7.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__list {
    padding: 3.4rem 4rem 0 4rem;
  }

  .mxd-hero-06__list p {
    color: var(--pt-t-light-bright);
    font-weight: 400;
  }
}

.mxd-hero-06__headline {
  position: relative;
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__headline {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

.hero-06-headline__descr {
  position: relative;
  width: 100%;
  padding: 0 3rem;
  margin-bottom: 2.5rem;
}

.hero-06-headline__descr p {
  color: var(--t-bright);
  font-size: 2rem;
  font-weight: var(--fw-medium);
  line-height: 1.4;
}

@media only screen and (min-width: 768px) {
  .hero-06-headline__descr {
    padding: 0 6rem;
    margin-bottom: 1.6rem;
  }

  .hero-06-headline__descr p {
    max-width: 440px;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-06-headline__descr {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding: 0 4rem;
    margin-bottom: 0.4rem;
  }

  .hero-06-headline__descr p {
    color: var(--pt-t-light-bright);
    font-weight: 500;
    max-width: 340px;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-06-headline__descr {
    padding: 0 5rem;
  }

  .hero-06-headline__descr p {
    font-size: 2.4rem;
    max-width: 440px;
  }
}

.hero-06-headline__btn {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .hero-06-headline__btn {
    display: block;
    position: absolute;
    right: 5rem;
    bottom: 0;
  }
}

.hero-06-headline__content {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.hero-06-headline__title {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
}

.mxd-hero-06__marquee {
  margin-bottom: 3.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__marquee {
    margin-bottom: 4.3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__marquee {
    margin-bottom: 0;
    padding-bottom: 4.3rem;
  }
}

.mxd-hero-06__mark,
.mxd-hero-06__more {
  position: relative;
}

.mxd-hero-06__mark {
  display: block;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  padding: 2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-06__mark {
    padding: 3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__mark {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background-color: transparent;
    -moz-border-radius: none;
    border-radius: none;
    padding: 0;
  }
}

.mxd-hero-06__more {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-06__more {
    display: -webkit-inline-box;
    display: -moz-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #06 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #07 Start */
/* ------------------------------------------------*/
.mxd-hero-07 {
  position: relative;
  width: 100%;
}

.mxd-hero-07__tl-trigger {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
}

.hero-07-fade-out-scroll {
  -webkit-transform-origin: top center;
  -moz-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
}

.hero-07-slide-out-scroll {
  -webkit-transform-origin: top center;
  -moz-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
}

.mxd-hero-07__wrap {
  position: relative;
  width: 100%;
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-07__wrap {
    padding-top: 9.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__wrap {
    height: 100vh;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 9.6rem;
  }
}

.mxd-hero-07__top {
  position: relative;
  width: 100%;
  padding-top: 3.1rem;
  margin-bottom: 4.6rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-07__top {
    padding-top: 10.3rem;
    margin-bottom: 13.3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__top {
    padding-top: 2.3rem;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-07__top {
    padding-top: 4.3rem;
  }
}

.mxd-hero-07__title {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
}

.mxd-hero-07__bottom {
  position: relative;
  width: 100%;
  padding: 0 3rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-07__bottom {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__bottom {
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: visible;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-07__bottom {
    padding: 0 9rem;
  }
}

.mxd-hero-07__circle {
  position: relative;
  width: 100%;
  height: 460px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1.5rem;
  margin-bottom: 4.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-07__circle {
    width: 600px;
    height: 600px;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin: 0 auto 4.6rem;
    padding: 0;
    overflow: visible;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__circle {
    position: absolute;
    bottom: -250px;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    margin: 0;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-hero-07__circle {
    width: 680px;
    height: 680px;
    bottom: -250px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-07__circle {
    width: 900px;
    height: 900px;
    bottom: -400px;
  }
}

.hero-07-circle__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
}

.hero-07-circle__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .hero-07-circle__image {
    -moz-border-radius: 50%;
    border-radius: 50%;
  }
}

.hero-07-circle__container {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.hero-07-circle__container.mobile-row {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-07-circle__container {
    position: static;
  }
}

.hero-07-circle__item {
  padding: 1.8rem 2rem;
  -moz-border-radius: var(--_radius-pt-m);
  border-radius: var(--_radius-pt-m);
  background-color: var(--neutral-transparent);
  border: 1px solid var(--neutral-transparent);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  -webkit-box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
  -moz-box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
  box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
}

@media only screen and (min-width: 768px) {
  .hero-07-circle__item {
    position: absolute;
  }

  .hero-07-circle__item.item-01 {
    top: 3rem;
    right: -1.4rem;
    max-width: 20rem;
  }

  .hero-07-circle__item.item-02 {
    top: 25rem;
    right: -10rem;
    max-width: 16rem;
  }

  .hero-07-circle__item.item-03 {
    top: 20rem;
    left: -8rem;
    max-width: 16rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-07-circle__item.item-02 {
    top: auto;
    top: 21rem;
    right: -10rem;
    max-width: 16rem;
  }

  .hero-07-circle__item.item-03 {
    top: 17rem;
    left: -8rem;
    max-width: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-07-circle__item.item-01 {
    top: 5rem;
    right: 5rem;
    max-width: 20rem;
  }

  .hero-07-circle__item.item-02 {
    top: auto;
    top: 29rem;
    right: -10rem;
    max-width: 16rem;
  }

  .hero-07-circle__item.item-03 {
    top: 24rem;
    left: -7rem;
    max-width: 16rem;
  }
}

.mxd-hero-07__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__info {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%;
    padding-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-07__info {
    padding-top: 5.6rem;
  }
}

.hero-07-info__container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5.2rem;
}

@media only screen and (min-width: 1200px) {
  .hero-07-info__container {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 4rem;
  }

  .hero-07-info__container:nth-of-type(2) {
    padding-top: 1.3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-07-info__container:nth-of-type(2) {
    padding-top: 1.7rem;
  }
}

.hero-07-info__descr {
  position: relative;
  text-align: left;
}

@media only screen and (min-width: 768px) {
  .hero-07-info__descr {
    max-width: 500px;
    text-align: center;
    margin: 0 auto;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-07-info__descr {
    max-width: 340px;
    text-align: left;
    margin: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-07-info__descr {
    max-width: 400px;
  }
}

.hero-07-info__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .hero-07-info__tags {
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-07-info__tags {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .hero-07-info__tags.right-align-desktop {
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }
}

.mxd-hero-07__more {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-07__more {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 4rem 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-07__more {
    padding: 4rem 9rem;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #07 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #08 Start */
/* ------------------------------------------------*/
.mxd-hero-08 {
  position: relative;
  width: 100%;
}

.mxd-hero-08__tl-trigger {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 1px;
  height: 1px;
}

.mxd-hero-08__wrap {
  position: relative;
  width: 100%;
  padding-top: 7.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-08__wrap {
    padding-top: 9.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-08__wrap {
    height: 100vh;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0;
  }
}

.mxd-hero-08__center {
  position: relative;
  width: 100%;
  text-align: center;
  padding: 11.5rem 0 11.9rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-08__center {
    padding: 13.5rem 0 14.9rem 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-08__center {
    padding: 0;
  }
}

.mxd-hero-08__headline {
  position: relative;
}

.hero-08-headline__image {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 50vw;
}

@media only screen and (min-width: 768px) {
  .hero-08-headline__image {
    width: 28vw;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-08-headline__image {
    width: 24vw;
  }
}

.hero-08-headline__title {
  position: relative;
  mix-blend-mode: difference;
}

.hero-08-headline__title h1 {
  color: var(--nl-white);
}

.mxd-hero-08__bottom {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3.6rem;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-08__bottom {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 6rem;
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-08__bottom {
    position: absolute;
    bottom: 4rem;
    left: 0;
    width: 100%;
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-08__bottom {
    padding: 0 9rem;
  }
}

.mxd-hero-08__video-wrap {
  position: relative;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-08__video-wrap {
    -ms-flex-preferred-size: 50%;
    flex-basis: 50%;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -moz-border-radius: var(--_radius-m);
    border-radius: var(--_radius-m);
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-08__video-wrap {
    -ms-flex-preferred-size: 24.6rem;
    flex-basis: 24.6rem;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-08__video-wrap {
    -ms-flex-preferred-size: 30.8rem;
    flex-basis: 30.8rem;
    height: 20rem;
  }
}

.mxd-hero-08__video-btn {
  position: absolute;
  right: 0;
  bottom: 0;
  padding: 1rem;
}

.mxd-hero-08__video {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-hero-08__data-wrap {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-08__data-wrap {
    max-width: 480px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-08__data-wrap {
    max-width: 540px;
  }
}

.mxd-hero__mark {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.6rem/1.4 var(--_font-accent);
  color: var(--t-bright);
}

.mxd-hero__mark .mark-icon {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-preferred-size: 1rem;
  flex-basis: 1rem;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: #a1f21e;
}

.mxd-hero__mark .mark-text {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

@media only screen and (min-width: 768px) {
  .mxd-hero__mark {
    gap: 1.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero__mark {
    font-size: 1.8rem;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #08 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Hero Section #09 Start */
/* ------------------------------------------------*/
.mxd-hero-09 {
  position: relative;
  width: 100%;
  padding-top: 11rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-09 {
    padding-top: 14.8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-09 {
    padding-top: 0;
  }
}

.mxd-hero-09__wrap {
  position: relative;
  width: 100%;
  padding-top: 9.6rem;
  overflow: hidden;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-09__wrap {
    padding-top: 9.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-09__wrap {
    padding-top: 0;
    height: 100vh;
  }
}

.mxd-hero-09__headline,
.mxd-hero-09__objects {
  position: relative;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {

  .mxd-hero-09__headline,
  .mxd-hero-09__objects {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1600px) {

  .mxd-hero-09__headline,
  .mxd-hero-09__objects {
    padding: 0 9rem;
  }
}

.mxd-hero-09__headline {
  position: relative;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-09__headline {
    position: absolute;
    bottom: 4rem;
    left: 0;
    width: 100%;
    z-index: 2;
  }
}

.hero-09-headline__caption {
  margin-bottom: 3.6rem;
}

.hero-09-headline__caption p {
  font: normal var(--fw-medium) 2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .hero-09-headline__caption {
    max-width: 500px;
    margin-bottom: 5.4rem;
  }

  .hero-09-headline__caption p {
    font-size: 2.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .hero-09-headline__caption {
    max-width: 440px;
  }
}

.hero-09-headline__title {
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
}

.hero-09-headline__title svg {
  fill: currentColor;
}

.hero-09-svg-mobile {
  display: block;
}

@media only screen and (min-width: 1200px) {
  .hero-09-svg-mobile {
    display: none;
  }
}

.hero-09-svg-desktop {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .hero-09-svg-desktop {
    display: block;
  }
}

.hero-09-headline__hidden {
  position: absolute;
  top: 0;
  left: 0;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
}

.hero-09-headline__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 6rem;
  max-width: 800px;
}

@media only screen and (min-width: 1600px) {
  .hero-09-headline__tags {
    max-width: 1000px;
  }
}

.mxd-hero-09__objects {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-hero-09__objects {
    gap: 0;
    max-width: 430px;
    margin: 6rem auto 0;
    padding: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-09__objects {
    position: absolute;
    right: 14%;
    top: 6.8rem;
    margin: 0;
    z-index: 1;
  }
}

.hero-09-objects__image {
  position: relative;
  max-width: 325px;
  margin: 6rem auto 0;
  padding-bottom: 4.5rem;
}

@media only screen and (min-width: 768px) {
  .hero-09-objects__image {
    max-width: none;
    margin: 0;
    padding-bottom: 0;
  }
}

.hero-09-objects__item {
  position: relative;
  padding: 1.8rem 2rem;
  -moz-border-radius: var(--_radius-pt-m);
  border-radius: var(--_radius-pt-m);
  background-color: var(--base-tint);
}

@media only screen and (min-width: 768px) {
  .hero-09-objects__item {
    position: absolute;
    background-color: var(--neutral-transparent);
    border: 1px solid var(--neutral-transparent);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    -webkit-box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
    -moz-box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
    box-shadow: 0px 4px 8px 0px rgba(var(--pt-purple-rgb), 0.3);
  }

  .hero-09-objects__item.item-01 {
    top: 7rem;
    right: -3rem;
  }

  .hero-09-objects__item.item-02 {
    left: -14rem;
    top: 18rem;
  }

  .hero-09-objects__item.item-03 {
    right: -18rem;
    top: 24rem;
  }
}

@media only screen and (min-width: 1600px) {
  .hero-09-objects__item.item-01 {
    top: 8rem;
    right: -3rem;
  }

  .hero-09-objects__item.item-02 {
    left: -14rem;
    top: 29rem;
  }

  .hero-09-objects__item.item-03 {
    right: -18rem;
    top: 27rem;
  }
}

.mxd-hero-09__more {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-hero-09__more {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 4rem 6rem;
    z-index: 3;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-hero-09__more {
    padding: 4rem 9rem;
  }
}

/* ------------------------------------------------*/
/* Block - Hero Section #09 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Blog Start */
/* ------------------------------------------------*/
.breadcrumbs__nav {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 0.5rem;
}

.breadcrumbs__nav span {
  font: normal var(--fw-regular) 1.8rem/1.4 var(--_font-accent);
  color: var(--t-muted);
}

.breadcrumbs__nav span::after {
  content: "/";
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-left: 0.2rem;
}

.breadcrumbs__nav span:last-of-type::after {
  display: none;
}

.breadcrumbs__nav span a {
  display: inline;
  color: var(--t-muted);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .breadcrumbs__nav span a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.breadcrumbs__nav span.current-item {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%;
  background-repeat: no-repeat;
}

.breadcrumbs__nav span.current-item a {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .breadcrumbs__nav span.current-item a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

@media only screen and (min-width: 1200px) {
  .breadcrumbs__nav {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }
}

.mxd-posts-area {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (min-width: 1200px) {
  .mxd-posts-area {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .mxd-posts-area.column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.mxd-posts-container {
  position: relative;
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .mxd-posts-container {
    width: -moz-calc(100% - 450px);
    width: calc(100% - 450px);
  }

  .mxd-posts-container.fullwidth-posts-container {
    width: 100%;
  }
}

.mxd-sidebar {
  position: relative;
  width: 100%;
}

@media only screen and (min-width: 1200px) {
  .mxd-sidebar {
    width: 450px;
  }
}

.mxd-post {
  position: relative;
  overflow: hidden;
}

.post-featured {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 12.8rem;
  height: auto;
  padding: 3rem;
  margin-bottom: 6rem;
}

.post-featured.post-featured-v2 {
  margin-bottom: 0;
}

@media only screen and (min-width: 768px) {
  .post-featured {
    padding: 4rem;
    margin-bottom: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .post-featured.post-featured-v2 {
    height: 760px;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media only screen and (min-width: 1400px) {
  .post-featured {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 0;
    height: 670px;
  }

  .post-featured.post-featured-v2 {
    height: 760px;
  }
}

@media only screen and (min-width: 1600px) {
  .post-featured {
    height: 760px;
  }

  .post-featured.post-featured-v2 {
    height: 930px;
  }
}

.post-featured__thumb {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.post-featured__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.post-featured__categories {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 1200px) {
  .post-featured__categories {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.post-featured__content {
  position: relative;
}

@media only screen and (min-width: 768px) {
  .post-featured__content {
    max-width: 500px;
  }
}

@media only screen and (min-width: 1200px) {
  .post-featured__content {
    overflow: hidden;
  }
}

@media only screen and (min-width: 1600px) {
  .post-featured__content {
    max-width: 600px;
  }
}

.post-featured__meta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  color: var(--pt-t-light-bright);
  margin-bottom: 1.6rem;
}

.post-featured__meta span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
}

.post-featured__meta span a {
  color: var(--pt-t-light-bright);
}

.post-featured__meta span svg {
  width: 1.7rem;
  height: 1.7rem;
  fill: currentColor;
}

.post-featured__meta span.meta-tag {
  font-weight: var(--fw-semibold);
}

@media only screen and (min-width: 1600px) {
  .post-featured__meta span {
    font-size: 2.2rem;
  }
}

.post-featured__title {
  margin-bottom: 2.3rem;
  color: var(--pt-t-light-bright);
}

.post-featured__title a {
  display: inline;
  color: var(--pt-t-light-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--pt-t-light-bright)), to(var(--pt-t-light-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--pt-t-light-bright), var(--pt-t-light-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--pt-t-light-bright), var(--pt-t-light-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .post-featured__title a:hover {
  color: var(--pt-t-light-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.post-featured__excerpt p {
  color: var(--pt-t-light-bright);
}

.post-featured__btn {
  padding-top: 3.3rem;
}

.post-simple {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5rem;
  height: auto;
  padding: 6rem 0;
  border-top: 1px solid var(--st-muted);
}

.post-simple:last-of-type {
  border-bottom: 1px solid var(--st-muted);
}

@media only screen and (min-width: 768px) {
  .post-simple {
    gap: 3rem;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: 6rem 0;
  }
}

.post-simple__thumb {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 340px;
  overflow: hidden;
}

.post-simple__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.no-touch .post-simple__thumb:hover .mxd-preview-hover {
  opacity: 1;
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

@media only screen and (min-width: 768px) {
  .post-simple__thumb {
    -ms-flex-preferred-size: 260px;
    flex-basis: 260px;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
  }
}

@media only screen and (min-width: 1400px) {
  .post-simple__thumb {
    -ms-flex-preferred-size: 300px;
    flex-basis: 300px;
    height: 320px;
  }
}

@media only screen and (min-width: 1600px) {
  .post-simple__thumb {
    -ms-flex-preferred-size: 400px;
    flex-basis: 400px;
    height: 340px;
  }
}

.post-simple__content {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .post-simple__content {
    max-width: 665px;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media only screen and (min-width: 1600px) {
  .post-simple__content {
    max-width: 765px;
  }
}

.post-simple__descr {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.6rem;
}

.post-simple__meta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  color: var(--t-medium);
}

.post-simple__meta span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
}

.post-simple__meta span a {
  color: var(--t-medium);
}

.post-simple__meta span svg {
  width: 1.7rem;
  height: 1.7rem;
  fill: currentColor;
}

.post-simple__meta span.meta-tag {
  font-weight: var(--fw-semibold);
}

.no-touch .post-simple__meta span:hover a {
  color: var(--t-bright);
}

.post-simple__title a {
  display: inline;
  color: var(--t-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .post-simple__title a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.post-secondary {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.6rem;
}

@media only screen and (min-width: 768px) {
  .post-secondary {
    gap: 2.9rem;
  }
}

.post-secondary-container {
  padding-bottom: 3.5rem;
}

.post-secondary-container:last-of-type {
  padding-bottom: 0;
}

@media only screen and (min-width: 1200px) {
  .post-secondary-container {
    padding-bottom: 0;
  }
}

.post-secondary__thumb {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  height: 460px;
}

.no-touch .post-secondary__thumb:hover .mxd-preview-hover {
  opacity: 1;
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.post-secondary__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .post-secondary__thumb {
    height: 600px;
  }
}

@media only screen and (min-width: 1200px) {
  .post-secondary__thumb {
    height: 540px;
  }
}

@media only screen and (min-width: 1600px) {
  .post-secondary__thumb {
    height: 760px;
  }
}

.post-secondary__categories {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 3rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .post-secondary__categories {
    padding: 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .post-secondary__categories {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.post-secondary__descr {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 0 3rem 0.1rem 3rem;
  gap: 1.6rem;
}

@media only screen and (min-width: 768px) {
  .post-secondary__descr {
    padding: 0 4rem 0.1rem 4rem;
  }
}

.post-secondary__meta {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 0;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  color: var(--t-medium);
}

.post-secondary__meta span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
}

.post-secondary__meta span a {
  color: var(--t-medium);
}

.post-secondary__meta span svg {
  width: 1.7rem;
  height: 1.7rem;
  fill: currentColor;
}

.post-secondary__meta span.meta-tag {
  font-weight: var(--fw-semibold);
}

.no-touch .post-secondary__meta span:hover a {
  color: var(--t-bright);
}

.post-secondary__title {
  position: relative;
}

.post-secondary__title a {
  display: inline;
  color: var(--t-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .post-secondary__title a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-projects-archive {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-projects-archive>.mxd-projects-archive__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-projects-archive:hover>.mxd-projects-archive__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-projects-archive__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-projects-archive__item:first-of-type {
  margin-top: 0;
}

@media only screen and (min-width: 1200px) {
  .no-touch .mxd-projects-archive__item:hover .mxd-projects-archive__title {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-projects-archive__item:hover .mxd-projects-archive__image {
    -ms-flex-preferred-size: 160px;
    flex-basis: 160px;
    -moz-border-radius: 6.2rem;
    border-radius: 6.2rem;
  }
}

.mxd-projects-archive__border {
  position: relative;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-projects-archive__inner {
  display: block;
  padding: 3rem 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-archive__inner {
    overflow: hidden;
  }
}

.mxd-projects-archive__title {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 3.5rem;
  margin-bottom: 3.4rem;
}

.mxd-projects-archive__title p {
  font: normal var(--fw-medium) 2.6rem/1.4 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-archive__title {
    gap: 3.8rem;
    margin-bottom: 3.8rem;
  }

  .mxd-projects-archive__title p {
    font-size: 3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-archive__title {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 3rem;
    height: 100%;
    margin-bottom: 0;
    max-width: 720px;
    -webkit-transform: translateX(-50px);
    -moz-transform: translateX(-50px);
    -ms-transform: translateX(-50px);
    transform: translateX(-50px);
    -webkit-transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
    transition: transform var(--_animspeed-slow) var(--_animbezier);
    transition: transform var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
  }

  .mxd-projects-archive__title p {
    display: inline;
    width: 530px;
  }

  .mxd-projects-archive__title p span {
    text-decoration: none;
    background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
    background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
    -moz-background-size: 100% 1px, 0 1px;
    background-size: 100% 1px, 0 1px;
    background-position: 100% 100%, 0 100%;
    background-repeat: no-repeat;
    -webkit-transition: background-size 300ms, color 300ms;
    -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
    transition: background-size 300ms, color 300ms;
    transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  }

  .no-touch .mxd-projects-archive__title p span:hover {
    color: var(--t-bright);
    -moz-background-size: 0 1px, 100% 1px;
    background-size: 0 1px, 100% 1px;
  }
}

.mxd-projects-archive__image {
  display: block;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
}

.mxd-projects-archive__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-archive__image {
    -ms-flex-preferred-size: 20px;
    flex-basis: 20px;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -ms-flex-positive: 0;
    flex-grow: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    height: 8.4rem;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-transition: border-radius 1.5s, -webkit-flex-basis var(--_animspeed-medium) var(--_animbezier);
    transition: border-radius 1.5s, -webkit-flex-basis var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: border-radius 1.5s, flex-basis var(--_animspeed-medium) var(--_animbezier), -moz-border-radius 1.5s, -moz-flex-basis var(--_animspeed-medium) var(--_animbezier);
    transition: border-radius 1.5s, flex-basis var(--_animspeed-medium) var(--_animbezier);
    transition: border-radius 1.5s, flex-basis var(--_animspeed-medium) var(--_animbezier), -moz-border-radius 1.5s, -webkit-flex-basis var(--_animspeed-medium) var(--_animbezier), -moz-flex-basis var(--_animspeed-medium) var(--_animbezier), -ms-flex-preferred-size var(--_animspeed-medium) var(--_animbezier);
  }
}

.mxd-projects-archive__tagslist {
  margin-bottom: 0.6rem;
}

.mxd-projects-archive__tagslist ul li p {
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-archive__tagslist {
    margin-bottom: 1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-archive__tagslist {
    margin-bottom: 0;
  }
}

.mxd-blog-pagination {
  position: relative;
  margin-top: 5rem;
  margin-bottom: 2.4rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-blog-pagination {
    margin-bottom: 0;
  }
}

.mxd-blog-pagination__inner {
  position: relative;
}

.mxd-blog-pagination__items {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 1rem;
  font: normal var(--fw-medium) 1.8rem/3.3rem var(--_font-accent);
}

.blog-pagination-control {
  position: absolute;
  top: 0;
}

.blog-pagination-control .btn-caption {
  display: none !important;
}

.blog-pagination-control.prev {
  left: 0;
}

.blog-pagination-control.next {
  right: 0;
}

@media only screen and (min-width: 768px) {
  .blog-pagination-control .btn-caption {
    display: block !important;
  }
}

.blog-pagination-number {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 33px;
  height: 33px;
  font: normal var(--fw-regular) 1.8rem/3.3rem var(--_font-accent);
  color: var(--t-bright);
}

.blog-pagination-number.active {
  font-size: 3rem;
  font-weight: var(--fw-semibold);
}

.mxd-sidebar {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.mxd-sidebar__widget {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  padding: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-sidebar__widget {
    padding: 4rem;
  }
}

.widget__title p {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .widget__title p {
    font-size: 3.6rem;
  }
}

.widget__categories {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.3rem;
}

.categories__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.categories__link {
  font: normal var(--fw-regular) 2.2rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

.no-touch .categories__link:hover {
  color: var(--t-medium);
}

.widget__recent-posts {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.recent-post__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 2rem;
}

.recent-post__thumb {
  -ms-flex-preferred-size: 120px;
  flex-basis: 120px;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  height: 120px;
  -moz-border-radius: var(--_radius-s);
  border-radius: var(--_radius-s);
  overflow: hidden;
}

.recent-post__thumb a {
  display: block;
}

.recent-post__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-filter: blur(0);
  filter: blur(0);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-filter var(--_animspeed-medium), -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-filter var(--_animspeed-medium), -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: filter var(--_animspeed-medium), transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: filter var(--_animspeed-medium), transform var(--_animspeed-medium) var(--_animbezier);
  transition: filter var(--_animspeed-medium), transform var(--_animspeed-medium) var(--_animbezier), -webkit-filter var(--_animspeed-medium), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .recent-post__thumb:hover img {
  -webkit-filter: blur(3px);
  filter: blur(3px);
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.recent-post__content {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
}

.recent-post__title {
  font: normal var(--fw-semibold) 1.8rem/1.4 var(--_font-accent);
  color: var(--t-bright);
}

.recent-post__title a {
  display: inline;
  color: var(--t-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .recent-post__title a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.recent-post__meta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  color: var(--t-bright);
}

.recent-post__meta span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.6rem/1.6 var(--_font-accent);
}

.recent-post__meta span a {
  color: var(--t-bright);
}

.recent-post__meta span svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: currentColor;
}

.recent-post__meta span.meta-tag {
  font-weight: var(--fw-regular);
}

.no-touch .recent-post__meta span:hover a {
  color: var(--t-medium);
}

.widget__social-links-small {
  position: relative;
}

@media (hover) and (prefers-reduced-motion: no-preference) {
  .widget__social-links-small>.social-links-small__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .widget__social-links-small:hover>.social-links-small__item:not(:hover) {
    opacity: 0.2;
  }
}

.social-links-small__item {
  position: relative;
  display: block;
  margin-top: -1px;
}

.social-links-small__item:first-of-type {
  margin-top: 0;
}

.social-links-small__divider {
  position: relative;
  width: 100%;
  height: 1px;
  background-color: var(--st-bright);
}

.social-links-small__link {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1.5rem 0;
  overflow: hidden;
}

.no-touch .social-links-small__link:hover .social-links-small__title {
  -webkit-transform: translateX(1rem);
  -moz-transform: translateX(1rem);
  -ms-transform: translateX(1rem);
  transform: translateX(1rem);
}

.no-touch .social-links-small__link:hover .social-links-small__icon i::before {
  -webkit-animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
  -moz-animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
  animation: 0.6s var(--_animbezier) 0s 1 both slideRightUp;
}

.social-links-small__title {
  position: relative;
  font: normal var(--fw-medium) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  transition: color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium), color var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
}

.social-links-small__icon {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.8rem;
  -webkit-transform: translateX(0) rotate(0deg);
  -moz-transform: translateX(0) rotate(0deg);
  -ms-transform: translateX(0) rotate(0deg);
  transform: translateX(0) rotate(0deg);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.social-links-small__icon i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: color var(--_animspeed-medium) var(--_animbezier);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

.widget-ad {
  position: relative;
  width: 100%;
  height: auto;
  padding: 0;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .widget-ad {
    height: 460px;
  }
}

.widget__bgimage img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.widget__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 1rem;
}

/* ------------------------------------------------*/
/* Block - Blog End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Blog Article Start */
/* ------------------------------------------------*/
.mxd-article-area {
  position: relative;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-top: 11.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-article-area {
    padding-top: 15.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article-area {
    padding-top: 9.2rem;
  }
}

.mxd-article-container {
  position: relative;
  width: 100%;
}

.mxd-article {
  position: relative;
  width: 100%;
}

.mxd-article__headline {
  position: relative;
  width: 100%;
  text-align: center;
  margin-bottom: 7rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-article__headline {
    max-width: 870px;
    margin: 0 auto 10rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article__headline {
    max-width: 900px;
  }
}

.mxd-article__meta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 1rem;
  margin-bottom: 1.6rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-article__meta {
    margin-bottom: 1.8rem;
  }
}

.mxd-article__breadcrumbs {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.5rem;
}

.mxd-article__breadcrumbs span {
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-muted);
}

.mxd-article__breadcrumbs span::after {
  content: "/";
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-left: 0.2rem;
}

.mxd-article__breadcrumbs span:last-of-type::after {
  display: none;
}

.mxd-article__breadcrumbs span a {
  display: inline;
  color: var(--t-muted);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .mxd-article__breadcrumbs span a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-article__breadcrumbs span.current-item {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%;
  background-repeat: no-repeat;
}

.mxd-article__breadcrumbs span.current-item a {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-muted)), to(var(--t-muted))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-muted), var(--t-muted)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-muted), var(--t-muted)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .mxd-article__breadcrumbs span.current-item a:hover {
  color: var(--t-medium);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-article__data {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  color: var(--t-bright);
}

.mxd-article__data span {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
}

.mxd-article__data span a {
  color: var(--pt-t-light-bright);
}

.mxd-article__data span svg {
  width: 1.3rem;
  height: 1.3rem;
  fill: currentColor;
}

.mxd-article__data span.meta-tag {
  font-weight: var(--fw-semibold);
}

.mxd-article__data span.meta-time {
  font-weight: var(--fw-semibold);
}

.mxd-article__title {
  margin-bottom: 3.3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-article__title {
    margin-bottom: 4.4rem;
  }
}

.mxd-article__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

.mxd-article__thumb {
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  margin-bottom: 5.4rem;
}

.mxd-article__thumb img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-article__thumb {
    height: 600px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article__thumb {
    height: 760px;
    margin-bottom: 8.3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article__thumb {
    height: 930px;
    margin-bottom: 8rem;
  }
}

.mxd-article__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6rem;
  width: 100%;
  text-align: left;
}

@media only screen and (min-width: 768px) {
  .mxd-article__content {
    gap: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article__content {
    max-width: 870px;
    margin: 0 auto;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article__content {
    max-width: 900px;
  }
}

.mxd-article__block {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  width: 100%;
}

.mxd-article__block.block-table-of-contents {
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  padding: 3rem;
}

.mxd-article__block.block-quote {
  padding: 3rem 0;
  border-top: 1px solid var(--st-muted);
  border-bottom: 1px solid var(--st-muted);
}

.mxd-article__block.block-image {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-article__block.block-table-of-contents {
    padding: 4rem;
  }

  .mxd-article__block.block-image {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article__block.block-image {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

.table-of-contents__title {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .table-of-contents__title {
    font-size: 3.6rem;
  }
}

.table-of-contents__nav {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.3rem;
}

.table-of-contents__nav li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
}

.table-of-contents__nav li a {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

.no-touch .table-of-contents__nav li a:hover {
  color: var(--t-bright);
}

@media only screen and (min-width: 1600px) {
  .table-of-contents__nav li a {
    font-size: 2.2rem;
  }
}

.quote__text {
  font: normal var(--fw-regular) 3rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  margin-bottom: 2rem;
}

@media only screen and (min-width: 768px) {
  .quote__text {
    font-size: 3.6rem;
  }
}

.quote__cite {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

@media only screen and (min-width: 1600px) {
  .quote__cite {
    font-size: 2.2rem;
  }
}

.mxd-article__content ol {
  list-style: decimal inside;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 1rem;
}

.mxd-article__content ol:not(:has(ol, ul)) {
  gap: 0;
}

.mxd-article__content ol li {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

.mxd-article__content ol li span {
  font-weight: var(--fw-semibold);
  color: var(--t-bright);
}

.mxd-article__content ol ul {
  gap: 0;
  -webkit-padding-start: 2.4rem;
  -moz-padding-start: 2.4rem;
  padding-inline-start: 2.4rem;
  margin-top: 1rem;
}

.mxd-article__content ul {
  list-style: disc inside;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 1rem;
}

.mxd-article__content ul:not(:has(ol, ul)) {
  gap: 0;
}

.mxd-article__content ul li {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-medium);
}

.mxd-article__content ul li span {
  font-weight: var(--fw-semibold);
  color: var(--t-bright);
}

.mxd-article__content ul ol,
.mxd-article__content ul ul {
  gap: 0;
  -webkit-padding-start: 2.4rem;
  -moz-padding-start: 2.4rem;
  padding-inline-start: 2.4rem;
  margin-top: 1rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-article__content ol li {
    font-size: 2.2rem;
  }

  .mxd-article__content ol ul {
    -webkit-padding-start: 2.8rem;
    -moz-padding-start: 2.8rem;
    padding-inline-start: 2.8rem;
  }

  .mxd-article__content ul li {
    font-size: 2.2rem;
  }

  .mxd-article__content ul ol,
  .mxd-article__content ul ul {
    -webkit-padding-start: 2.8rem;
    -moz-padding-start: 2.8rem;
    padding-inline-start: 2.8rem;
  }
}

.block-image__container {
  position: relative;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
}

.block-image__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 1rem;
}

.mxd-article-author {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  width: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  padding: 3rem;
  margin-top: 6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-article-author {
    padding: 4rem;
    margin-top: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article-author {
    max-width: 870px;
    margin: 7rem auto 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article-author {
    max-width: 900px;
  }
}

.mxd-article-author__data {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  gap: 1.8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-article-author__data {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    gap: 3rem;
  }
}

.mxd-article-author__avatar {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-preferred-size: 100px;
  flex-basis: 100px;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  -moz-border-radius: var(--_radius-pt-m);
  border-radius: var(--_radius-pt-m);
  overflow: hidden;
}

.mxd-article-author__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-article-author__avatar {
    -ms-flex-preferred-size: 120px;
    flex-basis: 120px;
    height: 12rem;
  }
}

.mxd-article-author__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-article-author__name a {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}

.mxd-article-author__position {
  line-height: 1.4;
}

.mxd-article-author__socials {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  row-gap: 0.4rem;
  -webkit-column-gap: 1rem;
  -moz-column-gap: 1rem;
  column-gap: 1rem;
  margin-top: 2.2rem;
}

.mxd-article-navigation {
  position: relative;
  margin-top: 6rem;
  padding-bottom: 3rem;
  border-bottom: 1px solid var(--st-muted);
}

@media only screen and (min-width: 768px) {
  .mxd-article-navigation {
    margin-top: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article-navigation {
    max-width: 870px;
    margin: 7rem auto 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article-navigation {
    max-width: 900px;
  }
}

.mxd-article-navigation__navitem {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-article-navigation__navitem.left {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  padding-right: 1.5rem;
}

.mxd-article-navigation__navitem.right {
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  padding-left: 1.5rem;
  text-align: right;
}

.mxd-article-navigation__link {
  display: block;
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  margin-top: 0.5rem;
}

.mxd-article-navigation__link span {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .mxd-article-navigation__link span:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-article-comments {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6rem;
  width: 100%;
  margin-top: 6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-article-comments {
    gap: 7rem;
    margin-top: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-article-comments {
    max-width: 870px;
    margin: 7rem auto 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-article-comments {
    max-width: 900px;
  }
}

.mxd-article-comments__container,
.mxd-article-comments__respond {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.mxd-article-comments__list {
  position: relative;
  width: 100%;
}

.mxd-article-comments__list ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-comment {
  margin-top: -1px;
  border-top: 1px solid var(--st-muted);
}

.mxd-comment:last-of-type {
  border-bottom: 1px solid var(--st-muted);
}

.mxd-comment__children {
  padding-left: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-comment__children {
    padding-left: 13rem;
  }
}

.mxd-comment__container {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.5rem;
  padding: 3rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-comment__container {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 3rem;
  }
}

.mxd-comment__avatar {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-preferred-size: 100px;
  flex-basis: 100px;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 10rem;
  height: 10rem;
  -moz-border-radius: var(--_radius-pt-m);
  border-radius: var(--_radius-pt-m);
  overflow: hidden;
  margin-bottom: 0.6rem;
}

.mxd-comment__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-comment__avatar {
    margin-bottom: 0;
  }
}

.mxd-comment__content {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.4rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-comment__content {
    gap: 1.3rem;
  }
}

.mxd-comment__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.2rem;
}

.mxd-comment__reply {
  margin-top: 0.9rem;
}

/* ------------------------------------------------*/
/* Block - Blog Article End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - 404 Error Start */
/* ------------------------------------------------*/
.mxd-error {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: 100%;
  overflow: hidden;
  padding: 2rem 0 3rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-error {
    padding: 3rem 0 4rem 0;
  }
}

.mxd-error__descr,
.mxd-error__controls {
  position: relative;
  z-index: 1;
}

@media only screen and (min-width: 1200px) {
  .marquee-error {
    margin-top: -4rem;
  }
}

/* ------------------------------------------------*/
/* Block - 404 Error End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo List Start */
/* ------------------------------------------------*/
.mxd-demo-list {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  padding-top: 12.9rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list {
    gap: 6rem;
    padding-top: 14.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-list {
    padding-top: 18.2rem;
  }
}

.mxd-demo-list__row {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__row {
    gap: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-list__row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}

.mxd-demo-list__item {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
  padding: 1rem;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  border: 1px solid var(--st-muted);
  -webkit-box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  -moz-box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  -webkit-transition: -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: box-shadow var(--_animspeed-medium) var(--_animbezier), -moz-box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: box-shadow var(--_animspeed-medium) var(--_animbezier), -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier), -moz-box-shadow var(--_animspeed-medium) var(--_animbezier);
}

.no-touch .mxd-demo-list__item:hover {
  -webkit-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  -moz-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
}

.no-touch .mxd-demo-list__item:hover .mxd-demo-list__screen {
  -webkit-transform: scale(1.014);
  -moz-transform: scale(1.014);
  -ms-transform: scale(1.014);
  transform: scale(1.014);
}

.mxd-demo-list__item.empty-item {
  padding: 5.6rem 3.1rem;
  border: 1px solid var(--base-tint);
}

.no-touch .mxd-demo-list__item.empty-item:hover {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

.mxd-demo-list__item.item-accent {
  background-color: var(--accent);
  border: 1px solid var(--accent);
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__item.empty-item {
    padding: 5.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-list__item.empty-item {
    padding: 3rem;
  }
}

.empty-item__wrap {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

@media only screen and (min-width: 1200px) {
  .empty-item__wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
  }
}

.empty-item__logo {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
}

.empty-item__logo svg {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: 8rem;
  height: 8rem;
}

.empty-item__caption {
  font: normal var(--fw-medium) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-medium);
  padding-top: 1.1rem;
}

@media only screen and (min-width: 768px) {
  .empty-item__caption {
    font-size: 2.2rem;
    padding-top: 2.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .empty-item__caption {
    font-size: 1.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .empty-item__caption {
    font-size: 2.2rem;
  }
}

.mxd-demo-list__image {
  position: relative;
  display: block;
  overflow: hidden;
  -moz-border-radius: 1rem;
  border-radius: 1rem;
}

.mxd-demo-list__image.image-placeholder {
  display: none;
}

.mxd-demo-list__image img {
  opacity: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__image {
    -moz-border-radius: 2rem;
    border-radius: 2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-list__image.image-placeholder {
    display: block;
  }
}

.mxd-demo-list__screen {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.mxd-demo-list__screen.screen-01 {
  background-image: var(--bg-demo-screen-01);
}

.mxd-demo-list__screen.screen-02 {
  background-image: var(--bg-demo-screen-02);
}

.mxd-demo-list__screen.screen-03 {
  background-image: var(--bg-demo-screen-03);
}

.mxd-demo-list__screen.screen-04 {
  background-image: var(--bg-demo-screen-04);
}

.mxd-demo-list__screen.screen-05 {
  background-image: var(--bg-demo-screen-05);
}

.mxd-demo-list__screen.screen-06 {
  background-image: var(--bg-demo-screen-06);
}

.mxd-demo-list__screen.screen-07 {
  background-image: var(--bg-demo-screen-07);
}

.mxd-demo-list__screen.screen-08 {
  background-image: var(--bg-demo-screen-08);
}

.mxd-demo-list__screen.screen-09 {
  background-image: var(--bg-demo-screen-09);
}

.mxd-demo-list__caption {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__caption {
    padding: 1rem 1.6rem;
  }
}

.mxd-demo-list__link {
  font: normal var(--fw-medium) 1.8rem/1.4 var(--_font-accent);
  color: var(--t-bright);
}

.mxd-demo-list__link.opposite {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__link {
    font-size: 2.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-list__link.small {
    font-size: 1.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-list__link {
    font-size: 3rem;
  }

  .mxd-demo-list__link.small {
    font-size: 2.2rem;
  }
}

.mxd-demo-list__num {
  font: normal var(--fw-medium) 1.8rem/1.4 var(--_font-accent);
  color: var(--accent);
}

.mxd-demo-list__num.opposite {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-demo-list__num {
    font-size: 2.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-list__num.small {
    font-size: 1.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-list__num {
    font-size: 3rem;
  }

  .mxd-demo-list__num.small {
    font-size: 2.2rem;
  }
}

/* ------------------------------------------------*/
/* Block - Demo List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Cards Start */
/* ------------------------------------------------*/
.mxd-demo-cards {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cards {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 6rem;
  }
}

.mxd-demo-cards__item {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 5rem;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  margin-top: 3rem;
}

.mxd-demo-cards__item.card-item-left {
  padding-top: 4rem;
}

.mxd-demo-cards__item.card-item-right {
  padding-bottom: 4rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cards__item {
    gap: 5rem;
  }

  .mxd-demo-cards__item.card-item-left {
    padding-top: 6rem;
  }

  .mxd-demo-cards__item.card-item-right {
    padding-bottom: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cards__item {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 6rem;
    width: -moz-calc(50% - 3rem);
    width: calc(50% - 3rem);
    height: 760px;
  }

  .mxd-demo-cards__item.card-item-left,
  .mxd-demo-cards__item.card-item-right {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cards__item {
    height: 930px;
  }

  .mxd-demo-cards__item.card-item-left {
    padding-top: 8rem;
  }

  .mxd-demo-cards__item.card-item-right {
    padding-bottom: 8rem;
  }
}

.mxd-demo-card__gradient {
  position: absolute;
  top: -50%;
  left: 50%;
  right: auto;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 600px;
  height: 600px;
  z-index: 0;
}

.mxd-demo-card__gradient svg {
  width: 100%;
  height: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-card__gradient {
    width: 800px;
    height: 800px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-card__gradient {
    width: 1000px;
    height: 1000px;
  }
}

.mxd-demo-cards__image {
  position: relative;
  margin: 0 auto;
}

.mxd-demo-cards__image.card-image-padding {
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cards__image.card-image-padding {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cards__image.card-image-fullwidth {
    max-height: none;
  }

  .mxd-demo-cards__image.card-image-padding {
    max-width: 610px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cards__image.card-image-padding {
    padding: 0 8rem;
    max-width: none;
  }
}

.mxd-demo-cards__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 5rem;
  text-align: center;
  padding: 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cards__content {
    gap: 5rem;
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cards__content {
    gap: 6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cards__content {
    gap: 6.8rem;
    padding: 0 8rem;
  }
}

.mxd-demo-cards__descr p {
  max-width: 420px;
  margin: 0 auto;
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cards__descr p {
    max-width: 600px;
  }
}

.mxd-demo-cards__title {
  margin-bottom: 3rem;
}

.mxd-demo-cards__title a {
  color: var(--t-bright);
}

.no-touch .mxd-demo-cards__title a:hover {
  color: var(--accent);
}

.mxd-demo-cards__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-bottom: 2.8rem;
}

.mxd-demo-cards__icons {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  row-gap: 3rem;
  -webkit-column-gap: 1.5rem;
  -moz-column-gap: 1.5rem;
  column-gap: 1.5rem;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.mxd-demo-cards__icons.justify-start-desktop {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cards__icons {
    gap: 3rem;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cards__icons.justify-start-desktop {
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

.demo-icons__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.2rem;
  -ms-flex-preferred-size: 7rem;
  flex-basis: 7rem;
  -webkit-box-flex: 0;
  -moz-box-flex: 0;
  -ms-flex-positive: 0;
  flex-grow: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .demo-icons__item {
    -ms-flex-preferred-size: 8.4rem;
    flex-basis: 8.4rem;
    max-width: 8.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .demo-icons__item {
    -ms-flex-preferred-size: 6.4rem;
    flex-basis: 6.4rem;
    max-width: 6.4rem;
  }
}

@media only screen and (min-width: 1400px) {
  .demo-icons__item {
    -ms-flex-preferred-size: 7.8rem;
    flex-basis: 7.8rem;
    max-width: 7.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .demo-icons__item {
    -ms-flex-preferred-size: 8.4rem;
    flex-basis: 8.4rem;
    max-width: 8.4rem;
  }
}

.demo-icons__icon {
  position: relative;
  width: 7rem;
  height: 7rem;
}

.demo-icons__icon svg {
  display: block;
  width: 100%;
  height: auto;
}

.demo-icons__icon svg path {
  fill: var(--accent);
  stroke: var(--accent);
  stroke-width: 1px;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.demo-icons__icon i {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  font-size: 3rem;
  color: var(--t-opp-bright);
}

.demo-icons__icon.transparent svg path {
  fill: none;
  stroke: var(--st-medium);
}

.demo-icons__icon.transparent i {
  color: var(--t-muted);
}

@media only screen and (min-width: 768px) {
  .demo-icons__icon {
    width: 100%;
    height: auto;
  }

  .demo-icons__icon i {
    font-size: 3.7rem;
  }
}

.demo-icons__caption {
  font: normal var(--fw-regular) 1.4rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 1600px) {
  .demo-icons__caption {
    font-size: 1.6rem;
    white-space: nowrap;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Responsive Promo Start */
/* ------------------------------------------------*/
.mxd-resp-promo,
.mxd-resp-promo__item {
  position: relative;
}

.mxd-resp-promo {
  padding-top: 12.3rem;
  padding-bottom: 9.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-resp-promo {
    padding-top: 14rem;
    padding-bottom: 8.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-resp-promo {
    padding-top: 20rem;
    padding-bottom: 11.7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-resp-promo__item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

.mxd-resp-promo__content {
  margin-bottom: 5.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-resp-promo__content {
    max-width: 800px;
    margin: 0 auto 5.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-resp-promo__content {
    max-width: 700px;
    margin: 0;
    padding-bottom: 1.7rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-resp-promo__content {
    padding-bottom: 5rem;
  }
}

.mxd-resp-promo__manifest {
  margin-bottom: 4.6rem;
  text-align: center;
}

.mxd-resp-promo__manifest p {
  font: normal var(--fw-regular) 2.8rem/1.6 var(--_font-accent);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-resp-promo__manifest p {
    font-size: 3.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-resp-promo__manifest {
    margin-bottom: 5.6rem;
    text-align: left;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-resp-promo__manifest {
    margin-bottom: 6.2rem;
  }

  .mxd-resp-promo__manifest p {
    font-size: 4rem;
  }
}

.mxd-resp-promo__image {
  padding-left: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-resp-promo__image {
    padding-left: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-resp-promo__image {
    padding-left: 0;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Responsive Promo End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Inner Pages Slider Start */
/* ------------------------------------------------*/
.mxd-demo-swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  overflow: clip;
  list-style: none;
  padding: 0;
  z-index: 1;
  display: block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
  height: auto;
  padding: 0;
}

.no-touch .mxd-demo-swiper .swiper-slide-active:hover .demo-swiper-slide__image {
  -webkit-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  -moz-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
}

.mxd-demo-swiper .swiper-slide-next,
.mxd-demo-swiper .swiper-slide-prev {
  -webkit-transform: scale(0.96);
  -moz-transform: scale(0.96);
  -ms-transform: scale(0.96);
  transform: scale(0.96);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

.mxd-demo-swiper__slide {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  height: auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.demo-swiper-slide__image {
  padding: 1rem;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  border: 1px solid var(--st-muted);
  -webkit-box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  -moz-box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  box-shadow: 0 6px 14px rgba(7, 1, 23, 0), 4px 10px 38px rgba(13, 2, 46, 0);
  -webkit-transition: -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: box-shadow var(--_animspeed-medium) var(--_animbezier), -moz-box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: box-shadow var(--_animspeed-medium) var(--_animbezier), -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier), -moz-box-shadow var(--_animspeed-medium) var(--_animbezier);
}

.demo-swiper-slide__image img {
  -moz-border-radius: 1rem;
  border-radius: 1rem;
}

@media only screen and (min-width: 768px) {
  .demo-swiper-slide__image img {
    -moz-border-radius: 2rem;
    border-radius: 2rem;
  }
}

.demo-swiper-slide__descr {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  text-align: center;
  overflow: hidden;
  margin-top: 3rem;
}

.demo-swiper-slide__descr a {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  font: normal var(--fw-medium) 2.2rem/4rem var(--_font-accent);
  color: var(--t-bright);
}

.demo-swiper-slide__descr a span {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .demo-swiper-slide__descr a span:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

@media only screen and (min-width: 768px) {
  .demo-swiper-slide__descr a {
    font-size: 2.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .demo-swiper-slide__descr a {
    font-size: 3.6rem;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Inner Pages Slider End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Components Start */
/* ------------------------------------------------*/
.mxd-demo-components {
  position: relative;
  padding-top: 6.5rem;
  padding-bottom: 8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-components {
    padding-top: 5.6rem;
    padding-bottom: 7.7rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-components {
    padding-top: 6.8rem;
    padding-bottom: 9.1rem;
  }
}

.mxd-demo-components__title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
}

.mxd-demo-components__title span {
  font: normal var(--fw-medium) 5rem/1.1 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-demo-components__title span {
    font-size: 8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-components__title span {
    font-size: 10rem;
  }
}

.mxd-demo-components__objects {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.mxd-demo-components__object {
  position: absolute;
  height: auto;
}

.mxd-demo-components__object.obj-01 {
  top: -110px;
  right: 60px;
  width: 140px;
}

.mxd-demo-components__object.obj-02 {
  bottom: 0;
  right: 0;
  width: 80px;
}

.mxd-demo-components__object.obj-03 {
  bottom: -140px;
  left: 0;
  width: 200px;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-components__object.obj-01 {
    top: -120px;
    right: 60px;
    width: 150px;
  }

  .mxd-demo-components__object.obj-02 {
    bottom: 0;
    right: 0;
    width: 80px;
  }

  .mxd-demo-components__object.obj-03 {
    bottom: -140px;
    left: 0;
    width: 220px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-components__object.obj-01 {
    top: -180px;
    right: 80px;
    width: 270px;
  }

  .mxd-demo-components__object.obj-02 {
    bottom: 1rem;
    right: 0;
    width: 120px;
  }

  .mxd-demo-components__object.obj-03 {
    bottom: -200px;
    left: 10px;
    width: 340px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-components__object.obj-01 {
    top: -220px;
    right: 100px;
    width: 360px;
  }

  .mxd-demo-components__object.obj-02 {
    bottom: 3rem;
    right: 0;
    width: 160px;
  }

  .mxd-demo-components__object.obj-03 {
    bottom: -270px;
    left: 10px;
    width: 460px;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Components End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Features Start */
/* ------------------------------------------------*/
.mxd-features-promo,
.mxd-features-promo__item {
  position: relative;
}

.mxd-features-promo {
  padding-top: 9rem;
  padding-bottom: 10.8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-features-promo {
    padding-top: 10.9rem;
    padding-bottom: 12.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-features-promo {
    padding-top: 12.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-features-promo {
    padding-top: 17rem;
    padding-bottom: 16.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-features-promo__item {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
}

.mxd-features-promo__content {
  margin-bottom: 5rem;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .mxd-features-promo__content {
    max-width: 600px;
    margin: 0 auto 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-features-promo__content {
    max-width: 700px;
    margin: 0;
    padding-bottom: 1.7rem;
    text-align: left;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-features-promo__content {
    padding-bottom: 3.2rem;
  }
}

.mxd-features-promo__image {
  padding-left: 0;
}

.mxd-features-cards {
  position: relative;
}

.mxd-features-cards__teaser {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-top: 0.2rem;
  color: var(--t-muted);
}

.mxd-features-cards__teaser .mxd-point-subtitle {
  color: var(--t-medium);
}

.mxd-features-cards__teaser .mxd-point-subtitle span {
  font-weight: var(--fw-medium);
  color: var(--t-medium);
}

@media only screen and (min-width: 1600px) {
  .mxd-features-cards__teaser {
    padding-top: 1.2rem;
  }

  .mxd-features-cards__teaser .mxd-point-subtitle {
    font-size: 2.5rem;
  }
}

.mxd-features-cards__item {
  position: relative;
  height: 500px;
}

.mxd-features-cards__item .mxd-features-cards__title,
.mxd-features-cards__item .mxd-features-cards__info {
  width: 90%;
}

@media only screen and (min-width: 768px) {
  .mxd-features-cards__item {
    height: 460px;
  }

  .mxd-features-cards__item .mxd-features-cards__title,
  .mxd-features-cards__item .mxd-features-cards__info {
    width: 60%;
    max-width: 500px;
  }
}

@media only screen and (min-width: 992px) {

  .mxd-features-cards__item .mxd-features-cards__title,
  .mxd-features-cards__item .mxd-features-cards__info {
    width: 40%;
  }
}

@media only screen and (min-width: 1200px) {

  .mxd-features-cards__item .mxd-features-cards__title,
  .mxd-features-cards__item .mxd-features-cards__info {
    width: 100%;
    max-width: none;
  }

  .mxd-features-cards__item.features-item-01 .mxd-features-cards__title,
  .mxd-features-cards__item.features-item-01 .mxd-features-cards__info {
    width: 40%;
  }

  .mxd-features-cards__item.features-item-01 .mxd-features-cards__info {
    max-width: 400px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-features-cards__item {
    height: 600px;
  }
}

.mxd-features-cards__inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.mxd-features-cards__inner.justify-end {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

@media only screen and (min-width: 768px) {
  .mxd-features-cards__inner.justify-end {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .mxd-features-cards__inner.justify-between {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.mxd-features-cards__title,
.mxd-features-cards__info {
  position: relative;
  z-index: 1;
}

.mxd-features-cards__title {
  margin-bottom: 2.8rem;
}

.mxd-features-cards__title h3 {
  font-size: 3.6rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-features-cards__title {
    z-index: 1;
  }

  .mxd-features-cards__title h3 {
    font-size: 3.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-features-cards__title h3 {
    font-size: 5rem;
  }
}

.mxd-features-cards__info p {
  font-size: 1.6rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-features-cards__info p {
    font-size: 2.2rem;
  }
}

.mxd-features-cards__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2.6rem;
}

.mxd-features-cards__image {
  position: absolute;
  height: auto;
}

.mxd-features-cards__image.features-image-01 {
  bottom: 0;
  right: 0;
  width: 68%;
}

.mxd-features-cards__image.features-image-02 {
  top: 0;
  right: 0;
  width: 68%;
}

.mxd-features-cards__image.features-image-03 {
  bottom: 0;
  right: 3rem;
  width: 78%;
}

.mxd-features-cards__image.features-image-04 {
  bottom: 0;
  right: 3rem;
  width: 78%;
}

.mxd-features-cards__image.features-image-05 {
  top: 4rem;
  right: 1.5rem;
  width: 68%;
}

@media only screen and (min-width: 768px) {
  .mxd-features-cards__image.features-image-01 {
    width: 50%;
  }

  .mxd-features-cards__image.features-image-02 {
    width: 50%;
  }

  .mxd-features-cards__image.features-image-03 {
    right: 4rem;
    width: 50%;
  }

  .mxd-features-cards__image.features-image-04 {
    right: 4rem;
    width: 50%;
  }

  .mxd-features-cards__image.features-image-05 {
    width: 50%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-features-cards__image.features-image-01 {
    width: 58%;
  }

  .mxd-features-cards__image.features-image-02 {
    width: 70%;
  }

  .mxd-features-cards__image.features-image-03 {
    right: auto;
    left: 4rem;
    width: -moz-calc(100% - 8rem);
    width: calc(100% - 8rem);
  }

  .mxd-features-cards__image.features-image-04 {
    right: auto;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 78%;
  }

  .mxd-features-cards__image.features-image-05 {
    width: 68%;
  }
}

.mxd-features-cards__gradient {
  position: absolute;
  width: 600px;
  height: 600px;
  z-index: 0;
}

.mxd-features-cards__gradient svg {
  width: 100%;
  height: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-features-cards__gradient {
    width: 800px;
    height: 800px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-features-cards__gradient {
    width: 1000px;
    height: 1000px;
  }

  .mxd-features-cards__gradient.features-gradient-01 {
    bottom: -300px;
    right: -200px;
    width: 900px;
    height: 900px;
  }

  .mxd-features-cards__gradient.features-gradient-02 {
    top: -340px;
    right: -200px;
    width: 700px;
    height: 700px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-features-cards__gradient {
    width: 1000px;
    height: 1000px;
  }

  .mxd-features-cards__gradient.features-gradient-01 {
    bottom: -300px;
    right: -200px;
    width: 1000px;
    height: 1000px;
  }

  .mxd-features-cards__gradient.features-gradient-02 {
    top: -400px;
    right: -260px;
    width: 900px;
    height: 900px;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Features End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo CTA Start */
/* ------------------------------------------------*/
.mxd-demo-cta {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding-top: 11.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cta {
    padding-top: 13.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cta {
    padding-top: 16.5rem;
  }
}

.mxd-demo-cta__caption {
  position: relative;
  text-align: center;
}

.mxd-demo-cta__caption h2 {
  margin: 0 auto;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cta__caption h2 {
    max-width: 600px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cta__caption h2 {
    max-width: 860px;
  }
}

.mxd-demo-cta__btn {
  margin-top: 5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-cta__btn {
    margin-top: 5.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-cta__btn {
    margin-top: 6.2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-cta__btn {
    margin-top: 6.7rem;
  }
}

/* ------------------------------------------------*/
/* Block - Demo CTA End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Block - Demo Footer Start */
/* ------------------------------------------------*/
.mxd-demo-footer {
  position: relative;
}

.mxd-demo-footer__bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 0;
}

.mxd-demo-footer__item {
  margin: 0 0 4.4rem 0;
}

.mxd-demo-footer__item:last-of-type {
  margin: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-footer__item {
    margin: 0;
  }
}

.mxd-demo-footer__logo {
  margin-bottom: 2.3rem;
}

.mxd-demo-footer__slogan {
  margin-bottom: 3.4rem;
  max-width: 300px;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-footer__slogan {
    max-width: 460px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-footer__slogan {
    max-width: 340px;
  }
}

.mxd-demo-footer__btn {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 0.6rem;
}

.mxd-demo-footer__btn.centered {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (min-width: 576px) {
  .mxd-demo-footer__btn {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1.6rem;
  }
}

.mxd-footer-nav__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  margin: 0 0 4.4rem 0;
}

.mxd-footer-nav__item:last-of-type {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-footer-nav__item {
    margin: 0;
  }
}

.mxd-footer-nav__block {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2rem;
  margin: 0 0 4.4rem 0;
}

.mxd-footer-nav__block:last-of-type {
  margin: 0;
}

.mxd-footer-nav__list ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.8rem;
}

.mxd-footer-nav__list ul li {
  display: block;
  font: normal var(--fw-regular) 1.6rem/1.4 var(--_font-accent);
}

.mxd-footer-nav__list ul li a {
  display: inline-block;
  color: var(--t-medium);
}

.no-touch .mxd-footer-nav__list ul li a:hover {
  color: var(--accent);
  -webkit-transform: translateX(0.4rem);
  -moz-transform: translateX(0.4rem);
  -ms-transform: translateX(0.4rem);
  transform: translateX(0.4rem);
}

@media only screen and (min-width: 1600px) {
  .mxd-footer-nav__list ul li {
    font-size: 1.8rem;
  }
}

.mxd-demo-footer__promo {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2.4rem;
}

.mxd-footer-promo__list {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.6rem;
}

.mxd-footer-promo__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.6rem;
  -webkit-transition: -webkit-transform var(--_animspeed-medium);
  transition: -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
}

.no-touch .mxd-footer-promo__item:hover {
  -webkit-transform: translateX(0.4rem);
  -moz-transform: translateX(0.4rem);
  -ms-transform: translateX(0.4rem);
  transform: translateX(0.4rem);
}

.no-touch .mxd-footer-promo__item:hover .mxd-footer-promo__link {
  color: var(--accent);
}

@media only screen and (min-width: 768px) {
  .mxd-footer-promo__item {
    max-width: 360px;
  }
}

.mxd-footer-promo__icon {
  width: 4.6rem;
  height: 4.6rem;
}

.mxd-footer-promo__icon img {
  width: 4.6rem;
  height: 4.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-footer-promo__icon {
    width: 5.6rem;
    height: 5.6rem;
  }

  .mxd-footer-promo__icon img {
    width: 5.6rem;
    height: 5.6rem;
  }
}

.mxd-footer-promo__link {
  font: normal var(--fw-regular) 1.6rem/1.4 var(--_font-accent);
  color: var(--t-medium);
  -webkit-transition: color var(--_animspeed-medium);
  -moz-transition: color var(--_animspeed-medium);
  transition: color var(--_animspeed-medium);
}

@media only screen and (min-width: 1600px) {
  .mxd-footer-promo__link {
    font-size: 1.8rem;
  }
}

.mxd-demo-footer__mixdesign {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  bottom: 0;
  padding-top: 11.4rem;
  color: var(--t-bright);
  overflow: hidden;
}

.mxd-demo-footer__mixdesign a,
.mxd-demo-footer__mixdesign svg {
  display: block;
}

.mxd-demo-footer__mixdesign a {
  width: 100%;
  color: var(--t-bright);
}

.mxd-demo-footer__mixdesign svg {
  width: 100%;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-demo-footer__mixdesign {
    padding-top: 10.6rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-demo-footer__mixdesign {
    padding-top: 8.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-demo-footer__mixdesign {
    padding-top: 7rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-demo-footer__mixdesign {
    padding-top: 5.3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-demo-footer__mixdesign {
    padding-top: 5rem;
  }
}

/* ------------------------------------------------*/
/* Block - Demo Footer End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Hover Reveal Start */
/* ------------------------------------------------*/
.hover-reveal__item {
  position: relative;
}

.hover-reveal__content {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 300px;
  height: 300px;
  pointer-events: none;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  opacity: 0;
  -webkit-transform: translate(-80%, -50%);
  -moz-transform: translate(-80%, -50%);
  -ms-transform: translate(-80%, -50%);
  transform: translate(-80%, -50%);
  -webkit-transition: opacity var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  transition: opacity var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium);
  -moz-transition: transform var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium);
  transition: transform var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium), opacity var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium), -moz-transform var(--_animspeed-medium);
  z-index: 1;
}

.hover-reveal__content.overflow-visible {
  overflow: visible;
}

.hover-reveal__content.hover-reveal-360x440 {
  width: 360px;
  height: 440px;
}

.hover-reveal__content.hover-reveal-280x340 {
  width: 280px;
  height: 340px;
}

.hover-reveal__content.hover-reveal-260x260 {
  width: 220px;
  height: 220px;
}

@media only screen and (min-width: 1200px) {
  .hover-reveal__content {
    display: block;
  }
}

@media only screen and (min-width: 1600px) {
  .hover-reveal__content.hover-reveal-260x260 {
    width: 260px;
    height: 260px;
  }
}

.hover-reveal__image {
  position: relative;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-transform: scale(1, 1.4);
  -moz-transform: scale(1, 1.4);
  -ms-transform: scale(1, 1.4);
  transform: scale(1, 1.4);
  -webkit-transform-origin: top left;
  -moz-transform-origin: top left;
  -ms-transform-origin: top left;
  transform-origin: top left;
  -webkit-transition: -webkit-transform 0.5s var(--_animbezier);
  transition: -webkit-transform 0.5s var(--_animbezier);
  -moz-transition: transform 0.5s var(--_animbezier), -moz-transform 0.5s var(--_animbezier);
  transition: transform 0.5s var(--_animbezier);
  transition: transform 0.5s var(--_animbezier), -webkit-transform 0.5s var(--_animbezier), -moz-transform 0.5s var(--_animbezier);
}

/* ------------------------------------------------*/
/* Features - Hover Reveal End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - About Start */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - About End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Pinned Image Start */
/* ------------------------------------------------*/
.page-padding {
  width: 100%;
  padding: 0;
}

@media only screen and (min-width: 1200px) {
  .page-padding {
    padding: 6rem 0;
  }
}

@media only screen and (min-width: 1600px) {
  .page-padding {
    padding: 9rem 0;
  }
}

.mxd-pinned {
  display: block;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    gap: 3rem;
  }
}

.mxd-pinned__visual {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__visual {
    position: sticky;
    top: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100vh;
  }
}

.mxd-pinned__img-wrap {
  width: 30em;
  height: 40em;
  max-height: 100%;
  max-width: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__img-wrap {
    width: 100%;
    height: 100%;
  }
}

.mxd-pinned__img-list {
  position: relative;
  width: 100%;
  height: 100%;
}

.mxd-pinned__img-item {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  opacity: 0;
  -webkit-transition: opacity var(--_animspeed-medium);
  -moz-transition: opacity var(--_animspeed-medium);
  transition: opacity var(--_animspeed-medium);
}

.mxd-pinned__img-item.is-active {
  opacity: 1;
}

.mxd-pinned__img {
  width: auto;
  height: 30rem;
  -o-object-fit: cover;
  object-fit: cover;
  -moz-border-radius: 2em;
  border-radius: 2em;
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__img {
    height: 40rem;
  }
}

.mxd-pinned__content {
  padding: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__content {
    padding: 6rem 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__content {
    padding: 9rem 0;
  }
}

.mxd-pinned__text-wrap {
  padding: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__text-wrap {
    padding: 0 9rem 0 3rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__text-wrap {
    padding: 0 9rem 0 6rem;
  }
}

.mxd-pinned__text-list {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 7rem;
}

@media only screen and (min-width: 768px) {
  .mxd-pinned__text-list {
    gap: 8rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__text-list {
    gap: 0;
  }
}

.mxd-pinned__text-item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__text-item {
    height: -moz-calc(100vh - 12rem);
    height: calc(100vh - 12rem);
    max-width: 640px;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: 0.2;
    -webkit-transition: opacity var(--_animspeed-medium);
    -moz-transition: opacity var(--_animspeed-medium);
    transition: opacity var(--_animspeed-medium);
  }

  .mxd-pinned__text-item.is-active {
    opacity: 1;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__text-item {
    height: -moz-calc(100vh - 18rem);
    height: calc(100vh - 18rem);
  }
}

.mxd-pinned__img-mobile {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 460px;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  margin-bottom: 2.4rem;
}

.mxd-pinned__img-mobile img {
  display: block;
  width: auto;
  height: 24rem;
  -o-object-fit: cover;
  object-fit: cover;
  -moz-border-radius: 2em;
  border-radius: 2em;
}

@media only screen and (min-width: 768px) {
  .mxd-pinned__img-mobile {
    height: 600px;
  }

  .mxd-pinned__img-mobile img {
    height: 30rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__img-mobile {
    display: none;
  }
}

.mxd-pinned__title {
  margin-bottom: 3.4rem;
}

.mxd-pinned__title.centered-mobile {
  text-align: center;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__title.centered-mobile {
    text-align: left;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__title {
    margin-bottom: 4rem;
  }
}

.mxd-pinned__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 3.2rem;
}

.mxd-pinned__tags.centered-mobile {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned__tags.centered-mobile {
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned__tags {
    gap: 1.4rem;
    margin-bottom: 3.8rem;
  }
}

/* ------------------------------------------------*/
/* Features - Pinned Image End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Pinned Universal Start */
/* ------------------------------------------------*/
.mxd-pinned-universal {
  position: relative;
}

.mxd-pinned-universal__static-inner {
  text-align: center;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned-universal__static-inner {
    position: sticky;
    top: 0;
    padding-top: 6rem;
    text-align: left;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-universal__static-inner {
    padding-top: 9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned-universal__scroll {
    padding-top: 6rem;
    grid-column-gap: 1.2rem;
    grid-row-gap: 1.2rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-universal__scroll {
    padding-top: 9rem;
  }
}

.mxd-pinned-universal__scroll-inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-pinned-universal__scroll-inner {
    gap: 7.5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-universal__scroll-inner {
    gap: 9.3rem;
  }
}

/* ------------------------------------------------*/
/* Features - Pinned Universal End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Pinned Projects Start */
/* ------------------------------------------------*/
.mxd-pinned-projects {
  position: relative;
}

.mxd-pinned-projects__static-inner {
  text-align: center;
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned-projects__static-inner {
    position: sticky;
    top: 0;
    padding-top: 6rem;
    text-align: left;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-projects__static-inner {
    padding-top: 9rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned-projects__scroll {
    padding-top: 6rem;
    grid-column-gap: 1.2rem;
    grid-row-gap: 1.2rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-flow: column;
    flex-flow: column;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-projects__scroll {
    padding-top: 9rem;
  }
}

.mxd-pinned-projects__scroll-inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 6.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-pinned-projects__scroll-inner {
    gap: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-pinned-projects__scroll-inner {
    gap: 9rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pinned-projects__scroll-inner {
    gap: 11rem;
  }
}

/* ------------------------------------------------*/
/* Features - Pinned Projects End */
/* ------------------------------------------------*/

/* ------------------------------------------------*/
/* Auto-Scrolling Works Wall Start */
/* ------------------------------------------------*/
.works-wall-section {
  overflow: hidden;
  padding: 3.5rem 0;
  position: relative;
}

.works-wall-outer {
  position: relative;
  width: 100%;
  height: 760px;
  overflow: hidden;
}

/* Fade top and bottom edges */
.works-wall-outer::before,
.works-wall-outer::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  height: 110px;
  z-index: 3;
  pointer-events: none;
}

.works-wall-outer::before {
  top: 0;
  background: linear-gradient(to bottom, var(--base) 0%, transparent 100%);
}

.works-wall-outer::after {
  bottom: 0;
  background: linear-gradient(to top, var(--base) 0%, transparent 100%);
}

.works-wall-grid {
  display: flex;
  gap: 0.9rem;
  justify-content: center;
  align-items: center;
  height: 100%;
  /* Low scale keeps the wall zoomed-out so ~10 narrow columns are visible.
     Corners are filled by columns that overflow the container top & bottom
     (see .works-wall-col height) rather than by zooming in. */
  transform: rotate(-16deg) scale(1.08);
  transform-origin: center center;
}

.works-wall-col {
  flex-shrink: 0;
  width: 165px;
  /* taller than the container so the rotated wall covers the corners;
     three card-sets per track means this can be up to two sets tall and
     still loop seamlessly */
  height: 150%;
  overflow: hidden;
  position: relative;
}

.works-wall-col--extra,
.works-wall-col--xl,
.works-wall-col--xxl {
  display: none;
}

.works-wall-track {
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  animation: wallScrollUp 30s linear infinite;
}

.works-wall-track--down {
  animation: wallScrollDown 30s linear infinite;
}

.works-wall-card {
  flex-shrink: 0;
  width: 100%;
  height: 165px;
  border-radius: 12px;
  overflow: hidden;
  position: relative;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

.works-wall-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.works-wall-card:hover img {
  transform: scale(1.05);
}

/* Subtle overlay on each card */
.works-wall-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.06);
  transition: background 0.3s ease;
  pointer-events: none;
  border-radius: 12px;
}

.works-wall-card:hover::after {
  background: rgba(0, 0, 0, 0);
}

/* Keyframes - vertical scrolling */
/* tracks hold three copies of each set, so one period is a third of the
   track — this lets columns be up to two sets tall without a visible seam */
@keyframes wallScrollUp {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-33.3333%);
  }
}

@keyframes wallScrollDown {
  0% {
    transform: translateY(-33.3333%);
  }
  100% {
    transform: translateY(0);
  }
}

/* Responsive */
@media only screen and (max-width: 575px) {
  .works-wall-section {
    padding: 3rem 0;
  }

  .works-wall-outer {
    height: 420px;
  }

  .works-wall-grid {
    gap: 0.6rem;
    transform: rotate(-16deg) scale(1.12);
  }

  .works-wall-col {
    width: 110px;
  }

  .works-wall-card {
    height: 110px;
    border-radius: 8px;
  }

  .works-wall-track {
    gap: 0.6rem;
  }

  .works-wall-outer::before,
  .works-wall-outer::after {
    height: 80px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .works-wall-outer {
    height: 520px;
  }

  .works-wall-col {
    width: 135px;
  }

  .works-wall-card {
    height: 135px;
  }

  .works-wall-grid {
    transform: rotate(-16deg) scale(1.1);
  }
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .works-wall-outer {
    height: 640px;
  }

  .works-wall-col {
    width: 150px;
  }

  .works-wall-card {
    height: 150px;
  }
}

/* Reveal the extra columns progressively so a dense ~10-panel wall fills
   the viewport edge-to-edge well before ultra-wide screens (columns beyond
   the viewport are clipped by overflow:hidden). */
@media only screen and (min-width: 900px) {
  .works-wall-col--extra {
    display: block;
  }
}

@media only screen and (min-width: 1100px) {
  .works-wall-col--xl {
    display: block;
  }
}

@media only screen and (min-width: 1500px) {
  .works-wall-col--xxl {
    display: block;
  }
}

@media only screen and (min-width: 1600px) {
  .works-wall-section {
    padding: 4rem 0;
  }

  .works-wall-outer {
    height: 900px;
  }

  .works-wall-grid {
    gap: 1rem;
    transform: rotate(-16deg) scale(1.1);
  }

  .works-wall-col {
    width: 168px;
  }

  .works-wall-card {
    height: 175px;
    border-radius: 16px;
  }

  .works-wall-track {
    gap: 1rem;
  }

  .works-wall-outer::before,
  .works-wall-outer::after {
    height: 150px;
  }
}

/* ultra-wide: taller container keeps card density while still covering
   the corners of the rotated wall (placed after the 1600px block so it
   wins for matching widths). */
@media only screen and (min-width: 2200px) {
  .works-wall-outer {
    height: 980px;
  }

  .works-wall-grid {
    transform: rotate(-16deg) scale(1.18);
  }

  /* only 10 columns exist, so widen them to span ultra-wide viewports
     while still showing ~10 panels; taller columns keep corners covered */
  .works-wall-col {
    width: 260px;
    height: 165%;
  }

  .works-wall-card {
    height: 240px;
  }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  .works-wall-track,
  .works-wall-track--down {
    animation: none;
  }
}
/* ------------------------------------------------*/
/* Auto-Scrolling Works Wall End */
/* ------------------------------------------------*/

/* ------------------------------------------------*/
/* Features - Projects List Start */
/* ------------------------------------------------*/
.mxd-projects-list {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-projects-list>.mxd-projects-list__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-projects-list:hover>.mxd-projects-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-projects-list__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-projects-list__item:first-of-type {
  margin-top: 0;
}

@media only screen and (min-width: 1200px) {
  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__title p {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__icon {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__icon i::before {
    -webkit-animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
    -moz-animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
    animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
  }

  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__product p {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__icon-v2 {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-projects-list__item:hover .mxd-projects-list__icon-v2 i::before {
    -webkit-animation: var(--_animspeed-slow) var(--_animbezier) 0.3s 1 both slideRightUp;
    -moz-animation: var(--_animspeed-slow) var(--_animbezier) 0.3s 1 both slideRightUp;
    animation: var(--_animspeed-slow) var(--_animbezier) 0.3s 1 both slideRightUp;
  }
}

.mxd-projects-list__border {
  position: relative;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-projects-list__inner {
  display: block;
  padding: 3rem 0;
}

.mxd-projects-list__inner-v2 {
  display: block;
  padding: 4rem 0 5.6rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__inner-v2 {
    padding: 3.7rem 0 5.5rem 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__inner-v2 {
    padding: 6rem 0;
  }
}

.mxd-projects-list__title {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin-bottom: 3.6rem;
  overflow: hidden;
}

.mxd-projects-list__title p {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__title {
    margin-bottom: 3.9rem;
  }

  .mxd-projects-list__title p {
    font-size: 4.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__title {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
    height: 100%;
    margin-bottom: 0;
  }

  .mxd-projects-list__title p {
    -webkit-transform: translateX(-5.4rem);
    -moz-transform: translateX(-5.4rem);
    -ms-transform: translateX(-5.4rem);
    transform: translateX(-5.4rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-list__title p {
    font-size: 4.4rem;
  }
}

.mxd-projects-list__title-v2 {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin-bottom: 3.1rem;
  overflow: hidden;
}

.mxd-projects-list__title-v2 p {
  font: normal var(--fw-medium) 4.4rem/1.2 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__title-v2 {
    margin-bottom: 3rem;
  }

  .mxd-projects-list__title-v2 p {
    font-size: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__title-v2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
    height: 100%;
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-list__title-v2 p {
    font-size: 7rem;
  }
}

.mxd-projects-list__icon {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 3rem;
}

.mxd-projects-list__icon i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: color var(--_animspeed-medium) var(--_animbezier);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__icon {
    font-size: 4.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__icon {
    -webkit-transform: translateX(-5.4rem);
    -moz-transform: translateX(-5.4rem);
    -ms-transform: translateX(-5.4rem);
    transform: translateX(-5.4rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

.mxd-projects-list__icon-v2 {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1.8rem;
}

.mxd-projects-list__icon-v2 i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: color var(--_animspeed-medium) var(--_animbezier);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__icon-v2 {
    font-size: 2.2rem;
    -webkit-transform: translateX(3.2rem);
    -moz-transform: translateX(3.2rem);
    -ms-transform: translateX(3.2rem);
    transform: translateX(3.2rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-list__icon-v2 {
    font-size: 2.6rem;
    -webkit-transform: translateX(3.8rem);
    -moz-transform: translateX(3.8rem);
    -ms-transform: translateX(3.8rem);
    transform: translateX(3.8rem);
  }
}

.mxd-projects-list__image {
  display: block;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  margin-bottom: 3.4rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__image {
    display: none;
  }
}

.mxd-projects-list__tagslist {
  margin-bottom: 0.6rem;
}

.mxd-projects-list__tagslist ul li p {
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__tagslist {
    margin-bottom: 1.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__tagslist {
    margin-bottom: 0;
  }
}

.mxd-projects-list__tagslist-v2 {
  margin-bottom: 1rem;
}

.mxd-projects-list__tagslist-v2 ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
  color: var(--t-bright);
}

.mxd-projects-list__tagslist-v2 ul li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
}

.mxd-projects-list__tagslist-v2 ul li p {
  line-height: 1.2;
  color: var(--t-bright);
}

.mxd-projects-list__tagslist-v2 ul li svg {
  width: 1.7rem;
  height: 1.7rem;
  fill: currentColor;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__tagslist-v2 {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__tagslist-v2 {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
  }

  .mxd-projects-list__tagslist-v2 ul {
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

.mxd-projects-list__date {
  text-align: right;
}

.mxd-projects-list__date p {
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__date {
    text-align: right;
  }
}

.mxd-projects-list__product {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 0.8rem;
  text-align: right;
}

.mxd-projects-list__product p {
  line-height: 1.2;
  font-weight: var(--fw-medium);
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-projects-list__product {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    gap: 1.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-list__product {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .mxd-projects-list__product p {
    -webkit-transform: translateX(3.2rem);
    -moz-transform: translateX(3.2rem);
    -ms-transform: translateX(3.2rem);
    transform: translateX(3.2rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-list__product p {
    -webkit-transform: translateX(3.8rem);
    -moz-transform: translateX(3.8rem);
    -ms-transform: translateX(3.8rem);
    transform: translateX(3.8rem);
  }
}

/* ------------------------------------------------*/
/* Features - Projects List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Projects Masonry Start */
/* ------------------------------------------------*/
.mxd-projects-masonry {
  position: relative;
}

.mxd-projects-masonry__title {
  position: relative;
  height: auto;
  padding: 0 1.5rem;
}

.mxd-projects-masonry__title.headline-title {
  margin-bottom: 12.9rem;
}

.mxd-projects-masonry__title.section-title {
  margin-bottom: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-masonry__title.headline-title {
    margin-bottom: 14.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-masonry__title {
    padding: 0 3rem;
  }

  .mxd-projects-masonry__title.headline-title {
    margin-bottom: 14.2rem;
  }

  .mxd-projects-masonry__title.section-title {
    margin-bottom: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-masonry__title {
    padding: 0 3rem;
  }

  .mxd-projects-masonry__title.headline-title {
    margin-bottom: 17.9rem;
  }

  .mxd-projects-masonry__title.section-title {
    margin-bottom: 20rem;
  }
}

.mxd-projects-masonry__item {
  padding: 0 1.5rem;
  margin-bottom: 6.2rem;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-masonry__item {
    padding: 0 1.5rem;
    margin-bottom: 7rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-masonry__item {
    padding: 0 3rem;
    margin-bottom: 9rem;
  }

  .mxd-projects-masonry__item:last-of-type {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-masonry__item {
    padding: 0 4.5rem;
    margin-bottom: 11rem;
  }
}

.mxd-project-item__media.masonry-media {
  height: auto;
}

@media only screen and (min-width: 1200px) {
  .mxd-project-item__media.masonry-media {
    height: 600px;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-project-item__media.masonry-media {
    height: 600px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project-item__media.masonry-media {
    height: 800px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-project-item__preview.masonry-preview {
    height: 600px;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-project-item__preview.masonry-preview {
    height: 600px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project-item__preview.masonry-preview {
    height: 800px;
  }
}

.mxd-projects-masonry__btngroup {
  padding: 0 1.5rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-projects-masonry__btngroup {
    position: absolute;
    right: 0;
    bottom: 8rem;
    padding: 0 3rem;
  }
}

/* ------------------------------------------------*/
/* Features - Projects Masonry End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Awards List Start */
/* ------------------------------------------------*/
.mxd-awards-list {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-awards-list>.mxd-awards-list__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-awards-list:hover>.mxd-awards-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-awards-list__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-awards-list__item:first-of-type {
  margin-top: 0;
}

@media only screen and (min-width: 1200px) {
  .no-touch .mxd-awards-list__item:hover .mxd-awards-list__title p {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-awards-list__item:hover .mxd-awards-list__icon {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  .no-touch .mxd-awards-list__item:hover .mxd-awards-list__icon i::before {
    -webkit-animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
    -moz-animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
    animation: var(--_animspeed-slow) var(--_animbezier) 0.2s 1 both slideRight;
  }
}

.mxd-awards-list__border {
  position: relative;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-awards-list__inner {
  display: block;
  padding: 3rem 0;
}

.mxd-awards-list__title {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -moz-box-orient: horizontal;
  -moz-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1rem;
  margin-bottom: 2.6rem;
  overflow: hidden;
}

.mxd-awards-list__title p {
  font: normal var(--fw-medium) 3rem/1.2 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-awards-list__title {
    margin-bottom: 2.9rem;
  }

  .mxd-awards-list__title p {
    font-size: 4.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-awards-list__title {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
    height: 100%;
    margin-bottom: 0;
  }

  .mxd-awards-list__title p {
    -webkit-transform: translateX(-5.4rem);
    -moz-transform: translateX(-5.4rem);
    -ms-transform: translateX(-5.4rem);
    transform: translateX(-5.4rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-awards-list__title p {
    font-size: 4.4rem;
  }
}

.mxd-awards-list__icon {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 3rem;
}

.mxd-awards-list__icon i {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  position: relative;
  overflow: hidden;
  color: var(--t-bright);
  -webkit-transition: color var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: color var(--_animspeed-medium) var(--_animbezier);
  transition: color var(--_animspeed-medium) var(--_animbezier);
}

@media only screen and (min-width: 768px) {
  .mxd-awards-list__icon {
    font-size: 4.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-awards-list__icon {
    -webkit-transform: translateX(-5.4rem);
    -moz-transform: translateX(-5.4rem);
    -ms-transform: translateX(-5.4rem);
    transform: translateX(-5.4rem);
    -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier);
    transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  }
}

.mxd-awards-list__image {
  display: block;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  margin-bottom: 3.4rem;
}

@media only screen and (min-width: 768px) {
  .mxd-awards-list__image {
    margin-bottom: 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-awards-list__image {
    display: none;
  }
}

.mxd-awards-list__tagslist {
  margin-bottom: 0.6rem;
}

.mxd-awards-list__tagslist ul li p {
  color: var(--t-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-awards-list__tagslist {
    margin-bottom: 1.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-awards-list__tagslist {
    margin-bottom: 0;
  }
}

.mxd-awards-list__date {
  text-align: right;
}

.mxd-awards-list__date p {
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {
  .mxd-awards-list__date {
    text-align: right;
  }
}

/* ------------------------------------------------*/
/* Features - Awards List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Statistics Simple Start */
/* ------------------------------------------------*/
.mxd-stats-simple {
  position: relative;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-stats-simple>.mxd-stats-simple__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-stats-simple:hover>.mxd-stats-simple__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-stats-simple__item {
  position: relative;
  padding-top: 3rem;
}

.mxd-stats-simple__item:first-of-type {
  padding-top: 0;
}

.mxd-stats-simple__item:first-of-type .mxd-stats-simple__inner {
  padding-top: 6rem;
  border-top: 1px solid var(--st-bright);
}

.mxd-stats-simple__item .mxd-stats-simple__inner {
  padding-bottom: 6rem;
  border-bottom: 1px solid var(--st-bright);
}

@media only screen and (min-width: 992px) {
  .mxd-stats-simple__item {
    padding-top: 0;
  }

  .mxd-stats-simple__item .mxd-stats-simple__inner {
    padding-bottom: 0;
    border-bottom: none;
  }

  .mxd-stats-simple__item:first-of-type .mxd-stats-simple__inner {
    padding-top: 0;
    border-top: none;
  }
}

.no-touch .mxd-stats-simple__item:hover .mxd-stats-simple__image {
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.mxd-stats-simple__inner {
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

@media only screen and (min-width: 992px) {
  .mxd-stats-simple__inner {
    -webkit-box-align: start;
    -moz-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    height: 320px;
    padding: 0 3rem;
    border-bottom: none;
    border-left: 1px solid var(--st-bright);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-stats-simple__inner {
    height: 400px;
  }
}

.mxd-stats-simple__image {
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  height: 5.4rem;
  width: auto;
  -o-object-fit: contain;
  object-fit: contain;
  margin-bottom: 2rem;
}

@media only screen and (min-width: 992px) {
  .mxd-stats-simple__image {
    margin-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-stats-simple__image {
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
    transition: all var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-stats-simple__image {
    height: 7rem;
  }
}

.mxd-stats-simple__counter {
  margin-bottom: 2.8rem;
}

@media only screen and (min-width: 992px) {
  .mxd-stats-simple__counter {
    margin-bottom: 1.6rem;
  }
}

.mxd-stats-simple__descr {
  text-align: center;
}

@media only screen and (min-width: 992px) {
  .mxd-stats-simple__descr {
    text-align: left;
  }
}

/* ------------------------------------------------*/
/* Features - Statistics Simple End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Statistics Cards Start */
/* ------------------------------------------------*/
.mxd-stats-cards {
  position: relative;
}

.mxd-stats-cards__item {
  position: relative;
  height: 540px;
}

@media only screen and (min-width: 768px) {
  .mxd-stats-cards__item {
    height: 420px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-stats-cards__item {
    height: 600px;
  }
}

.mxd-stats-cards__inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 3.4rem;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.mxd-stats-cards__inner .mxd-counter {
  z-index: 1;
}

@media only screen and (min-width: 768px) {
  .mxd-stats-cards__inner {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 0;
  }

  .mxd-stats-cards__inner.align-end {
    -webkit-box-align: end;
    -moz-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }
}

.mxd-stats-cards__btngroup {
  z-index: 1;
}

.mxd-stats-cards__image {
  position: absolute;
  left: 0;
  top: 32rem;
  width: 100%;
  max-width: 400px;
  height: auto;
  padding: 0 4rem 0 0;
  z-index: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-stats-cards__image {
    top: 0;
    width: 60%;
    max-width: none;
    padding: 0;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-1 {
    width: 470px;
    top: -4rem;
    left: -4rem;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-2 {
    width: 420px;
    top: auto;
    bottom: -4rem;
    padding-top: 4rem;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-3 {
    width: 450px;
    top: auto;
    right: -4rem;
    bottom: 0;
    left: auto;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-4 {
    width: 400px;
    top: auto;
    bottom: 4rem;
    left: auto;
    right: -6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-stats-cards__image.mxd-stats-cards-image-1 {
    width: 330px;
    top: 0;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-4 {
    width: 280px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-stats-cards__image.mxd-stats-cards-image-1 {
    width: 470px;
    top: 4rem;
    left: -6rem;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-2 {
    width: 620px;
    bottom: auto;
    top: 4rem;
    padding-top: 0;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-3 {
    width: 620px;
  }

  .mxd-stats-cards__image.mxd-stats-cards-image-4 {
    width: 400px;
  }
}

/* ------------------------------------------------*/
/* Features - Statistics Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Services Cards #01 Start */
/* ------------------------------------------------*/
.mxd-services-cards {
  position: relative;
}

.mxd-services-cards__item {
  position: relative;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-services-cards__item {
    height: 540px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards__item {
    height: 760px;
  }
}

.mxd-services-cards__inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards__inner.justify-end {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .mxd-services-cards__inner.justify-between {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.mxd-services-cards__controls {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 2;
}

.mxd-services-cards__title {
  margin-bottom: 3.6rem;
  padding-right: 2.6rem;
}

.mxd-services-cards__title p {
  font: normal var(--fw-medium) 3.6rem/1.1 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

.mxd-services-cards__title p.opposite {
  color: var(--t-opp-bright);
}

.mxd-services-cards__title p.permanent-light {
  color: var(--pt-t-light-bright);
}

.mxd-services-cards__title p.permanent-dark {
  color: var(--pt-t-dark-bright);
}

@media only screen and (min-width: 768px) {
  .mxd-services-cards__title {
    margin-bottom: 3.4rem;
  }

  .mxd-services-cards__title p {
    font-size: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards__title {
    z-index: 1;
  }

  .mxd-services-cards__title.width-60 {
    width: 60%;
    max-width: 640px;
  }

  .mxd-services-cards__title.width-70 {
    width: 70%;
    max-width: 360px;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-services-cards__title.width-70 {
    max-width: 440px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards__title {
    margin-bottom: 4rem;
  }

  .mxd-services-cards__title p {
    font-size: 7rem;
  }

  .mxd-services-cards__title.width-70 {
    max-width: 490px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards__info {
    z-index: 1;
  }

  .mxd-services-cards__info.width-60 {
    width: 60%;
    max-width: 640px;
  }

  .mxd-services-cards__info.width-70 {
    width: 70%;
    max-width: 300px;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-services-cards__info.width-70 {
    max-width: 440px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards__info.width-70 {
    max-width: 490px;
  }
}

.mxd-services-cards__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 3.2rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards__tags {
    gap: 1.4rem;
    margin-bottom: 3.8rem;
  }
}

.mxd-services-cards__image {
  width: 100%;
  max-width: 400px;
  margin-top: 3.4rem;
}

.mxd-services-cards__image.mxd-services-cards-image-3 .image-2 {
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards__image {
    position: absolute;
    max-width: none;
    margin-top: 0;
    z-index: 0;
  }

  .mxd-services-cards__image.mxd-services-cards-image-1 {
    width: 480px;
    right: 0;
    bottom: -240px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-2 {
    width: 380px;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: -220px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 {
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 .image-1,
  .mxd-services-cards__image.mxd-services-cards-image-3 .image-2 {
    position: absolute;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 .image-1 {
    width: 300px;
    left: 0;
    top: -100px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 .image-2 {
    display: block;
    width: 480px;
    bottom: -180px;
    right: -40px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-4 {
    width: 280px;
    top: 1rem;
    right: -50px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-5 {
    width: 450px;
    bottom: -30px;
    right: -80px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards__image.mxd-services-cards-image-1 {
    width: 710px;
    right: 0;
    bottom: -320px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-2 {
    width: 580px;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: -300px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 .image-1 {
    width: 400px;
    left: -3rem;
    top: -180px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-3 .image-2 {
    display: block;
    width: 610px;
    bottom: -130px;
    right: 20px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-4 {
    width: 410px;
    top: 1rem;
    right: -70px;
  }

  .mxd-services-cards__image.mxd-services-cards-image-5 {
    width: 670px;
    bottom: -50px;
    right: -100px;
  }
}

/* ------------------------------------------------*/
/* Features - Services Cards #01 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Services Cards #02 Start */
/* ------------------------------------------------*/
.mxd-services-cards-s {
  position: relative;
}

.mxd-services-cards-s__item {
  position: relative;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-services-cards-s__item {
    height: 420px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards-s__item {
    height: 600px;
  }
}

.mxd-services-cards-s__inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__inner.justify-end {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .mxd-services-cards-s__inner.justify-between {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.mxd-services-cards-s__title {
  margin-bottom: 2.8rem;
}

.mxd-services-cards-s__title h3 {
  font-size: 3.6rem;
}

@media only screen and (min-width: 992px) {
  .mxd-services-cards-s__title {
    width: 50%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__title {
    width: 100%;
    z-index: 1;
  }

  .mxd-services-cards-s__title h3 {
    font-size: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards-s__title h3 {
    font-size: 5rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-services-cards-s__info {
    width: 50%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__info {
    width: 100%;
    z-index: 1;
  }

  .mxd-services-cards-s__info.width-50 {
    width: 50%;
    max-width: 480px;
  }
}

.mxd-services-cards-s__tags {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  margin-bottom: 2.6rem;
}

.mxd-services-cards-s__image {
  width: 100%;
  margin-top: 2.8rem;
}

@media only screen and (min-width: 992px) {
  .mxd-services-cards-s__image {
    position: absolute;
    top: 0;
    right: -3rem;
    width: 50%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__image {
    max-width: none;
    margin-top: 0;
    z-index: 0;
  }

  .mxd-services-cards-s__image.image-right {
    top: 3rem;
  }

  .mxd-services-cards-s__image.image-top-right {
    width: 260px;
    top: -80px;
    right: -30px;
  }

  .mxd-services-cards-s__image.image-bottom {
    width: 100%;
    max-width: 300px;
    top: auto;
    right: auto;
    left: 50%;
    right: auto;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    bottom: -160px;
  }

  .mxd-services-cards-s__image.image-bottom-2 {
    bottom: -260px;
  }

  .mxd-services-cards-s__image.image-top {
    width: 100%;
    max-width: 330px;
    top: auto;
    right: auto;
    top: -120px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards-s__image.image-top-right {
    width: 414px;
    top: -120px;
    right: -60px;
  }

  .mxd-services-cards-s__image.image-bottom {
    max-width: 470px;
    bottom: -200px;
  }

  .mxd-services-cards-s__image.image-bottom-2 {
    bottom: -350px;
  }

  .mxd-services-cards-s__image.image-top {
    max-width: 470px;
    top: -100px;
  }
}

/* ------------------------------------------------*/
/* Services Cards #02 - live visual responsive fix */
/* The 3D PNGs were decorative and bled outside the */
/* card (clipped by overflow:hidden). The live      */
/* canvas visuals (js/service-card-visuals.js) are  */
/* pinned in-flow at full width instead, so the      */
/* template's fixed card height clipped the graphic  */
/* and squeezed the copy on every screen >= 768px.   */
/* Let these cards grow to fit heading + tags + copy */
/* + the full graphic at all breakpoints.            */
/* ------------------------------------------------*/
.mxd-services-cards-s__item {
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-services-cards-s__item {
    height: auto;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-cards-s__item {
    height: auto;
  }
}

/* keep the inner panel filling equal-height rows */
.mxd-services-cards-s__inner {
  height: 100%;
}

/* keep the heading readable on small screens */
@media only screen and (max-width: 575px) {
  .mxd-services-cards-s__title {
    margin-bottom: 2rem;
  }

  .mxd-services-cards-s__title h3 {
    font-size: 3rem;
  }
}

/* ------------------------------------------------*/
/* Compact (col-4) demos as corner accents          */
/* These cards are only as tall as their copy, so a  */
/* full-bleed canvas had nowhere to sit but on top   */
/* of the text. Pin each demo small in the top-right */
/* corner so it stays fully visible and clear of the */
/* heading + tags + paragraph, with no change to     */
/* card height. To keep the long headings (Web       */
/* Development / Custom Software) from running into   */
/* the accent, the col-4 headings are trimmed a notch */
/* so the corner stays free (Cloud / Lipsync headings */
/* already fit). The wide col-8 card (image-right) is  */
/* tall and two-column already, so it's left as-is.   */
/* ------------------------------------------------*/
@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__image.image-top-right,
  .mxd-services-cards-s__image.image-bottom,
  .mxd-services-cards-s__image.image-bottom.image-bottom-2,
  .mxd-services-cards-s__image.image-top {
    width: 42%;
    max-width: 200px;
    min-width: 132px;
    top: 1.6rem;
    bottom: auto;
    left: auto;
    right: 1.6rem;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    transform: none;
  }

  /* reserve the left column so the heading + tags stay clear of */
  /* the corner accent; the accent and these scale together      */
  .col-xl-4.mxd-services-cards-s__item .mxd-services-cards-s__title,
  .col-xl-4.mxd-services-cards-s__item .mxd-services-cards-s__tags {
    width: 56%;
  }

  .col-xl-4.mxd-services-cards-s__item .mxd-services-cards-s__title h3 {
    font-size: 2.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .col-xl-4.mxd-services-cards-s__item .mxd-services-cards-s__title h3 {
    font-size: 3.6rem;
  }
}

/* The wide col-8 card's timeline was hung 3rem past the card edge */
/* (a leftover from the old decorative PNG), so the "Final" node + */
/* caption were clipped by overflow:hidden. Tuck it back inside.   */
@media only screen and (min-width: 1200px) {
  .mxd-services-cards-s__image.image-right {
    right: 1.5rem;
    width: 48%;
  }
}

/* ================================================================ */
/* Services Cards #02 - unified "dark lab" premium treatment         */
/* The five cards previously used four clashing full-bleed colours    */
/* (white / purple / lime / black), which read as scattered. Unify    */
/* them onto one refined near-black surface with a hairline border,   */
/* a faint per-card accent glow matched to the live visual inside,    */
/* a top accent rule and a soft lift on hover. The canvas visuals     */
/* (retuned for a dark field in service-card-visuals.js) become the   */
/* hero of each card and the whole section reads as one set.          */
/* ================================================================ */
#services .mxd-services-cards-s__inner {
  --card-accent: 159, 139, 231;            /* lavender (default) */
  /* pointer position (px, relative to the card) — set by js/card-spotlight.js */
  --mx: 50%;
  --my: 0%;
  background-color: #141416;
  background-image:
    radial-gradient(135% 120% at 100% 0%, rgba(var(--card-accent), 0.13), rgba(var(--card-accent), 0) 55%),
    linear-gradient(180deg, #1c1c20 0%, #141416 100%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  -webkit-box-shadow: 0 2rem 5rem -2.5rem rgba(0, 0, 0, 0.7);
  box-shadow: 0 2rem 5rem -2.5rem rgba(0, 0, 0, 0.7);
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier), border-color var(--_animspeed-medium) var(--_animbezier), -webkit-box-shadow var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), border-color var(--_animspeed-medium) var(--_animbezier), box-shadow var(--_animspeed-medium) var(--_animbezier);
  will-change: transform;
}

/* per-card accent, matched to the dominant colour of its visual */
#services .mxd-services-cards-s__item:nth-child(2) .mxd-services-cards-s__inner,   /* AI Lipsync (lime) */
#services .mxd-services-cards-s__item:nth-child(4) .mxd-services-cards-s__inner {  /* Cloud & Infra (lime) */
  --card-accent: 221, 241, 96;
}

/* thin accent rule along the top edge ties the chrome to the visual */
#services .mxd-services-cards-s__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(var(--card-accent), 0)), color-stop(50%, rgba(var(--card-accent), 0.65)), color-stop(100%, rgba(var(--card-accent), 0)));
  background: linear-gradient(90deg, rgba(var(--card-accent), 0) 0%, rgba(var(--card-accent), 0.65) 50%, rgba(var(--card-accent), 0) 100%);
  opacity: 0.5;
  -webkit-transition: opacity var(--_animspeed-medium) var(--_animbezier);
  transition: opacity var(--_animspeed-medium) var(--_animbezier);
  z-index: 2;
}

/* soft spotlight on the card surface, tracking the cursor */
#services .mxd-services-cards-s__inner::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(380px circle at var(--mx) var(--my), rgba(var(--card-accent), 0.1), transparent 60%);
  opacity: 0;
  -webkit-transition: opacity 0.45s ease;
  transition: opacity 0.45s ease;
  pointer-events: none;
  z-index: 1;
}

/* hover: gentle lift + accent-tinted edge, refined neutral elevation */
.no-touch #services .mxd-services-cards-s__inner:hover {
  -webkit-transform: translateY(-0.6rem);
  transform: translateY(-0.6rem);
  border-color: rgba(var(--card-accent), 0.4);
  -webkit-box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.35), 0 1.6rem 3.2rem -1rem rgba(0, 0, 0, 0.6), 0 3.4rem 7rem -2.6rem rgba(var(--card-accent), 0.28);
  box-shadow: 0 0.2rem 0.4rem rgba(0, 0, 0, 0.35), 0 1.6rem 3.2rem -1rem rgba(0, 0, 0, 0.6), 0 3.4rem 7rem -2.6rem rgba(var(--card-accent), 0.28);
}

.no-touch #services .mxd-services-cards-s__inner:hover::before {
  opacity: 1;
}

.no-touch #services .mxd-services-cards-s__inner:hover::after {
  opacity: 1;
}

/* typography: light ink on the dark field, across every card */
#services .mxd-services-cards-s__title h3 {
  color: #FAF7F6;
}

#services .mxd-services-cards-s__info p {
  color: rgba(250, 247, 246, 0.66);
}

/* tags: one unified light hairline pill on all cards */
#services .mxd-services-cards-s__tags .tag {
  background-color: rgba(255, 255, 255, 0.02);
  border-color: rgba(255, 255, 255, 0.22);
  color: rgba(250, 247, 246, 0.92);
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.no-touch #services .mxd-services-cards-s__tags .tag:hover {
  border-color: rgba(var(--card-accent), 0.7);
  color: #fff;
}

/* ------------------------------------------------*/
/* Features - Services Cards #02 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Services List Start */
/* ------------------------------------------------*/
.mxd-services-list {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-services-list.grid-top {
  padding-top: 14rem;
}

@media only screen and (min-width: 768px) {
  .mxd-services-list.grid-top {
    padding-top: 16rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-list.grid-top {
    padding-top: 20rem;
  }
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-services-list>.mxd-services-list__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-services-list:hover>.mxd-services-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-services-list__item {
  position: relative;
  margin-top: -2px;
}

.mxd-services-list__item:first-of-type {
  margin-top: 0;
}

.mxd-services-list__border {
  position: relative;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-services-list__inner {
  padding: 6rem 0;
}

.mxd-services-list__title {
  margin-bottom: 3.4rem;
}

.mxd-services-list__title p {
  font: normal var(--fw-medium) 4.4rem/0.7 var(--_font-accent);
  letter-spacing: -0.06rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {
  .mxd-services-list__title {
    margin-bottom: 0;
  }

  .mxd-services-list__title p {
    font-size: 9rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-list__title p {
    font-size: 12rem;
  }
}

.mxd-services-list__descr {
  margin-bottom: 2.6rem;
}

.mxd-services-list__descr p {
  color: var(--t-medium);
  font-size: 1.8rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-services-list__descr {
    margin-bottom: 0;
  }
}

.mxd-services-list__tagslist ul li p {
  color: var(--t-medium);
  font-size: 1.8rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-services-list__tagslist {
    padding: 0 3rem;
  }
}

/* ------------------------------------------------*/
/* Features - Services List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Capabilities List Start */
/* ------------------------------------------------*/
.mxd-cpb-list {
  position: relative;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-cpb-list>.mxd-cpb-list__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-cpb-list:hover>.mxd-cpb-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-cpb-list__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-cpb-list__item:hover {
  z-index: 10;
}

.mxd-cpb-list__item:first-of-type {
  margin-top: 0;
}

.mxd-cpb-list__divider {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-cpb-list__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 3rem 0 3.5rem 0;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-cpb-list__content {
    padding: 3rem 0;
  }
}

.mxd-cpb-list__title {
  position: relative;
  color: var(--t-bright);
}

.mxd-cpb-list__num {
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-muted);
}

@media only screen and (min-width: 1200px) {
  .mxd-cpb-list__num {
    font-size: 3rem;
    color: var(--t-bright);
  }
}

.mxd-cpb-list__image {
  display: block;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  margin-bottom: 4rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-cpb-list__image {
    display: none;
  }
}

/* ------------------------------------------------*/
/* Features - Capabilities List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Resume List Start */
/* ------------------------------------------------*/
.mxd-res-list {
  position: relative;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-res-list>.mxd-res-list__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-res-list:hover>.mxd-res-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-res-list__item {
  position: relative;
  display: block;
  margin-top: -2px;
}

.mxd-res-list__item:first-of-type {
  margin-top: 0;
}

.mxd-res-list__divider {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-res-list__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 3.6rem 0 3.5rem 0;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) {
  .mxd-res-list__content {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 6rem 0 7rem 0;
  }
}

.mxd-res-list__data {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1.6rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-res-list__data {
    gap: 2.8rem;
  }
}

.mxd-res-list__source {
  font-size: 1.6rem;
  margin-top: 0.2rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-res-list__source {
    font-size: 1.8rem;
  }
}

.mxd-res-list__descr {
  max-width: 560px;
}

.mxd-res-list__year {
  margin-bottom: 1.1rem;
}

.mxd-res-list__year p {
  font-weight: var(--fw-medium);
  color: var(--t-bright);
}

/* ------------------------------------------------*/
/* Features - Resume List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Approach List Start */
/* ------------------------------------------------*/
.mxd-approach-list {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-approach-list>.mxd-approach-list__item {
    -webkit-transition: opacity var(--_animspeed-medium) ease;
    -moz-transition: opacity var(--_animspeed-medium) ease;
    transition: opacity var(--_animspeed-medium) ease;
  }

  .no-touch .mxd-approach-list:hover>.mxd-approach-list__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-approach-list__item {
  position: relative;
  width: 100%;
  margin-top: -2px;
}

.mxd-approach-list__item:first-of-type {
  margin-top: 0;
}

.no-touch .mxd-approach-list__item:hover .mxd-approach-list__image img {
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  animation-play-state: running;
}

.mxd-approach-list__border {
  position: relative;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-approach-list__inner {
  padding: 7rem 0;
}

@media only screen and (min-width: 768px) {
  .mxd-approach-list__inner {
    padding: 8rem 0;
  }
}

.mxd-approach-list__image {
  display: block;
  width: 7rem;
  height: 7rem;
  margin-bottom: 2.4rem;
}

.mxd-approach-list__image img {
  display: block;
  position: relative;
  -webkit-animation: spin 5s linear infinite;
  -moz-animation: spin 5s linear infinite;
  animation: spin 5s linear infinite;
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
  animation-play-state: paused;
}

@media only screen and (min-width: 1200px) {
  .mxd-approach-list__image {
    margin-bottom: 0;
  }
}

.mxd-approach-list__title {
  margin-bottom: 2.2rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-approach-list__title {
    margin-bottom: 0;
    padding: 0 3rem;
    text-align: right;
  }
}

/* ------------------------------------------------*/
/* Features - Approach List End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Divider Image Parallax Start */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Divider Image Parallax End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Marquee Start */
/* ------------------------------------------------*/
.marquee {
  max-width: 100%;
  overflow: hidden;
}

.marquee.bright .marquee__text,
.marquee.bright .marquee__image {
  color: var(--t-bright);
}

.marquee.medium .marquee__text,
.marquee.medium .marquee__image {
  color: var(--t-medium);
}

.marquee.muted .marquee__text,
.marquee.muted .marquee__image {
  color: var(--t-muted);
}

.marquee.muted-extra .marquee__text,
.marquee.muted-extra .marquee__image {
  color: var(--t-muted-extra);
}

.marquee.permanent-desktop .marquee__text,
.marquee.permanent-desktop .marquee__image {
  color: var(--t-bright);
}

@media only screen and (min-width: 1200px) {

  .marquee.permanent-desktop .marquee__text,
  .marquee.permanent-desktop .marquee__image {
    color: var(--pt-t-light-bright);
  }

  .marquee.permanent-desktop .marquee__text {
    font-weight: var(--fw-regular);
  }
}

.marquee--gsap .marquee__top,
.marquee--gsap .marquee__bottom {
  translate: -moz-calc(-100% + 100vw) !important;
  translate: calc(-100% + 100vw) !important;
}

.marquee-right--gsap .marquee__toright,
.marquee-left--gsap .marquee__toleft {
  translate: -moz-calc(-100% + 100vw) !important;
  translate: calc(-100% + 100vw) !important;
}

.marquee__top,
.marquee__bottom,
.marquee__toleft,
.marquee__toright,
.items__container {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  will-change: transform;
}

.marquee__item {
  margin-top: 1.5rem;
  margin-right: 1.5rem;
}

.marquee__item.one-line {
  margin-top: 0;
}

.marquee__item.item-regular-xl {
  margin-right: 3rem;
}

@media only screen and (min-width: 768px) {
  .marquee__item {
    margin-top: 3rem;
    margin-right: 3rem;
  }

  .marquee__item.one-line {
    margin-top: 0;
  }

  .marquee__item.item-regular-xl {
    margin-right: 6rem;
  }
}

.marquee__item {
  position: relative;
  width: 430px;
  height: 320px;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 20px;
  -webkit-animation: animateZ 1s infinite;
  -moz-animation: animateZ 1s infinite;
  animation: animateZ 1s infinite;
}

.marquee__item img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.marquee__item.overflow-visible {
  overflow: visible;
}

.marquee__item.has-caption {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  -webkit-box-pack: start;
  -moz-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  background-color: var(--accent);
}

.marquee__item.has-caption p {
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-opp-bright);
}

.marquee__item.item-vertical {
  width: 400px;
  height: 460px;
}

.marquee__item.item-regular {
  width: auto;
  height: auto;
  -moz-border-radius: 0;
  border-radius: 0;
  gap: 0;
  background-color: transparent;
  -webkit-animation: animateZ 1s infinite;
  -moz-animation: animateZ 1s infinite;
  animation: animateZ 1s infinite;
}

.marquee__item.item-regular-xl {
  gap: 3rem;
}

.marquee__item.item-partners {
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 380px;
  height: 250px;
}

.marquee__item.item-partners::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  z-index: -1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
}

.marquee__item.item-partners img {
  width: 170px;
  height: auto;
}

.marquee__item.item-large {
  width: 830px;
  height: 630px;
}

@media only screen and (min-width: 768px) {
  .marquee__item {
    width: 490px;
    height: 360px;
  }

  .marquee__item.has-caption p {
    font-size: 3rem;
  }

  .marquee__item.item-vertical {
    width: 525px;
    height: 600px;
  }

  .marquee__item.item-regular-xl {
    gap: 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .marquee__item {
    width: 540px;
    height: 400px;
  }

  .marquee__item.item-vertical {
    width: 470px;
    height: 540px;
  }
}

@media only screen and (min-width: 1400px) {
  .marquee__item.item-large {
    width: 880px;
    height: 670px;
  }
}

@media only screen and (min-width: 1600px) {
  .marquee__item {
    width: 730px;
    height: 540px;
  }

  .marquee__item.has-caption p {
    font-size: 5rem;
  }

  .marquee__item.item-vertical {
    width: 525px;
    height: 600px;
  }

  .marquee__item.item-large {
    width: 1000px;
    height: 760px;
  }
}

.marquee__link {
  display: block;
  width: 100%;
  height: 100%;
}

.marquee__link img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.marquee__text {
  margin-right: 1.6rem;
}

.marquee__text.text-with-gliph {
  margin-right: 0;
}

.marquee__text.text-with-gliph::after {
  content: "*";
  display: inline;
  padding-left: 1.6rem;
}

@media only screen and (min-width: 1200px) {
  .marquee__text {
    margin-right: 3.6rem;
  }

  .marquee__text.text-with-gliph::after {
    padding-left: 3.6rem;
  }
}

.marquee__image {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 4.1rem;
  height: 4.1rem;
}

.marquee__image.image-xl {
  width: 9rem;
  height: 9rem;
}

@media only screen and (min-width: 768px) {
  .marquee__image {
    width: 8.1rem;
    height: 8.1rem;
  }

  .marquee__image.image-xl {
    width: 14rem;
    height: 14rem;
  }
}

@media only screen and (min-width: 1400px) {
  .marquee__image.image-xl {
    width: 18rem;
    height: 18rem;
  }
}

.marquee__image img,
.marquee__image video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.marquee__text {
  font: normal var(--fw-regular) 6rem/1.2 var(--_font-accent);
  letter-spacing: -0.06rem;
}

.marquee__text.text-xl {
  font-weight: var(--fw-medium);
  font-size: 20rem;
  line-height: 0.8;
}

@media only screen and (min-width: 768px) {
  .marquee__text {
    font-size: 12rem;
  }

  .marquee__text.text-xl {
    font-size: 30rem;
  }
}

@media only screen and (min-width: 1200px) {
  .marquee__text {
    font-size: 12rem;
  }
}

@media only screen and (min-width: 1400px) {
  .marquee__text.text-xl {
    font-size: 40rem;
  }
}

.marquee__component {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  width: auto;
  height: 280px;
  margin: 3rem 0;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  overflow: hidden;
  padding: 1rem;
  background-color: var(--base-tint);
  border: 1px solid var(--st-muted);
}

.marquee__component img {
  -moz-border-radius: 1rem;
  border-radius: 1rem;
}

@media only screen and (min-width: 768px) {
  .marquee__component {
    -moz-border-radius: 2rem;
    border-radius: 2rem;
  }
}

@media only screen and (min-width: 1600px) {
  .marquee__component {
    height: 320px;
  }
}

@-webkit-keyframes toLeft {
  to {
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

@-moz-keyframes toLeft {
  to {
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

@keyframes toLeft {
  to {
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
  }
}

@-webkit-keyframes toRight {
  to {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@-moz-keyframes toRight {
  to {
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes toRight {
  to {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    transform: translateX(0);
  }
}

@-webkit-keyframes animateZ {
  to {
    -webkit-transform: translateZ(1px);
    transform: translateZ(1px);
  }
}

@-moz-keyframes animateZ {
  to {
    -moz-transform: translateZ(1px);
    transform: translateZ(1px);
  }
}

@keyframes animateZ {
  to {
    -webkit-transform: translateZ(1px);
    -moz-transform: translateZ(1px);
    transform: translateZ(1px);
  }
}

/* ------------------------------------------------*/
/* Features - Marquee End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Stack Services #01 Start */
/* ------------------------------------------------*/
.stack-wrapper {
  position: relative;
  width: 100%;
}

.stack-wrapper.in-content-stack {
  margin-top: -7.6rem;
}

.stack-wrapper.mxd-hero-02-stack {
  margin-top: -10.6rem;
}

@media only screen and (min-width: 768px) {
  .stack-wrapper.mxd-hero-02-stack {
    margin-top: -13.6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .stack-wrapper.mxd-hero-08-stack {
    margin-top: -1.6rem;
  }
}

@media only screen and (min-width: 1600px) {
  .stack-wrapper.in-content-stack {
    margin-top: -4.6rem;
  }

  .stack-wrapper.mxd-hero-02-stack {
    margin-top: -13.6rem;
  }

  .stack-wrapper.mxd-hero-08-stack {
    margin-top: 2.3rem;
  }
}

.stack-offset {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 10.6rem;
  background-color: transparent;
}

@media only screen and (min-width: 768px) {
  .stack-offset {
    height: 13.6rem;
  }
}

.services-stack {
  width: 100%;
  position: relative;
  height: 75vh;
  min-height: 600px;
}

@media only screen and (min-width: 992px) {
  .services-stack {
    height: 600px;
    min-height: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .services-stack {
    height: 760px;
  }
}

.stack-item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  width: 100%;
  height: 100%;
  padding-bottom: 3rem;
}

@media only screen and (min-width: 1600px) {
  .stack-item {
    padding-bottom: 6rem;
  }
}

.mxd-services-stack__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  height: 100%;
  padding: 2.6rem 3rem 0 3rem;
  z-index: 0;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
}

.mxd-services-stack__inner.radius-dark {
  -moz-border-radius: 3.6rem;
  border-radius: 3.6rem;
}

.mxd-services-stack__inner.showcase-inner {
  padding: 2.6rem 3rem 3rem 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__inner {
    padding: 4.2rem 5rem 0 5rem;
  }

  .mxd-services-stack__inner.showcase-inner {
    padding: 4.2rem 5rem 5rem 5rem;
  }

  .mxd-services-stack__inner.radius-dark {
    -moz-border-radius: 4.6rem;
    border-radius: 4.6rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-services-stack__inner {
    padding: 4.2rem 5rem 4.6rem 5rem;
  }

  .mxd-services-stack__inner.justify-end {
    -webkit-box-pack: end;
    -moz-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .mxd-services-stack__inner.justify-between {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.mxd-services-stack__container {
  position: relative;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
}

.mxd-services-stack__controls {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 1;
}

.mxd-services-stack__title {
  margin-bottom: 3.4rem;
  padding-right: 2.6rem;
}

.mxd-services-stack__title.showcase-title {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
  gap: 0;
  width: 100%;
  padding-right: 0;
  margin-bottom: 1.8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__title.showcase-title {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 3rem;
    margin-bottom: 2.2rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-services-stack__title {
    z-index: 1;
  }

  .mxd-services-stack__title.width-60 {
    width: 60%;
    max-width: 580px;
  }

  .mxd-services-stack__title.width-70 {
    width: 70%;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-stack__title h3 {
    font-size: 7rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-services-stack__title.showcase-title {
    margin-bottom: 2.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-stack__title {
    margin-bottom: 4rem;
  }

  .mxd-services-stack__title.width-60 {
    max-width: 800px;
  }

  .mxd-services-stack__title.showcase-title {
    margin-bottom: 3rem;
  }
}

.mxd-services-stack__number {
  font: normal var(--fw-medium) 3.6rem/1.2 var(--_font-accent);
}

.mxd-services-stack__number.t-muted {
  color: var(--t-muted);
}

.mxd-services-stack__number.t-muted-extra {
  color: var(--t-muted-extra);
}

.mxd-services-stack__number.t-opp-brigth {
  color: var(--t-opp-bright);
}

.mxd-services-stack__number.t-opp-muted {
  color: var(--t-opp-muted);
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__number {
    font-size: 5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-stack__number {
    font-size: 7rem;
  }
}

.mxd-services-stack__info {
  z-index: 1;
  margin-bottom: 3.3rem;
}

.mxd-services-stack__info.showcase-info {
  width: 100%;
  margin-bottom: 2.7rem;
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__info {
    width: 80%;
    margin-bottom: 3.3rem;
  }

  .mxd-services-stack__info.showcase-info {
    margin-bottom: 3.4rem;
  }
}

@media only screen and (min-width: 992px) {
  .mxd-services-stack__info.width-60 {
    width: 60%;
    max-width: 470px;
    margin-bottom: 0;
  }

  .mxd-services-stack__info.width-70 {
    width: 70%;
    max-width: 300px;
  }

  .mxd-services-stack__info.showcase-info {
    width: 50%;
    padding-right: 1.5rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-services-stack__info.showcase-info {
    margin-bottom: 4.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-stack__info.width-60 {
    max-width: 610px;
  }

  .mxd-services-stack__info.width-70 {
    max-width: 490px;
  }

  .mxd-services-stack__info.showcase-info {
    margin-bottom: 5rem;
  }
}

.mxd-services-stack__works {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  gap: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__works {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    gap: 3rem;
  }
}

.mxd-services-stack__work {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__work {
    width: -moz-calc(50% - 1.5rem);
    width: calc(50% - 1.5rem);
  }
}

.no-touch .mxd-services-stack__work:hover .mxd-services-stack__preview {
  -webkit-filter: blur(10px);
  filter: blur(10px);
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.no-touch .mxd-services-stack__work:hover .mxd-preview-hover {
  opacity: 1;
  -webkit-filter: blur(0);
  filter: blur(0);
}

.mxd-services-stack__preview {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

.mxd-services-stack__tags {
  display: none;
}

@media only screen and (min-width: 768px) {
  .mxd-services-stack__tags {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 1rem;
  }

  .mxd-services-stack__tags.tags-absolute {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 2.6rem 3rem;
    -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
    -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
    transition: all var(--_animspeed-medium) var(--_animbezier);
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-services-stack__tags.tags-absolute {
    padding: 3.6rem 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-services-stack__tags {
    gap: 1.4rem;
  }
}

.services-stack__image {
  position: relative;
  overflow: hidden;
}

.services-stack__image .service-img-m {
  display: none;
}

@media only screen and (min-width: 992px) {
  .services-stack__image {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    padding-left: 0;
  }

  .services-stack__image .service-img {
    position: absolute;
    right: -15%;
    bottom: 0;
    height: 100%;
    width: auto;
  }

  .services-stack__image .service-img-s {
    display: none;
  }

  .services-stack__image .service-img-m {
    display: block;
  }
}

@media only screen and (min-width: 1200px) {
  .services-stack__image .service-img {
    position: absolute;
    right: 0;
    bottom: -5%;
    max-height: none;
    height: 110%;
    width: auto;
  }
}

.portfolio-stack__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background-color: var(--base);
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center center;
  -moz-background-size: cover;
  background-size: cover;
}

.portfolio-stack__descr {
  display: none;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 2.4rem 3rem;
}

@media only screen and (min-width: 768px) {
  .portfolio-stack__descr {
    display: block;
    width: 60%;
    padding: 2.6rem 3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .portfolio-stack__descr {
    width: 40%;
    padding: 4rem 5rem 4.6rem 5rem;
  }
}

@media only screen and (min-width: 1600px) {
  .portfolio-stack__descr {
    width: 33.3334%;
  }
}

.portfolio-stack__title.dark {
  font-weight: 400;
}

.portfolio-stack__title.light {
  font-weight: 300;
}

.portfolio-stack__text {
  margin-top: 3rem;
  font-weight: 300;
}

.portfolio-stack__text.dark {
  font-weight: 400;
}

@media only screen and (min-width: 1400px) {
  .portfolio-stack__text {
    margin-top: 4rem;
  }
}

/* ------------------------------------------------*/
/* Features - Stack Services #01 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Stack Services #02 Start */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Stack Services #02 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Stack Projects Start */
/* ------------------------------------------------*/
.projects-stack {
  width: 100%;
  position: relative;
  height: 75vh;
  min-height: 600px;
}

@media only screen and (min-width: 992px) {
  .projects-stack {
    height: 600px;
    min-height: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .projects-stack {
    height: 760px;
  }
}

.mxd-projects-stack__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  height: 100%;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  padding: 3rem;
  z-index: 0;
}

.mxd-projects-stack__inner.justify-between {
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.mxd-projects-stack__inner.justify-end {
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-stack__inner {
    padding: 5rem;
  }
}

.mxd-projects-stack__image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.mxd-projects-stack__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-projects-stack__image img.mobile {
  display: block;
}

.mxd-projects-stack__image img.desktop {
  display: none;
}

@media only screen and (min-width: 768px) {
  .mxd-projects-stack__image img.mobile {
    display: none;
  }

  .mxd-projects-stack__image img.desktop {
    display: block;
  }
}

.mxd-projects-stack__title {
  position: relative;
  margin-bottom: 2.4rem;
  max-width: 600px;
}

.mxd-projects-stack__title.no-margin {
  margin-bottom: 0;
}

.mxd-projects-stack__tags {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 1600px) {
  .mxd-projects-stack__tags {
    gap: 1.4rem;
  }
}

/* ------------------------------------------------*/
/* Features - Stack Projects End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Testimonials Style #01 Start */
/* ------------------------------------------------*/
.mxd-testimonials-card {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 4.6rem;
  padding: 3rem;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-card {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 600px;
    max-width: 460px;
    padding: 4rem;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-testimonials-card {
    height: 640px;
    max-width: 500px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-testimonials-card {
    height: 700px;
    max-width: 630px;
  }
}

.mxd-testimonials-card__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4.9rem;
}

.mxd-testimonials-card__media {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-card__media {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -moz-box-orient: horizontal;
    -moz-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.mxd-testimonials-card__photo {
  width: 8rem;
  height: 8rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
}

.mxd-testimonials-card__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-card__photo {
    width: 12rem;
    height: 12rem;
  }
}

.mxd-testimonials-card__company {
  position: relative;
  max-width: 12rem;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-card__company {
    max-width: 18rem;
  }
}

.mxd-testimonials-card__text p {
  margin-bottom: 3.3rem;
}

.mxd-testimonials-photo {
  position: relative;
}

@media only screen and (min-width: 992px) {
  .mxd-testimonials-photo {
    height: 600px;
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-testimonials-photo {
    height: 640px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-testimonials-photo {
    height: 760px;
  }
}

.mxd-testimonials-photo__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
}

@media only screen and (min-width: 992px) {
  .mxd-testimonials-photo__content {
    padding-right: 6rem;
  }
}

.mxd-testimonials-photo__author {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-photo__author {
    gap: 3rem;
  }
}

.mxd-testimonials-photo__avatar {
  width: 8rem;
  height: 8rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
}

.mxd-testimonials-photo__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-photo__avatar {
    width: 12rem;
    height: 12rem;
  }
}

.mxd-testimonials-photo__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.6rem;
  width: -moz-calc(100% - 9.5rem);
  width: calc(100% - 9.5rem);
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-photo__info {
    width: auto;
  }
}

.mxd-testimonials-photo__position {
  line-height: 1.2;
}

.mxd-testimonials-photo__rating {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.8rem;
  margin-top: 0.5rem;
}

.mxd-testimonials-photo__rating i {
  display: block;
  font-size: 1.8rem;
  color: var(--t-bright);
}

@media only screen and (min-width: 1600px) {
  .mxd-testimonials-photo__rating i {
    font-size: 2rem;
  }
}

.mxd-testimonials-photo__image {
  position: relative;
}

@media only screen and (min-width: 992px) {
  .mxd-testimonials-photo__image {
    height: 100%;
  }
}

.mxd-testimonials-photo__image-inner {
  overflow: hidden;
}

.mxd-testimonials-photo__image-inner img {
  min-width: 100%;
  min-height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mxd-testimonials-photo__text {
  margin-bottom: 6rem;
}

.mxd-testimonials-photo__text p {
  margin-bottom: 3rem;
}

@media only screen and (min-width: 992px) {
  .mxd-testimonials-photo__text {
    margin-bottom: 0;
  }
}

.testimonials-slider {
  position: relative;
  height: auto;
  padding: 0 3rem;
}

.testimonials-slider.no-padding {
  padding: 0;
}

@media only screen and (min-width: 768px) {
  .testimonials-slider {
    padding: 0 6rem;
  }
}

@media only screen and (min-width: 1200px) {
  .testimonials-slider {
    padding: 0 1.5rem;
  }
}

@media only screen and (min-width: 1200px) {
  .testimonials-slider__shadow {
    position: absolute;
    top: 0;
    right: 0;
    width: 6rem;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(rgba(var(--base-rgb), 0)), to(rgba(var(--base-rgb), 1)));
    background: -moz-linear-gradient(left, rgba(var(--base-rgb), 0) 0%, rgba(var(--base-rgb), 1) 100%);
    background: linear-gradient(to right, rgba(var(--base-rgb), 0) 0%, rgba(var(--base-rgb), 1) 100%);
    z-index: 1;
  }
}

.swiper-testimonials {
  position: relative;
  height: 100%;
  padding-bottom: 7rem;
}

@media only screen and (min-width: 992px) {
  .swiper-testimonials.no-padding {
    padding-bottom: 0;
  }
}

.swiper-slide {
  width: 100%;
  -webkit-filter: blur(4px);
  filter: blur(4px);
  -webkit-transition: -webkit-filter var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-filter var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: filter var(--_animspeed-slow) var(--_animbezier);
  transition: filter var(--_animspeed-slow) var(--_animbezier);
  transition: filter var(--_animspeed-slow) var(--_animbezier), -webkit-filter var(--_animspeed-slow) var(--_animbezier);
}

.swiper-slide.mxd-fullwidth-slide {
  width: 100%;
}

.swiper-slide.swiper-slide-active {
  -webkit-filter: blur(0);
  filter: blur(0);
}

@media only screen and (min-width: 768px) {
  .swiper-slide {
    width: auto;
  }

  .swiper-slide.mxd-fullwidth-slide {
    width: 100%;
  }
}

.mxd-slider-btn {
  display: block;
  position: absolute;
  top: auto;
  right: auto;
  bottom: 0.2rem;
  left: auto;
  width: auto;
  height: auto;
  margin: 0;
}

.mxd-slider-btn::after {
  display: none;
}

.mxd-slider-btn-round-prev {
  left: 0;
}

.mxd-slider-btn-round-prev.v2 {
  bottom: 0.2rem;
  left: 0.2rem;
}

.mxd-slider-btn-round-next {
  left: 5.4rem;
}

.mxd-slider-btn-round-next.v2 {
  left: auto;
  bottom: 0.2rem;
  right: 0.2rem;
}

.mxd-swiper-pagination-fraction {
  font: normal var(--fw-regular) 1.6rem/1.6 var(--_font-default);
  color: var(--t-bright);
}

.mxd-swiper-pagination-fraction.opposite {
  color: var(--t-opp-bright);
}

.swiper-testimonials__controls {
  position: relative;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -moz-box-orient: horizontal;
  -moz-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 3rem;
  padding: 0 1.5rem;
}

.swiper-testimonials__controls .mxd-slider-btn {
  position: relative;
  bottom: auto;
  width: auto;
  height: auto;
  margin: 0;
}

.swiper-testimonials__controls .mxd-slider-btn-round-prev {
  left: auto;
}

.swiper-testimonials__controls .mxd-slider-btn-round-next {
  left: auto;
}

.swiper-testimonials__controls .mxd-swiper-pagination-fraction {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  left: auto;
  width: auto;
}

@media only screen and (min-width: 992px) {
  .swiper-testimonials__controls {
    position: absolute;
    bottom: 0;
    left: 1.5rem;
    -webkit-box-pack: start;
    -moz-box-pack: start;
    -ms-flex-pack: start;
    justify-content: start;
    padding: 0;
  }
}

/* ------------------------------------------------*/
/* Features - Testimonials Style #01 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Testimonials Style #02 Start */
/* ------------------------------------------------*/
.testimonials-slider-2 {
  position: relative;
  height: auto;
}

.swiper-testimonials-2 {
  position: relative;
  height: 100%;
  padding-bottom: 7rem;
}

@media only screen and (min-width: 1200px) {
  .swiper-testimonials-2.no-padding {
    padding-bottom: 0;
  }
}

.swiper-slide.no-blur {
  -webkit-filter: blur(0);
  filter: blur(0);
}

.mxd-testimonials-image {
  position: relative;
}

.mxd-testimonials-image__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 4rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-testimonials-image__content {
    padding-right: 6rem;
    padding-bottom: 9.6rem;
  }
}

.mxd-testimonials-image__img {
  position: relative;
}

@media only screen and (min-width: 1200px) {
  .mxd-testimonials-image__img {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
}

.mxd-testimonials-image__author {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.5rem;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-image__author {
    gap: 3rem;
  }
}

.mxd-testimonials-image__avatar {
  width: 8rem;
  height: 8rem;
  -moz-border-radius: 50%;
  border-radius: 50%;
  overflow: hidden;
}

.mxd-testimonials-image__avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-image__avatar {
    width: 12rem;
    height: 12rem;
  }
}

.mxd-testimonials-image__info {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 0.6rem;
  width: -moz-calc(100% - 9.5rem);
  width: calc(100% - 9.5rem);
}

@media only screen and (min-width: 768px) {
  .mxd-testimonials-image__info {
    width: auto;
  }
}

.mxd-testimonials-image__position {
  line-height: 1.2;
}

.mxd-testimonials-image__rating {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0.8rem;
  margin-top: 0.5rem;
}

.mxd-testimonials-image__rating i {
  display: block;
  font-size: 1.8rem;
  color: var(--t-bright);
}

.mxd-testimonials-image__rating.opposite i {
  color: var(--t-opp-bright);
}

@media only screen and (min-width: 1600px) {
  .mxd-testimonials-image__rating i {
    font-size: 2rem;
  }
}

.mxd-testimonials-image__text {
  margin-bottom: 6rem;
}

.mxd-testimonials-image__text p {
  margin-bottom: 3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-testimonials-image__text {
    margin-bottom: 0;
  }
}

/* ------------------------------------------------*/
/* Features - Testimonials Style #02 End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Partners Cards Start */
/* ------------------------------------------------*/
.mxd-partners-cards {
  position: relative;
}

.mxd-partners-cards__item {
  position: relative;
  height: 250px;
}

.mxd-partners-cards__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.mxd-partners-cards__inner::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  z-index: -1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
}

.no-touch .mxd-partners-cards__inner:hover::before {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.no-touch .mxd-partners-cards__inner:hover .mxd-partners-cards__logo img {
  opacity: 1;
}

.mxd-partners-cards__logo {
  width: 170px;
  height: auto;
}

.mxd-partners-cards__logo img {
  opacity: 0.6;
  -webkit-transition: opacity var(--_animspeed-slow) ease;
  -moz-transition: opacity var(--_animspeed-slow) ease;
  transition: opacity var(--_animspeed-slow) ease;
}

/* ------------------------------------------------*/
/* Features - Partners Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Tech Stack Cards Start */
/* ------------------------------------------------*/
.mxd-tech-stack-cards {
  position: relative;
}

.mxd-tech-stack-cards.grid-cards {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-tech-stack-cards.grid-cards {
    -ms-grid-columns: (1fr)[3];
    grid-template-columns: repeat(3, 1fr);
  }
}

@media only screen and (min-width: 1400px) {
  .mxd-tech-stack-cards.grid-cards {
    -ms-grid-columns: (1fr)[4];
    grid-template-columns: repeat(4, 1fr);
  }
}

.mxd-tech-stack-cards__item {
  position: relative;
}

.mxd-tech-stack-cards__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 2.6rem;
  width: 100%;
  height: 100%;
  padding: 3rem;
}

.mxd-tech-stack-cards__inner::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  z-index: -1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
}

.no-touch .mxd-tech-stack-cards__inner:hover::before {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.mxd-tech-stack-cards__inner-v2 {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  height: 100%;
  padding: 3rem 1rem;
}

.mxd-tech-stack-cards__inner-v2::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  z-index: -1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow) var(--_animbezier);
}

.no-touch .mxd-tech-stack-cards__inner-v2:hover::before {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

@media only screen and (min-width: 768px) {
  .mxd-tech-stack-cards__inner-v2 {
    gap: 2.2rem;
    padding: 4rem 1rem;
  }
}

.mxd-tech-stack-cards__inner-v3 {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  height: 100%;
  padding: 3rem 4rem;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

@media only screen and (min-width: 768px) {
  .mxd-tech-stack-cards__inner-v3 {
    gap: 2.2rem;
    padding: 4rem 6rem;
  }
}

.mxd-tech-stack-cards__logo {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 8rem;
  height: 8rem;
  -moz-border-radius: var(--_radius-pt-m);
  border-radius: var(--_radius-pt-m);
  background-color: var(--accent);
  color: var(--t-opp-bright);
}

.mxd-tech-stack-cards__logo svg,
.mxd-tech-stack-cards__logo img {
  display: block;
  width: 4.4rem;
  height: auto;
}

.mxd-tech-stack-cards__logo svg {
  fill: currentColor;
}

.mxd-tech-stack-cards__icon {
  position: relative;
  height: 7rem;
}

.mxd-tech-stack-cards__icon img {
  width: auto;
  height: 100%;
}

@media only screen and (min-width: 768px) {
  .mxd-tech-stack-cards__icon {
    height: 9rem;
  }
}

/* ------------------------------------------------*/
/* Features - Tech Stack Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Blog Preview Start */
/* ------------------------------------------------*/
.mxd-blog-preview {
  position: relative;
}

.mxd-blog-preview__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 3.2rem;
}

.mxd-blog-preview__item:last-of-type {
  padding-bottom: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-blog-preview__item {
    padding-bottom: 4.2rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-blog-preview__item {
    padding-bottom: 0;
  }
}

.mxd-blog-preview__media {
  display: block;
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  margin-bottom: 1.5rem;
  overflow: hidden;
}

.no-touch .mxd-blog-preview__media:hover .mxd-preview-hover {
  opacity: 1;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

@media only screen and (min-width: 768px) {
  .mxd-blog-preview__media {
    height: 600px;
    margin-bottom: 2.4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-blog-preview__media {
    height: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-blog-preview__media {
    height: 600px;
  }
}

.mxd-blog-preview__image {
  position: relative;
  width: 100%;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  overflow: hidden;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

.mxd-blog-preview__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-blog-preview__image {
    height: 600px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-blog-preview__image {
    height: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-blog-preview__image {
    height: 600px;
  }
}

.mxd-blog-preview__tags {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 2.6rem 3rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
  -webkit-transition: all var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: all var(--_animspeed-medium) var(--_animbezier);
  transition: all var(--_animspeed-medium) var(--_animbezier);
}

@media only screen and (min-width: 768px) {
  .mxd-blog-preview__tags {
    padding: 3.6rem 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-blog-preview__tags {
    gap: 1.4rem;
  }
}

.mxd-blog-preview__data {
  padding: 0 3rem;
}

.mxd-blog-preview__data a {
  display: inline;
  font: normal var(--fw-regular) 2.2rem/1.2 var(--_font-accent);
  line-height: 1.2;
  color: var(--t-medium);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .mxd-blog-preview__data a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

.mxd-blog-preview__data a span {
  font-weight: var(--fw-medium);
  line-height: 1.2;
  color: var(--t-bright);
}

.mxd-blog-preview__data p {
  font: normal var(--fw-regular) 2.2rem/1.2 var(--_font-accent);
}

@media only screen and (min-width: 768px) {
  .mxd-blog-preview__data {
    padding: 0 4rem;
  }
}

@media only screen and (min-width: 1600px) {

  .mxd-blog-preview__data p,
  .mxd-blog-preview__data a {
    font-size: 3rem;
  }
}

/* ------------------------------------------------*/
/* Features - Blog Preview End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Accordion Start */
/* ------------------------------------------------*/
.mxd-accordion {
  position: relative;
}

@media only screen and (min-width: 1200px) and (hover) and (prefers-reduced-motion: no-preference) {
  .mxd-accordion>.mxd-accordion__item {
    -webkit-transition: opacity 0.3s ease;
    -moz-transition: opacity 0.3s ease;
    transition: opacity 0.3s ease;
  }

  .mxd-accordion:hover>.mxd-accordion__item:not(:hover) {
    opacity: 0.2;
  }
}

.mxd-accordion__item {
  position: relative;
  cursor: pointer;
  margin-top: -2px;
}

.mxd-accordion__item:first-of-type {
  margin-top: 0;
}

.mxd-accordion__divider {
  position: relative;
  width: 100%;
  height: 2px;
  background-color: var(--st-bright);
}

.mxd-accordion__content {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0 0 3.6rem 0;
  overflow: hidden;
  display: none;
}

@media only screen and (min-width: 1200px) {
  .mxd-accordion__content {
    padding: 0 0 3.4rem 0;
  }
}

.mxd-accordion__title {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -moz-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 3rem 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-accordion__title {
    padding: 3rem 0 3.4rem 0;
  }
}

.mxd-accordion__arrow {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 2.2rem;
  line-height: 1.2;
  color: var(--t-bright);
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg);
  will-change: transform;
  -webkit-transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-medium) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier);
  transition: transform var(--_animspeed-medium) var(--_animbezier), -webkit-transform var(--_animspeed-medium) var(--_animbezier), -moz-transform var(--_animspeed-medium) var(--_animbezier);
}

@media only screen and (min-width: 1200px) {
  .mxd-accordion__arrow {
    font-size: 3rem;
  }
}

.accordion-rotate {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  transform: rotate(135deg);
}

/* ------------------------------------------------*/
/* Features - Accordion End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Pricing Cards Start */
/* ------------------------------------------------*/
.mxd-pricing-table {
  position: relative;
}

.mxd-pricing-table__item {
  position: relative;
}

.mxd-pricing-table__inner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
  width: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  padding: 3rem;
  -webkit-transition: -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: box-shadow var(--_animspeed-slow) var(--_animbezier), -moz-box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: box-shadow var(--_animspeed-slow) var(--_animbezier), -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier), -moz-box-shadow var(--_animspeed-slow) var(--_animbezier);
}

.no-touch .mxd-pricing-table__inner:hover {
  -webkit-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  -moz-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
}

@media only screen and (min-width: 1200px) {
  .mxd-pricing-table__inner {
    height: 100%;
    padding: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pricing-table__inner {
    padding: 5rem;
  }
}

.mxd-pricing-table__tag {
  position: absolute;
  top: -1.6rem;
  left: 3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-pricing-table__tag {
    left: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-pricing-table__tag {
    left: 5rem;
  }
}

.mxd-pricing-table__data {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-flex: 1;
  flex: 1;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-pricing-table__data {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

.pricing-data__header {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.pricing-header__title {
  margin-bottom: 1rem;
}

.pricing-header__descr {
  font-size: 1.8rem;
}

@media only screen and (min-width: 1600px) {
  .pricing-header__descr {
    font-size: 1.8rem;
  }
}

.pricing-data__info {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 3rem;
}

.pricing-data__price {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.6rem;
  margin-bottom: 1.2rem;
}

.pricing-data__num {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: flex-end;
  gap: 0.4rem;
}

.pricing-data__currency,
.pricing-data__period {
  font: normal var(--fw-regular) 1.8rem/1.6 var(--_font-accent);
  color: var(--t-muted);
}

@media only screen and (min-width: 1600px) {

  .pricing-data__currency,
  .pricing-data__period {
    font-size: 2.2rem;
  }
}

.pricing-data__amount {
  font: normal var(--fw-semibold) 7.4rem/0.9 var(--_font-accent);
  letter-spacing: -0.2rem;
  color: var(--t-bright);
}

.pricing-data__btnholder {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
  margin-bottom: 1.8rem;
}

.pricing-data__divider {
  width: 100%;
  height: 0.2rem;
  -moz-border-radius: 0.2rem;
  border-radius: 0.2rem;
  background-color: var(--base-opp);
}

.mxd-pricing-table__plan {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 0.4rem;
  width: 100%;
  margin-top: 0.7rem;
}

.pricing-plan__caption {
  font-size: 1.8rem;
}

@media only screen and (min-width: 1600px) {
  .pricing-plan__caption {
    font-size: 1.8rem;
  }
}

.mxd-pricing-table__link {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1rem;
  width: 100%;
}

.mxd-pricing-table__link a {
  font: normal var(--fw-regular) 1.8rem/1.2 var(--_font-accent);
  color: var(--t-bright);
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright))), -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0)));
  background: -moz-linear-gradient(left, var(--t-bright), var(--t-bright)), -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  background: linear-gradient(to right, var(--t-bright), var(--t-bright)), linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 400ms, color 300ms;
  -moz-transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
  transition: background-size 400ms, color 300ms;
  transition: background-size 400ms, color 300ms, -moz-background-size 400ms;
}

.no-touch .mxd-pricing-table__link a:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

/* ------------------------------------------------*/
/* Features - Pricing Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Team Cards Start */
/* ------------------------------------------------*/
.mxd-team-cards {
  position: relative;
}

.mxd-team-cards__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-bottom: 3.5rem;
}

.mxd-team-cards__item:last-of-type {
  padding-bottom: 0;
}

.mxd-team-cards__item:last-of-type.padding-bottom-mobile {
  padding-bottom: 3.5rem;
}

.mxd-team-cards__item.no-padding-bottom {
  padding-bottom: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-team-cards__item {
    padding-bottom: 0;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-team-cards__item {
    padding-bottom: 0;
  }

  .mxd-team-cards__item:last-of-type {
    padding-bottom: 0;
  }

  .mxd-team-cards__item:last-of-type.padding-bottom-mobile {
    padding-bottom: 0;
  }

  .mxd-team-cards__item.padding-bottom-desktop {
    padding-bottom: 3.5rem;
  }
}

.mxd-team-cards__h2-block {
  position: relative;
}

.mxd-team-cards__h2-block.right-block {
  padding-left: 0;
}

.mxd-team-cards__h2-block.left-block {
  padding-right: 0;
}

@media only screen and (min-width: 1200px) {
  .mxd-team-cards__h2-block.right-block {
    padding-left: 3rem;
  }

  .mxd-team-cards__h2-block.left-block {
    padding-right: 3rem;
  }
}

.mxd-team-cards__media {
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  margin-bottom: 1.7rem;
  overflow: hidden;
}

.mxd-team-cards__media.no-margin {
  margin-bottom: 0;
}

.mxd-team-cards__media.overflow-visible {
  overflow: visible;
}

@media only screen and (min-width: 768px) {
  .mxd-team-cards__media {
    height: 460px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-team-cards__media {
    height: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-team-cards__media {
    height: 600px;
  }
}

.mxd-team-cards__career {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

.mxd-team-cards__career::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base-tint);
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
  z-index: -1;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: -webkit-transform var(--_animspeed-slow), -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: -webkit-transform var(--_animspeed-slow), -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier);
  -moz-transition: transform var(--_animspeed-slow), box-shadow var(--_animspeed-slow) var(--_animbezier), -moz-transform var(--_animspeed-slow), -moz-box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow), box-shadow var(--_animspeed-slow) var(--_animbezier);
  transition: transform var(--_animspeed-slow), box-shadow var(--_animspeed-slow) var(--_animbezier), -webkit-transform var(--_animspeed-slow), -moz-transform var(--_animspeed-slow), -webkit-box-shadow var(--_animspeed-slow) var(--_animbezier), -moz-box-shadow var(--_animspeed-slow) var(--_animbezier);
}

.no-touch .mxd-team-cards__career:hover::before {
  -webkit-transform: scale(1.04);
  -moz-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
  -webkit-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  -moz-box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
  box-shadow: 0 14px 28px rgba(var(--accent-rgb), 0.25), 0 10px 10px rgba(var(--accent-rgb), 0.12);
}

.career__image {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  width: 256px;
  height: auto;
  padding-bottom: 4rem;
}

.career__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 1.6rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  text-align: center;
}

@media only screen and (min-width: 768px) {
  .career__caption {
    padding: 2.6rem;
  }
}

.mxd-team-cards__photo {
  position: relative;
  width: 100%;
  height: 460px;
  overflow: hidden;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: end;
  -moz-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

.mxd-team-cards__photo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-team-cards__photo {
    height: 460px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-team-cards__photo {
    height: 460px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-team-cards__photo {
    height: 600px;
  }
}

.mxd-team-cards__socials {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 1.6rem;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 1rem;
}

@media only screen and (min-width: 768px) {
  .mxd-team-cards__socials {
    padding: 2.6rem;
  }
}

.mxd-team-cards__info {
  padding: 0 1.6rem;
}

@media only screen and (min-width: 768px) {
  .mxd-team-cards__info {
    padding: 0 2.6rem;
  }
}

/* ------------------------------------------------*/
/* Features - Team Cards End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Values Start */
/* ------------------------------------------------*/
.mxd-values {
  position: relative;
}

.mxd-values__item {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-values__item.mobile-reverse {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
  -moz-box-orient: vertical;
  -moz-box-direction: reverse;
  -ms-flex-direction: column-reverse;
  flex-direction: column-reverse;
}

@media only screen and (min-width: 1200px) {
  .mxd-values__item.mobile-reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

.mxd-values__lists {
  padding: 6rem 3rem 0 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-values__lists {
    padding: 6.4rem 4rem 0 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-values__lists {
    padding: 0;
  }
}

.mxd-values__lists-item {
  margin-bottom: 2.6rem;
}

.mxd-values__lists-item:last-of-type {
  margin-bottom: 0;
}

@media only screen and (min-width: 576px) {
  .mxd-values__lists-item {
    margin-bottom: 0;
  }
}

.mxd-values__image {
  position: relative;
  height: 460px;
  -moz-border-radius: var(--_radius-l);
  border-radius: var(--_radius-l);
  background-repeat: no-repeat;
  background-position: center;
  -moz-background-size: cover;
  background-size: cover;
}

@media only screen and (min-width: 768px) {
  .mxd-values__image {
    height: 600px;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-values__image.image-large-desktop {
    height: 930px;
  }
}

.mxd-values__descr {
  padding: 5.4rem 3rem 5.9rem 3rem;
}

.mxd-values__descr.has-top-list {
  padding: 4.6rem 3rem 5.9rem 3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-values__descr {
    padding: 6.4rem 4rem 6.9rem 4rem;
  }

  .mxd-values__descr.has-top-list {
    padding: 5.5rem 4rem 6.9rem 4rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-values__descr {
    padding: 6.4rem 4rem 0 4rem;
  }

  .mxd-values__descr.has-top-list {
    padding: 6.4rem 4rem 0 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-values__descr {
    padding: 6rem 4rem 0 4rem;
  }

  .mxd-values__descr.has-top-list {
    padding: 6rem 4rem 0 4rem;
  }
}

/* ------------------------------------------------*/
/* Features - Values End */
/* ------------------------------------------------*/
/* ------------------------------------------------*/
/* Features - Project Details Start */
/* ------------------------------------------------*/
.mxd-project {
  position: relative;
  width: 100%;
  min-width: 360px;
}

.mxd-project__block {
  position: relative;
  margin-top: 12.3rem;
  margin-bottom: 13.1rem;
}

.mxd-project__block.pre-grid {
  margin-bottom: 10.1rem;
}

.mxd-project__block.no-margin {
  margin: 0;
}

@media only screen and (min-width: 768px) {
  .mxd-project__block {
    margin-top: 13.1rem;
    margin-bottom: 15.1rem;
  }

  .mxd-project__block.pre-grid {
    margin-bottom: 12.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-project__block {
    margin-top: 14.3rem;
    margin-bottom: 15.1rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project__block {
    margin-top: 18.3rem;
    margin-bottom: 19rem;
  }

  .mxd-project__block.pre-grid {
    margin-bottom: 16.1rem;
  }
}

.mxd-project__subtitle {
  position: relative;
}

.mxd-project__paragraph {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  gap: 2rem;
  margin-top: 1.8rem;
}

@media only screen and (min-width: 768px) {
  .mxd-project__paragraph {
    margin-top: 1.3rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-project__paragraph {
    margin-top: 0.4rem;
    gap: 3rem;
  }

  .mxd-project__paragraph.medium-text {
    margin-top: 0.8rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project__paragraph {
    max-width: 855px;
  }

  .mxd-project__paragraph.medium-text {
    margin-top: 0.6rem;
  }
}

.mxd-project__controls {
  margin-top: 1.3rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-project__controls {
    margin-top: 1.4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project__controls {
    margin-top: 1.7rem;
  }
}

.mxd-project__client {
  margin-top: 0.2rem;
}

@media only screen and (min-width: 1200px) {
  .mxd-project__client {
    margin-top: 0;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project__client {
    margin-top: 0.2rem;
  }
}

.mxd-project-cards {
  position: relative;
}

.mxd-project-cards__item {
  position: relative;
  height: auto;
  min-height: 320px;
  aspect-ratio: 16 / 9;
}

@media only screen and (min-width: 768px) {
  .mxd-project-cards__item {
    min-height: 350px;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project-cards__item {
    min-height: 450px;
  }
}

.mxd-project-cards__inner {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  -moz-border-radius: var(--_radius-m);
  border-radius: var(--_radius-m);
}

.mxd-project-cards__inner img,
.mxd-project-cards__inner video {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -moz-border-radius: inherit;
  border-radius: inherit;
}

.mxd-project__nav {
  position: relative;
  padding-top: 3rem;
  padding-bottom: 13.3rem;
}

@media only screen and (min-width: 768px) {
  .mxd-project__nav {
    padding-bottom: 15.1rem;
  }
}

@media only screen and (min-width: 1200px) {
  .mxd-project__nav {
    padding-top: 4rem;
  }
}

@media only screen and (min-width: 1600px) {
  .mxd-project__nav {
    padding-bottom: 19.1rem;
  }
}

.mxd-project__divider {
  position: absolute;
  top: 0;
  left: 1.5rem;
  width: -moz-calc(100% - 3rem);
  width: calc(100% - 3rem);
  height: 0.2rem;
  background-color: var(--base-opp);
}

.mxd-project__navitem {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-orient: vertical;
  -moz-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.mxd-project__navitem.left {
  -webkit-box-align: start;
  -moz-box-align: start;
  -ms-flex-align: start;
  align-items: start;
}

.mxd-project__navitem.right {
  -webkit-box-align: end;
  -moz-box-align: end;
  -ms-flex-align: end;
  align-items: end;
  text-align: right;
}

.mxd-project__link {
  font: normal var(--fw-medium) 2.2rem/1.2 var(--_font-accent);
  color: var(--t-bright);
}

.mxd-project__link.opposite {
  color: var(--t-opp-bright);
}

.mxd-project__link span {
  text-decoration: none;
  background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0))), -webkit-gradient(linear, left top, right top, from(var(--t-bright)), to(var(--t-bright)));
  background: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), -moz-linear-gradient(left, var(--t-bright), var(--t-bright));
  background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), linear-gradient(to right, var(--t-bright), var(--t-bright));
  -moz-background-size: 100% 1px, 0 1px;
  background-size: 100% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  -webkit-transition: background-size 300ms, color 300ms;
  -moz-transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
  transition: background-size 300ms, color 300ms;
  transition: background-size 300ms, color 300ms, -moz-background-size 300ms;
}

.no-touch .mxd-project__link span:hover {
  color: var(--t-bright);
  -moz-background-size: 0 1px, 100% 1px;
  background-size: 0 1px, 100% 1px;
}

@media only screen and (min-width: 768px) {
  .mxd-project__link {
    font-size: 3.4rem;
  }
}

/* ------------------------------------------------*/
/* Features - Project Details End */
/* ------------------------------------------------*/
/* ============================================ */
/* Video Lazy Loading Skeleton Styles           */
/* ============================================ */
.video-skeleton-loading,
.lazy-video:not(.is-loaded) {
  position: relative;
  overflow: hidden;
  background: #1e1e1e;
  /* Dark fallback */
  min-height: 200px;
}

.video-skeleton-loading::before,
.lazy-video:not(.is-loaded)::before {
  content: "";
  position: absolute;
  top: 0;
  left: -150%;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg,
      transparent 25%,
      rgba(255, 255, 255, 0.08) 50%,
      transparent 75%);
  animation: skeleton-shimmer 2s infinite cubic-bezier(0.4, 0.0, 0.2, 1);
  z-index: 10;
  pointer-events: none;
}

.lazy-video {
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
}

.lazy-video.is-loaded {
  opacity: 1;
}

@keyframes skeleton-shimmer {
  0% {
    left: -50%;
  }

  100% {
    left: 150%;
  }
}

/* ------------------------------------------------*/
/* Hover Play Video Custom Integration Start */
/* ------------------------------------------------*/
.hover-play-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: var(--base-shade);
}

.hover-play-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  transition: opacity var(--_animspeed-slow) var(--_animbezier), transform var(--_animspeed-slow) var(--_animbezier);
}

.hover-play-wrapper video.hover-play-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 2;
  opacity: 0;
  transform: scale(1.05);
  transition: opacity var(--_animspeed-slow) var(--_animbezier), transform var(--_animspeed-slow) var(--_animbezier);
  pointer-events: none;
  /* Let the wrapper handle the hover event */
}

.hover-play-wrapper:hover img {
  opacity: 0;
  transform: scale(0.95);
}

.hover-play-wrapper:hover video.hover-play-video {
  opacity: 1;
  transform: scale(1);
}

/* Recent Work (pinned projects): show full poster, no crop.
   Posters here aren't all 16:9, so contain keeps text/faces intact;
   the wrapper background fills the letterbox area. */
.mxd-pinned-projects .hover-play-wrapper img,
.mxd-pinned-projects .hover-play-wrapper video.hover-play-video {
  object-fit: contain;
}

/* ------------------------------------------------*/
/* Hover Play Video Custom Integration End */

/* ------------------------------------------------*/
/* Premium Case Study Enhancements Start */
/* ------------------------------------------------*/
.ie-case-hero-video,
.ie-case-feature-video {
  position: relative;
  width: 100%;
  overflow: hidden;
  background-color: var(--base-shade);
}

.ie-case-hero-video {
  aspect-ratio: 16 / 9;
  min-height: 320px;
}

.ie-case-feature-video {
  height: 100%;
  min-height: 320px;
}

.ie-case-hero-video video,
.ie-case-feature-video video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ie-case-kicker {
  margin-bottom: 1.8rem;
  font: normal var(--fw-medium) 1.2rem/1.2 var(--_font-default);
  text-transform: uppercase;
  letter-spacing: 0.16rem;
  color: var(--t-muted);
}

.ie-case-stat-grid,
.ie-case-language-grid,
.ie-case-proof-grid {
  display: grid;
  gap: clamp(1.8rem, 1.6vw, 2.6rem);
}

.ie-case-stat-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ie-case-language-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ie-case-proof-grid {
  grid-template-columns: 1fr;
}

/* --- Premium cards: stats / languages / proof --- */
.ie-case-stat,
.ie-case-language,
.ie-case-proof {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 160px;
  padding: 3rem 2.8rem;
  border: 1px solid var(--st-muted);
  border-radius: var(--_radius-m);
  background:
    radial-gradient(120% 130% at 0% 0%, rgba(var(--accent-rgb), 0.05) 0%, transparent 45%),
    linear-gradient(165deg, var(--base-tint) 0%, var(--base-shade) 135%);
  overflow: hidden;
  isolation: isolate;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05),
              0 22px 48px -34px rgba(0, 0, 0, 0.6);
  transition: transform 0.55s var(--_animbezier),
              border-color 0.55s var(--_animbezier),
              box-shadow 0.55s var(--_animbezier);
}

/* soft accent hairline across the top edge */
.ie-case-stat::before,
.ie-case-language::before,
.ie-case-proof::before {
  content: "";
  position: absolute;
  top: 0;
  left: 2.8rem;
  right: 2.8rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb), 0.45), transparent);
  opacity: 0.55;
  transition: opacity 0.55s var(--_animbezier);
  z-index: 2;
}

/* warm accent wash that lifts in on hover */
.ie-case-stat::after,
.ie-case-language::after,
.ie-case-proof::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(95% 120% at 100% 0%, rgba(var(--accent-rgb), 0.16), transparent 55%);
  opacity: 0;
  transition: opacity 0.55s var(--_animbezier);
  z-index: -1;
}

.ie-case-stat:hover,
.ie-case-language:hover,
.ie-case-proof:hover {
  transform: translateY(-6px);
  border-color: rgba(var(--accent-rgb), 0.55);
  box-shadow: 0 30px 60px -34px rgba(0, 0, 0, 0.65);
}

.ie-case-stat:hover::before,
.ie-case-language:hover::before,
.ie-case-proof:hover::before { opacity: 1; }

.ie-case-stat:hover::after,
.ie-case-language:hover::after,
.ie-case-proof:hover::after { opacity: 1; }

.ie-case-stat span,
.ie-case-language span,
.ie-case-proof span {
  color: var(--t-muted);
  line-height: 1.5;
}

/* --- Stat cards — luxe pass --- */
.ie-case-stat {
  justify-content: space-between;
  min-height: clamp(200px, 19vw, 240px);
  padding: clamp(2.6rem, 2.4vw, 3.4rem);
}

.ie-case-stat:hover {
  box-shadow: 0 36px 72px -38px rgba(0, 0, 0, 0.72),
              0 0 0 1px rgba(var(--accent-rgb), 0.14);
}

/* hero number with gradient fill + an accent underline that extends on hover */
.ie-case-stat strong {
  position: relative;
  display: inline-block;
  margin-bottom: clamp(1.8rem, 2vw, 2.6rem);
  padding-bottom: 1.4rem;
  font: normal var(--fw-medium) clamp(4.6rem, 5.4vw, 6rem)/0.85 var(--_font-accent);
  letter-spacing: -0.03em;
  color: var(--t-bright);
  background: linear-gradient(172deg, var(--t-bright) 18%, color-mix(in srgb, var(--t-bright) 58%, var(--accent)) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.ie-case-stat strong::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 3.2rem;
  height: 3px;
  border-radius: 3px;
  background: var(--accent);
  transition: width 0.55s var(--_animbezier);
}

.ie-case-stat:hover strong::after { width: 5.2rem; }

.ie-case-stat span {
  max-width: 24ch;
  font-size: 1.5rem;
}

/* --- Language cards — luxe redesign --- */
.ie-case-language-grid { counter-reset: lang; }

.ie-case-language {
  counter-increment: lang;
  justify-content: space-between;
  min-height: clamp(210px, 20vw, 252px);
  padding: clamp(2.6rem, 2.4vw, 3.4rem);
  background:
    radial-gradient(150% 130% at 100% -12%, rgba(var(--accent-rgb), 0.12) 0%, transparent 52%),
    linear-gradient(158deg, var(--base-tint) 0%, var(--base-shade) 150%);
}

.ie-case-language:hover {
  box-shadow: 0 36px 72px -38px rgba(0, 0, 0, 0.72),
              0 0 0 1px rgba(var(--accent-rgb), 0.14);
}

/* signature index numeral, top-right — replaces the shared top hairline */
.ie-case-language::before {
  content: counter(lang, decimal-leading-zero);
  top: clamp(2.2rem, 2.2vw, 3rem);
  right: clamp(2.4rem, 2.2vw, 3.4rem);
  left: auto;
  width: auto;
  height: auto;
  font: normal var(--fw-medium) 1.5rem/1 var(--_font-accent);
  letter-spacing: 0.06em;
  color: rgba(var(--accent-rgb), 0.55);
  background: none;
  opacity: 1;
  transition: color 0.55s var(--_animbezier), transform 0.55s var(--_animbezier);
}

.ie-case-language:hover::before {
  color: var(--accent);
  transform: translateY(-2px);
}

/* English overline */
.ie-case-language em {
  display: block;
  margin-bottom: clamp(1.2rem, 1.4vw, 1.8rem);
  font-style: normal;
  font-size: 1.15rem;
  letter-spacing: 0.22rem;
  text-transform: uppercase;
  color: var(--t-muted);
}

/* native-script hero glyph with a soft gradient fill */
.ie-case-language strong {
  display: block;
  margin: 0 0 auto;
  padding-bottom: 0.4rem;
  font: normal var(--fw-medium) clamp(3rem, 4.2vw, 4.4rem)/1.15 var(--_font-accent);
  letter-spacing: -0.01em;
  color: var(--t-bright);
  background: linear-gradient(176deg, var(--t-bright) 14%, color-mix(in srgb, var(--t-bright) 62%, var(--accent)) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: transform 0.55s var(--_animbezier);
}

.ie-case-language:hover strong { transform: translateY(-3px); }

/* descriptor with a live-pulse dot and a hairline that extends on hover */
.ie-case-language span {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  margin-top: clamp(1.6rem, 1.8vw, 2.2rem);
  padding-top: clamp(1.6rem, 1.8vw, 2.2rem);
  font-size: 1.4rem;
  color: var(--t-muted);
}

.ie-case-language span::before {
  content: "";
  position: static;
  flex: none;
  width: 0.7rem;
  height: 0.7rem;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.55);
  animation: ie-lang-pulse 2.8s ease-out infinite;
}

.ie-case-language span::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 2.8rem;
  height: 2px;
  border-radius: 2px;
  background: var(--accent);
  transition: width 0.55s var(--_animbezier);
}

.ie-case-language:hover span::after { width: 4.6rem; }

@keyframes ie-lang-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0.5); }
  70%  { box-shadow: 0 0 0 0.7rem rgba(var(--accent-rgb), 0); }
  100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0); }
}

@media (prefers-reduced-motion: reduce) {
  .ie-case-language span::before { animation: none; }
}

/* Proof card */
.ie-case-proof strong {
  display: block;
  margin-bottom: 1.1rem;
  font: normal var(--fw-medium) 2rem/1.25 var(--_font-default);
  color: var(--t-bright);
}

/* --- Reel cards --- */
.ie-case-reel-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.8rem, 1.6vw, 2.6rem);
}

.ie-case-reel-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--st-muted);
  border-radius: var(--_radius-m);
  background: linear-gradient(165deg, var(--base-tint), var(--base-shade));
  transition: transform 0.55s var(--_animbezier),
              border-color 0.55s var(--_animbezier),
              box-shadow 0.55s var(--_animbezier);
}

.ie-case-reel-card:hover {
  transform: translateY(-6px);
  border-color: rgba(var(--accent-rgb), 0.5);
  box-shadow: 0 30px 60px -34px rgba(0, 0, 0, 0.65);
}

.ie-case-reel-card video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-top-left-radius: var(--_radius-m);
  border-top-right-radius: var(--_radius-m);
}

.ie-case-reel-card__caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.6rem;
  padding: 1.9rem 2.2rem;
  color: var(--t-muted);
}

.ie-case-reel-card__caption strong {
  color: var(--t-bright);
  font-weight: var(--fw-medium);
}

/* --- Reel mini-player controls --- */
.ie-reel-stage {
  position: relative;
  overflow: hidden;
  border-top-left-radius: var(--_radius-m);
  border-top-right-radius: var(--_radius-m);
  background: var(--base-shade);
  cursor: pointer;
}

.ie-reel-stage video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.ie-reel-big {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 6.4rem;
  height: 6.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.45);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  color: #fff;
  font-size: 2.4rem;
  cursor: pointer;
  opacity: 0;
  transform: scale(0.8);
  pointer-events: none;
  transition: opacity 0.4s var(--_animbezier), transform 0.4s var(--_animbezier), background 0.3s;
  z-index: 3;
}

.ie-reel-stage.is-paused .ie-reel-big {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

.ie-reel-big:hover {
  background: var(--accent);
  color: var(--base-shade);
}

.ie-reel-bar {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: 1.2rem;
  padding: 1.4rem 1.6rem 1.5rem;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.62), rgba(0, 0, 0, 0.15) 60%, transparent);
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.4s var(--_animbezier), transform 0.4s var(--_animbezier);
  z-index: 4;
}

.ie-reel-stage:hover .ie-reel-bar,
.ie-reel-stage.is-paused .ie-reel-bar,
.ie-reel-stage.is-seeking .ie-reel-bar {
  opacity: 1;
  transform: none;
}

.ie-reel-btn {
  flex: 0 0 auto;
  width: 3.4rem;
  height: 3.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 1.6rem;
  cursor: pointer;
  transition: background 0.3s, color 0.3s, transform 0.3s;
}

.ie-reel-btn:hover {
  background: #fff;
  color: var(--base-shade);
  transform: translateY(-1px);
}

.ie-reel-btn.is-on {
  background: var(--accent);
  color: var(--base-shade);
}

.ie-reel-seek {
  position: relative;
  flex: 1 1 auto;
  height: 1.8rem;
  display: flex;
  align-items: center;
  cursor: pointer;
}

.ie-reel-seek::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 3px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.28);
}

.ie-reel-seek__fill {
  position: relative;
  height: 3px;
  width: 0;
  border-radius: 3px;
  background: var(--accent);
}

.ie-reel-seek__fill::after {
  content: "";
  position: absolute;
  right: -5px;
  top: 50%;
  transform: translateY(-50%);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--accent);
  opacity: 0;
  transition: opacity 0.3s;
}

.ie-reel-stage:hover .ie-reel-seek__fill::after,
.ie-reel-stage.is-seeking .ie-reel-seek__fill::after {
  opacity: 1;
}

/* touch devices: keep the bar visible since there's no hover */
@media (hover: none) {
  .ie-reel-bar {
    opacity: 1;
    transform: none;
  }
}

/* Section eyebrow + heading for the premium case sections */
.ie-case-head {
  margin-bottom: clamp(2.4rem, 4vw, 4rem);
}

.ie-case-head h2 {
  margin: 0;
}

.ie-case-lead {
  margin: 1.8rem 0 0;
  max-width: 64rem;
  color: var(--t-muted);
  line-height: 1.6;
}

.ie-case-lead strong {
  color: var(--t-bright);
  font-weight: var(--fw-medium);
}

/* "More Projects" related grid with hover-play previews */
.ie-related-grid {
  display: grid;
  gap: clamp(1.8rem, 1.6vw, 2.6rem);
  grid-template-columns: 1fr;
}

.ie-related-media {
  position: relative;
  aspect-ratio: 16 / 10;
  border-radius: var(--_radius-m);
  overflow: hidden;
}

.ie-related-item .mxd-project-item__name {
  margin-top: 1.6rem;
}

@media only screen and (min-width: 768px) {
  .ie-case-proof-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .ie-case-reel-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ie-related-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media only screen and (min-width: 1200px) {
  .ie-case-language-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .ie-case-stat-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .ie-case-hero-video {
    min-height: 520px;
  }
}
/* ------------------------------------------------*/
/* Premium Case Study Enhancements End */
/* ------------------------------------------------*/