@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-ExtraLightItalic.ttf") format("truetype");
  font-weight: 200;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-ExtraBoldItalic.ttf") format("truetype");
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: "Montserrat";
  src: url("/content/websites/assets/fonts/Montserrat/Montserrat-BlackItalic.ttf") format("truetype");
  font-weight: 900;
  font-style: italic;
}

@font-face {
  font-family: "Black Signature";
  src: url("/content/websites/assets/fonts/BlackSignature/BlackSignature.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
}

/*------------------------color_variables-------------------------------*/
:root {
  --color-1: #02ff02;
  --color-2: #000000;
  --color-3: #ffffff;
  --color-4: #000000;
  --color-5: #ffffff;
  --color-6: #ffffff;
  --color-7: #ffffff;
  --color-8: #ffffff;
  --color-9: #000000;
  --color-10: #ffffff;
  --color-11: #000000;
  --color-12: #ffffff;
  /* WhatsApp */
  --color-13: #58BA47;
  /* WhatsApp Headline Text */
  --color-14: #000000;
  /* Info Bar Text */
  --color-15: #ffffff;
  /* Services Text */
  --color-16: #ffffff;
  /* Banner Text */
  --color-17: #ffffff;
  /* Hero Headline */
  --color-18: #ffffff;
  /* Hero Subline */
  --color-19: #ffffff;
  /* Header Button BG */
  --color-20: #02ff02;
  /* Header Button Text */
  --color-21: #ffffff;
  /* Header Button 2 Text */
  --color-22: #ffffff;
  /* Footer Button 2 Text */
  --color-23: #ffffff;
  /* Courses Overview Text */
  --color-24: #ffffff;
  /* Text Reveal Text */
  --color-25: #ffffff;
  /* Custom Hero Overlay Color*/
  --color-26: #ffffff;
  /* Custom CTA Overlay Color*/
  --color-27: #ffffff;
  /* Custom CTA BG Color*/
  --color-28: #ffffff;
  /* Custom CTA Text Color*/
  --color-29: #000000;
  /* Custom Training BG Color*/
  --color-30: #000000;
  /* Custom Training Text Color*/
  --color-31: #ffffff;
  /* Simple Headline BG Color*/
  --color-32: #000000;
  /* Simple Headline Text Color*/
  --color-33: #ffffff;
  /* Locations Card BG Color 2 */
  --color-34: #303030;
  /* Testimonials 2 Card BG Color */
  --color-35: #303030;
  /* Testimonials 2 Star Color */
  --color-36: #dd8118;
  --white: #ffffff;
  --black: #000000;
  --grey-1: #efefef;
  --grey-2: #8a8a8a;
  --grey-3: #f9f9f9;
  --grey-4: #c1c1c1;
  --grey-5: #222222;
  --success: #259835;
  --warning: #facc15;
  --error: #e51212;
  --shadow-1: 0px 0px 20px rgb(0 0 0 / 15%);
  --shadow-2: 0px 3px 6px rgb(0 0 0 / 15%);
  --shadow-3: 0 2px 8px rgb(0 0 0 / 20%);

  /* 
    Allgemeine Farben:
    color-1 = Hauptfarbe (Buttons, Icons, wichtige Elemente) 
    color-2 = Nebenfarbe -> (Hintergrundflächen, Stilelemente)
    color-3 = Akzentfarbe (only in some templates with 3 primary used colors needed) -> (Stilelemente, Links)
    color-4 = Hintergrundfarbe (Allgemein)

    Texte:
    color-5 = Textfarbe (Überschriften/Headlines)
    color-6 = Textfarbe (Unterzeilen/Sublines)
    color-7 = Textfarbe (Fließtexte)
    color-8 = Textfarbe (Buttons)

    Navigation:
    color-9 = Navigation (Hintergrundfarbe)
    color-10 = Navigation (Textfarbe)

    Footer:
    color-11 = Footer (Hintergrundfarbe)
    color-12 = Footer (Textfarbe)
    */
  --container-max-width: 108rem;
  --container-max-width-sm: 92rem;
  --text-container-max-width: 90ch;
  --container-p-inline: 1rem;
  --container-p-block: 1.5rem;
  --inner-spacing: 1.5rem;
  --inner-spacing-lg: calc(var(--inner-spacing) * 2);
  --gap-sm: 1rem;
  --gap: 1.5rem;
  --gap-lg: 2rem;
  --gap-xl: 3rem;
  --card-padding: 1.5rem;
  --card-padding-lg: 3rem;
  --br: 0.5rem;
  --br-lg: 1rem;
  --s-1: 0px 0px 50px 0px var(--color-4);
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --timing: 300ms;
  --transition: var(--timing) var(--ease-out-quart);
}

/* 
    breakpoints (min-width):
    sm = 640px
    md = 768px
    lg = 1024px
    xl = 1280px
    2xl = 1536px
    */


@media (min-width: 768px) {
  :root {
    --container-p-inline: 1.5rem;
    --container-p-block: 2rem;
  }
}

@media (min-width: 1024px) {
  :root {
    --container-p-inline: 2rem;
    --container-p-block: 3rem;
  }
}

@media (min-width: 1280px) {
  :root {
    --container-p-inline: 3rem;
    --container-p-block: 4em;
  }
}

@media (min-width: 1536px) {
  :root {
    --container-p-inline: 4rem;
    --container-p-block: 6em;
    --inner-spacing: 3rem;
    --inner-spacing-lg: calc(var(--inner-spacing) * 1.5);
  }
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  margin: 0;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}

body {
  font-family: var(--google-font, "Montserrat"), system-ui, -apple-system,
    'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
  font-weight: var(--text-font-weight, 400);
  line-height: var(--text-line-height, 1.5);
  letter-spacing: var(--text-letter-spacing, normal);
  color: var(--color-7);
  background: var(--color-4);
  overflow-y: auto;
  overflow-x: hidden;
}

body {
  /* scrollbar-gutter: stable; */
  scrollbar-color: transparent var(--color-1);
}

body::-webkit-scrollbar {
  width: 20px;
  height: 20px;
}

body::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 20px;
}

body::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 20px;
  border: 4px solid transparent;
  box-shadow: 10px 0px 0px 10px var(--color-1) inset;
}

@supports (overflow: overlay) {
  .custom-scrollbar {
    overflow: overlay;
  }
}


/* ---------- Reset ---------- */
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  vertical-align: middle;
}

img,
video {
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

a {
  color: inherit;
}

button {
  padding: 0;
  background-color: unset;
  border: 0;
  cursor: pointer;
}


/* ---------- Typography ---------- */
p {
  font-size: var(--text-font-size, 16px);
  font-weight: var(--text-font-weight, 400);
  line-height: var(--text-line-height, 1.5);
  letter-spacing: var(--text-letter-spacing, normal);
}

p+p {
  margin-top: 1rem;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

.headline {
  font-size: calc(var(--headline-font-size-base, 16px) * 2.25);
  font-weight: var(--headline-font-weight-1, 900);
  line-height: var(--headline-line-height, 1.2);
  letter-spacing: var(--headline-letter-spacing, normal);
  color: var(--color-5);
}

.title {
  font-size: calc(var(--headline-font-size-base, 16px) * 1.75);
  font-weight: var(--headline-font-weight-1, 900);
  line-height: var(--headline-line-height, 1.2);
  letter-spacing: var(--headline-letter-spacing, normal);
  color: var(--color-5);
}

.h3 {
  font-size: calc(var(--headline-font-size-base, 16px) * 1.25);
  font-weight: var(--headline-font-weight-2, 700);
  line-height: var(--headline-line-height, 1.2);
  letter-spacing: var(--headline-letter-spacing, normal);
  color: var(--color-5);
}

.h4 {
  font-size: calc(var(--headline-font-size-base, 16px) * 1.125);
  font-weight: var(--headline-font-weight-2, 700);
  letter-spacing: var(--headline-letter-spacing, normal);
  color: var(--color-5);
}

.large-p {
  font-size: calc(var(--text-font-size, 16px) * 1.125);
}

.text-xs {
  font-size: 0.75rem;
}

.text-sm {
  font-size: 0.875rem;
}

.text-lg {
  font-size: 1.125rem;
}

.text-xl {
  font-size: 1.25rem;
}

.text-2xl {
  font-size: 1.5rem;
}

.text-3xl {
  font-size: 1.75rem;
}

.text-4xl {
  font-size: 2rem;
}

.bold {
  font-weight: 700;
}

.black {
  font-weight: 900;
}

.fw-1 {
  font-weight: var(--headline-font-weight-1);
}

.fw-2 {
  font-weight: var(--headline-font-weight-2);
}

.text-center {
  text-align: center;
}

@media (min-width: 1024px) {
  .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 3);
  }

  .title {
    font-size: calc(var(--headline-font-size-base, 16px) * 2);
  }

  .large-p {
    font-size: calc(var(--text-font-size, 16px) * 1.25);
  }
}

@media (min-width: 1280px) {
  .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 3.5);
  }

  .title {
    font-size: calc(var(--headline-font-size-base, 16px) * 2.5);
  }

  .h3 {
    font-size: calc(var(--headline-font-size-base, 16px) * 1.75);
  }

  .h4 {
    font-size: calc(var(--headline-font-size-base, 16px) * 1.25);
  }
}

@media (min-width: 1536px) {
  .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 4);
  }

  .title {
    font-size: calc(var(--headline-font-size-base, 16px) * 3);
  }

  .h3 {
    font-size: calc(var(--headline-font-size-base, 16px) * 2);
  }

  .h4 {
    font-size: calc(var(--headline-font-size-base, 16px) * 1.5);
  }
}


/* ---------- Utilities ---------- */
.hidden,
[hidden] {
  display: none !important;
}

.visibility-hidden {
  visibility: hidden;
}

.overflow-hidden {
  overflow: hidden;
}

.m-auto {
  margin: auto;
}

.mx-auto {
  margin-inline: auto;
}

.flex {
  display: flex;
}

.custom-scrollbar {
  overflow: auto;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: transparent var(--color-7);
}

.custom-scrollbar::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
  border-radius: 8px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--color-7);
  border-radius: 8px;
}

@supports (overflow: overlay) {
  .custom-scrollbar {
    overflow: overlay;
    scrollbar-width: thin;
    scrollbar-color: transparent var(--color-7);
  }

  .custom-scrollbar::-webkit-scrollbar {
    width: 16px;
    height: 16px;
  }

  .custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 8px;
  }

  .custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 8px;
    border: 4px solid transparent;
    box-shadow: 4px 0px 0px 4px var(--color-7) inset;
  }
}


/* ---------- Layout ---------- */
.container {
  width: 100%;
  max-width: var(--container-max-width);
  margin-inline: auto;
  padding-inline: var(--container-p-inline);
}

.container-sm {
  width: 100%;
  max-width: var(--container-max-width-sm);
  margin-inline: auto;
  padding-inline: var(--container-p-inline);
}

.container-full {
  width: 100%;
  padding-inline: var(--container-p-inline);
}

/* container padding block */
.cp-block {
  padding-block: var(--container-p-block);
}

.cp-block-lg {
  padding-block: calc(var(--container-p-block) * 2);
}

.text-container {
  max-width: var(--text-container-max-width);
  margin-inline: auto;
}


.background {
  position: absolute;
  z-index: -1;
  inset: 0;
}

.background .overlay {
  background: linear-gradient(transparent, var(--color-4));
}

.background :is(img, video, .overlay) {
  position: absolute;
  inset: 0;
}

.background :is(img, video) {
  min-width: 100%;
  height: 100%;
  object-fit: cover;
}

.header-spacer {
  height: 80px;
}

@media (min-width: 1024px) {
  .header-spacer {
    height: 94px;
  }
}


/* ---------- Components ---------- */
/* --- Modal --- */
.modal {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--container-p-inline);
  isolation: isolate;
  visibility: hidden;
}

.modal.transition {
  visibility: visible !important;
}

.modal[data-state=open] {
  visibility: visible;
}

.modal::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: var(--color-4);
  opacity: 0;
  transition: opacity var(--transition);
}

.modal[data-state=open]::before {
  opacity: 1;
}

.modal-body {
  position: relative;
  opacity: 0;
  transform: translateY(-2rem);
  transition: all var(--transition);
  min-height: 0;
  max-height: 100%;
  overflow: auto;
}

.modal[data-state=open] .modal-body {
  opacity: 1;
  transform: translate(0);
}

.modal .close-btn {
  position: absolute;
  z-index: 10;
  top: 1rem;
  right: 1rem;
  color: var(--color-7);
  font-size: 1.5rem;
}


@media (min-width: 1280px) {
  .modal .close-btn {
    font-size: 2rem;
  }
}

@media (min-width: 1536px) {
  .modal .close-btn {
    font-size: 3rem;
  }
}

.modal[data-state=closed] .close-btn {
  visibility: hidden;
}

[data-id="section-with-video-popup"] .modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: visible;
}

[data-id="section-with-video-popup"] video {
  width: auto;
  max-width: 100%;
  min-height: 0;
  max-height: 100%;
}


/* --- Buttons --- */
.c-popup_bn {
  left: auto !important;
  right: 1rem !important;
  bottom: 1rem !important;
}

.btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
  padding: 0.5rem 1.5rem;
  border: 3px solid var(--color-1);
  background-color: var(--color-1);
  border-radius: var(--br);
  color: var(--color-8);
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  font-size: var(--button-font-size, 16px);
  font-weight: var(--button-font-weight, 700);
  letter-spacing: var(--button-letter-spacing, normal);
  /* transition: var(--transition); */
}

.btn.outline {
  border: 3px solid var(--color-1);
  background-color: transparent !important;
}

.btn.whatsapp-btn {
  background-color: var(--color-13);
  border-color: var(--color-13);
  color: white;
}

.btn.secondary {
  background-color: var(--color-20);
  border-color: var(--color-20);
  color: var(--color-21);
}

.btn.disabled {
  pointer-events: none;
  opacity: 0.25;
}

.btn svg {
  width: 1.5rem;
  height: 1.5rem;
}


/* --- Swiper --- */
.custom-swiper-wrapper {
  position: relative;
  isolation: isolate;
  max-width: 100%;
}

.custom-swiper {
  overflow: hidden;
}

.custom-swiper-wrapper .controls {
  display: flex;
  justify-content: center;
  margin-top: 0.5rem;
}

.custom-swiper-wrapper .controls :is(.prev, .next)[disabled] {
  opacity: 0.25;
}

.custom-swiper-wrapper .controls :is(.prev, .next) svg {
  color: var(--color-1);
  width: 60px;
  height: 60px;
}

@media (min-width: 1280px) {
  .custom-swiper-wrapper .controls {
    margin-top: 0;
  }

  .custom-swiper-wrapper .controls :is(.prev, .next) {
    position: absolute;
    z-index: 2;
    top: 50%;
    transform: translateY(-50%);
  }

  .custom-swiper-wrapper .controls .prev {
    left: -55px;
  }

  .custom-swiper-wrapper .controls .next {
    right: -55px;
  }
}

@media (min-width: 1536px) {
  .custom-swiper-wrapper .controls .prev {
    left: -65px;
  }

  .custom-swiper-wrapper .controls .next {
    right: -65px;
  }
}

.swiper-scrollbar {
  --swiper-scrollbar-bg-color: white;
  --swiper-scrollbar-drag-bg-color: #5a5a5a;
  --swiper-scrollbar-size: 10px;
}

.swiper-scrollbar-drag {
  cursor: grab;
}

/* --- Bullet list --- */
.bulletlist {
  list-style: disc;
  list-style-position: inside;
}

.checklist {
  list-style: none;
  list-style-position: inside;
}

.checklist li {
  display: flex;
  gap: 0.5rem;
}

.checklist li+li {
  margin-top: 0.5rem;
}

.checklist svg {
  flex-shrink: 0;
  width: 1rem;
  height: 1rem;
  color: var(--color-1);
  position: relative;
  top: 4px;
}


/* ---------- Sections ---------- */
/* --- Header --- */
.header {
  --header-height: 80px;
  --opacity: 0.95;
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 90;
  color: var(--color-10);
  box-shadow: 0 0 20px 0px rgba(0, 0, 0, .25);
}

.header .logo img {
  width: auto;
  max-width: 65px;
  max-height: 48px;
  object-fit: cover;
}

.main-nav {
  --padding-block: 1rem;
  --logo-width: 65px;
  --gap: 0.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: var(--header-height);
  margin-right: calc(var(--logo-width) - 1rem);
  align-items: center;
  gap: var(--gap);
  padding-block: var(--padding-block);
}

.main-nav::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: var(--color-9);
  opacity: var(--opacity);
}

@media (min-width: 640px) {
  .main-nav {
    --logo-width: 120px;
  }

  .header .logo img {
    max-width: 120px;
  }
}

@media (min-width: 1024px) {
  .main-nav {
    --padding-block: 1.5rem;
    --gap: 2rem;
    margin-right: 0;
    height: unset;
  }
}

@media (min-width: 1280px) {
  .main-nav {
    --logo-width: 150px;
  }

  .header .logo img {
    max-width: 150px;
  }
}

.side-buttons {
  flex-shrink: 0;
  flex-grow: 1;
  display: flex;
  justify-content: center;
  gap: 1rem;
}

.side-buttons .secondary {
  display: none;
}

.side-buttons .btn.outline {
  color: var(--color-22);
}

@media (min-width: 1024px) {
  .side-buttons {
    flex-grow: unset;
  }

  .side-buttons .secondary {
    display: flex;
  }
}

@media (min-width: 1280px) {
  .side-buttons {
    gap: var(--gap);
  }
}

.main-nav .btn {
  padding-block: 0.5rem;
  padding-inline: 0.75rem;
  gap: 0.5rem;
}

.menu-trigger {
  position: fixed;
  z-index: 110;
  top: 1.75rem;
  right: 1.75rem;
}

@media (min-width: 1024px) {
  .menu-trigger {
    display: none;
  }
}

.hamburger {
  width: 24px;
  height: 24px;
  padding: 0;
  position: relative;
  transform: rotate(0deg);
  transition: .5s ease-in-out;
  cursor: pointer;
}

.hamburger span {
  display: block;
  position: absolute;
  left: 1px;
  height: 2px;
  width: calc(100% - 3px);
  background: var(--color-10);
  border-radius: 2px;
  opacity: 1;
  transform: rotate(0deg);
  transition: .25s ease-in-out;
}

.hamburger span:nth-child(1) {
  top: 4px;
}

.hamburger span:nth-child(2),
.hamburger span:nth-child(3) {
  top: calc(50% - 1px);
}

.hamburger span:nth-child(4) {
  top: calc(100% - 6px);
}

[data-state=open] .hamburger span:nth-child(1) {
  top: calc(50% - 1px);
  width: 0%;
  left: 50%;
}

[data-state=open] .hamburger span:nth-child(2) {
  transform: rotate(45deg);
}

[data-state=open] .hamburger span:nth-child(3) {
  transform: rotate(-45deg);
}

[data-state=open] .hamburger span:nth-child(4) {
  top: calc(50% - 1px);
  width: 0%;
  left: 50%;
}

.mobile-container {
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: fixed;
  z-index: -2;
  top: 0;
  right: 0;
  width: 100%;
  padding-inline: var(--container-p-inline);
  padding-block: calc(var(--container-p-inline) * 2);
  overflow: auto;
  transform: translateY(-120%);
  visibility: hidden;
  transition: transform var(--transition);
}

.mobile-container::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: var(--color-9);
  opacity: var(--opacity);
}

.mobile-container.transition {
  visibility: visible !important;
}

[data-state=open] .mobile-container {
  transform: translateY(var(--header-height));
  visibility: visible;
}

@media (min-width: 1024px) {
  .mobile-container {
    background-color: transparent;
    visibility: visible;
    position: static;
    z-index: unset;
    display: block;
    width: auto;
    height: auto;
    padding: 0;
    overflow: visible;
    transform: none;
    transition: none;
  }

  .mobile-container::before {
    display: none;
  }
}

.nav-list,
.mobile-side-buttons {
  display: grid;
  place-items: center;
  gap: 1rem;
}

.mobile-side-buttons {
  margin-top: 2rem;
}

.mobile-side-buttons .btn {
  width: 100%;
}

@media (min-width: 1024px) {
  .mobile-side-buttons {
    display: none;
  }

  .nav-list {
    display: flex;
    gap: 3.5rem;
  }
}

@media (min-width: 1536px) {
  .nav-list {
    margin-left: 9rem;
  }
}

.nav-list li {
  display: flex;
  margin-inline: auto;
}

.nav-link {
  position: relative;
  padding: 0.5rem 0;
  text-align: center;
  font-size: var(--button-font-size, 16px);
  font-weight: var(--button-font-weight, 700);
  letter-spacing: var(--button-letter-spacing, normal);
  text-transform: uppercase;
  text-decoration: none;
  color: var(--color-10);
  cursor: pointer;
}

@media (min-width: 1024px) {
  .nav-link {
    padding: 0;
  }
}


.subnav {
  flex-direction: column;
  contain: layout;
}

.subnav-trigger {
  cursor: pointer;
}

.subnav .wrapper {
  display: grid;
  grid-template-rows: 0fr;
  transition: var(--transition);
}

.subnav.active .wrapper {
  grid-template-rows: 1fr;
}

.subnav-list {
  display: grid;
  justify-content: center;
  overflow: hidden;
}

.subnav-list .nav-link {
  font-size: calc(var(--button-font-size, 16px) * 0.875);
}

@media (min-width: 1024px) {
  .subnav {
    padding-bottom: 20px;
    margin-bottom: -20px;
  }

  .subnav .wrapper {
    position: fixed;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    width: max-content;
    background-color: var(--color-9);
    padding-inline: var(--card-padding);
  }

  .subnav.active .wrapper,
  .subnav:hover .wrapper {
    padding-block: var(--card-padding);
  }

  .subnav:hover .wrapper {
    grid-template-rows: 1fr;
  }

  .subnav-list {
    display: grid;
    gap: 1rem;
    justify-content: center;
    overflow: hidden;
    max-width: 250px;
  }
}


/* --- Hero --- */
.hero {
  display: grid;
  min-height: 100vh;
  position: relative;
  isolation: isolate;
  padding-top: 80px;
}

.hero .content {
  margin-top: auto;
  text-align: center;
}

.hero .headline {
  color: var(--color-18);
  text-shadow: var(--hero-text-shadow);
}

.hero .title {
  color: var(--color-19);
}

.hero .headline {
  word-break: break-word;
  margin-bottom: 1rem;
  font-size: calc(var(--headline-font-size-base, 16px) * 2.5);
}

@media (min-width: 768px) {
  .hero .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 3.5);
  }
}

@media (min-width: 1024px) {
  .hero .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 4);
  }
}

@media (min-width: 1280px) {
  .hero .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 5);
  }
}

@media (min-width: 1536px) {
  .hero .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 6);
  }
}

@media (min-width: 1024px) {
  .hero .text-container .text-lg {
    font-size: 1.25rem;
  }
}

@media (min-width: 1536px) {
  .hero .text-container .text-lg {
    font-size: 1.5rem;
  }
}

.hero .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  margin-top: var(--inner-spacing-lg);
  margin-bottom: 2.5rem;
}

@media (min-width: 640px) {
  .hero .button-wrapper {
    flex-direction: row;
    margin-inline: auto;
    justify-content: center;
  }
}

.toggle-mute {
  position: absolute;
  bottom: 1rem;
  left: 1rem;
  padding: 0.25rem;
  color: var(--color-7);
  opacity: 0.5;
  transition: opacity var(--transition);
}

.toggle-mute:hover {
  opacity: 1;
}

@media (min-width: 640px) {
  .toggle-mute {
    display: block;
  }
}

.toggle-mute svg {
  width: 1.5rem;
  height: 1.5rem;
}

@media (min-width: 1280px) {
  .toggle-mute svg {
    width: 2rem;
    height: 2rem;
  }
}

.toggle-mute[data-state=muted] #volume-off {
  display: block;
}

.toggle-mute[data-state=muted] #volume-on {
  display: none;
}

.toggle-mute[data-state=unmuted] #volume-off {
  display: none;
}

.toggle-mute[data-state=unmuted] #volume-on {
  display: block;
}

.hero.custom-overlay-color .overlay {
  background: linear-gradient(transparent, var(--color-26));
}

/* Hero New */
.hero-new {
  position: relative;
  min-height: max(60vh, 400px);
  margin-top: 80px;
}

@media (min-width: 1024px) {
  .hero-new {
    margin-top: 94px;
  }
}

.hero-new .container {
  padding-bottom: var(--container-p-inline);
}

.hero-new .headline {
  word-break: break-word;
  margin-bottom: 1rem;
  font-size: calc(var(--headline-font-size-base, 16px) * 1.75);
}

.hero-new .title {
  word-break: break-word;
  font-size: 1.25rem;
}

@media (min-width: 768px) {
  .hero-new .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 2.5);
  }

  .hero-new .title {
    font-size: 1.5rem;
  }
}

@media (min-width: 1024px) {
  .hero-new .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 3);
  }

  .hero-new .title {
    font-size: 1.75rem;
  }
}

@media (min-width: 1280px) {
  .hero-new .headline {
    font-size: calc(var(--headline-font-size-base, 16px) * 4);
  }

  .hero-new .title {
    font-size: 2rem;
  }
}

/* Hero Service */
.hero-service {
  --header-height: 80px;
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: calc(100vh - var(--header-height));
  margin-top: var(--header-height);
}

@media (min-width: 1024px) {
  .hero-service {
    --header-height: 94px;
    min-height: max(60vh, 400px);
    align-items: center;
  }
}

.hero-service .container {
  padding-block: var(--container-p-inline);
  display: flex;
}

.hero-service .content {
  position: relative;
  isolation: isolate;
  color: #000;
  padding: 1.5rem;
  display: grid;
  gap: 1rem;
}

.hero-service .content::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: #fff;
  border-radius: var(--br);
  opacity: var(--content-bg-opacity, 0.7);
}

@media (min-width: 1024px) {
  .hero-service .content {
    padding: 2.5rem;
    max-width: 50%;
  }
}

.hero-service .title {
  color: inherit;
}


/* --- Studios Overview --- */
.studios-overview {
  position: relative;
  isolation: isolate;
  background: var(--color-3);
}

.studios-overview>.background {
  opacity: 0.2;
}

.studios-overview .title {
  margin-bottom: 0.5rem;
}

.studios-overview .h3 {
  margin-bottom: var(--inner-spacing);
}

.studios-overview .title>span:first-child {
  color: var(--color-1);
}

.studios-overview .title,
.studios-overview .h3 {
  color: var(--color-4);
  text-align: center;
}

.studios-overview .cards {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

@media (min-width: 768px) {
  .studios-overview .cards {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
  }

  .studios-overview .cards>* {
    flex: 0 0 calc(50% - var(--gap) / 2);
  }
}

@media (min-width: 1536px) {
  .studios-overview .cards {
    gap: var(--gap-xl);
  }

  .studios-overview .cards>* {
    flex: 0 0 calc(50% - var(--gap-xl) / 2);
  }
}

.studios-overview .card {
  position: relative;
  isolation: isolate;
  border-radius: var(--br);
  overflow: hidden;
  aspect-ratio: 775 / 581;
}

.studios-overview .card>a {
  position: absolute;
  inset: 0;
}

.studios-overview .card :is(.background, .background img) {
  position: relative;
}

.studios-overview .card .content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: var(--card-padding);
  position: absolute;
  inset: 0;
  padding: var(--card-padding);
  text-transform: uppercase;
}

@media (min-width: 1536px) {
  .studios-overview .card .content {
    gap: var(--card-padding-lg);
    padding-bottom: var(--card-padding-lg);
  }
}

.studios-overview .card .h3 {
  margin-bottom: 0;
  text-transform: uppercase;
  color: var(--color-5);
}


/* --- Studio Select Popup --- */
.studio-select-popup .modal-body {
  padding: var(--card-padding);
  border-radius: var(--br-lg);
  width: min(100%, 1250px);
}


/* --- Info Bar --- */
.info-bar {
  background-color: var(--color-1);
  overflow: hidden;
}

.info-bar :is(h3, .title, .h4) {
  font-weight: 700;
  color: var(--color-15);
}

.info-bar .grid {
  display: flex;
  flex-direction: column;
  /* flex-wrap: wrap; */
  justify-content: center;
  gap: 2px;
}

.info-bar .grid>li {
  padding: 0.5rem 0.75rem;
}

.info-bar .grid h3 {
  height: 100%;
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.info-bar .grid .h4 {
  white-space: nowrap;
}


@media (min-width: 1024px) {
  .info-bar {
    display: flex;
    justify-content: center;
  }

  .info-bar .grid {
    flex-direction: row;
    border-top: 0;
    border-bottom: 0;
  }

  .info-bar .grid>li {
    padding: 0.5rem 1.5rem;
  }
}

@media (min-width: 1280px) {
  .info-bar .grid>li {
    padding: 0.5rem 2.5rem;
  }
}


/* --- Title bar --- */
.title-bar {
  background-color: var(--color-1);
  padding-block: 0.75rem;
}

.title-bar .title {
  overflow: hidden;
  display: flex;
  gap: var(--inner-spacing-lg);
  text-transform: uppercase;
  color: var(--color-15);
}

.title-bar .title>* {
  animation: scroll-left 30s linear infinite;
  flex-shrink: 0;
  min-width: 100%;
  gap: var(--inner-spacing-lg);
  display: flex;
  justify-content: space-around;
}

@keyframes scroll-left {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(calc(-100% - var(--inner-spacing-lg)));
  }
}


/* --- Overview with gallery --- */
.overview-with-gallery {
  position: relative;
  isolation: isolate;
}

.overview-with-gallery .background {
  height: 100%;
}

.overview-with-gallery .bg-desktop {
  display: none;
}

.overview-with-gallery .overlay::before {
  position: absolute;
  inset: 0;
  background: var(--color-4);
  opacity: 0.5;
}

@media (min-width: 1024px) {
  .overview-with-gallery .background {
    height: 100%;
    width: min(50%, 842px);
    margin-left: auto;
  }

  .overview-with-gallery .bg-desktop {
    display: block;
  }

  .overview-with-gallery .bg-mobile {
    display: none;
  }

  .overview-with-gallery .overlay {
    background: radial-gradient(100.56% 87.18% at 99.01% 66.63%, transparent 61.69%, var(--color-4) 100%), linear-gradient(180deg, transparent 50%, var(--color-4) 100%);
    opacity: 1;
  }
}

.overview-with-gallery .content {
  display: flex;
  flex-direction: column;
}

.overview-with-gallery .content>div {
  max-width: 100%;
}

@media (min-width: 1024px) {
  .overview-with-gallery .content {
    width: 50%;
    align-items: flex-start;
  }
}

.overview-with-gallery .title {
  margin-bottom: var(--inner-spacing);
  text-align: center;
}

@media (min-width: 768px) {
  .overview-with-gallery .title {
    text-align: left;
  }
}

.overview-with-gallery p {
  margin-bottom: var(--inner-spacing);
}

.overview-gallery {
  width: 100%;
}

.overview-gallery .swiper-slide {
  border-radius: calc(var(--br) / 2);
  overflow: hidden;
}

.overview-gallery img {
  min-width: 100%;
}

@media (min-width: 1024px) {
  .overview-gallery-wrapper .controls {
    justify-content: flex-start;
  }
}

.overview-with-gallery .btn {
  display: inline-flex;
  margin-inline: auto;
  margin-top: var(--inner-spacing);
}

@media (min-width: 1024px) {
  .overview-with-gallery .btn {
    margin-inline: unset;
  }
}


/* --- Banner --- */
.banner {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 70vh;
}

.banner .background .overlay {
  background: unset;
}

.banner .background .overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-1);
  opacity: 0.90;
  mix-blend-mode: multiply;
}

.banner .background .overlay::before {
  content: '';
  position: absolute;
  z-index: 2;
  inset: 0;
  background: linear-gradient(180deg, var(--color-4) 0%, transparent 36%, var(--color-4) 100%);
}

.banner.no-color-overlay .background .overlay::after {
  display: none;
}

.banner.no-gradient-overlay .background .overlay::before {
  display: none;
}

.banner .content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  text-align: center;
  color: var(--color-17);
}

.banner-2 .content .btn,
.banner .content .title,
.banner .content .headline {
  color: inherit;
}

@media (max-width: 1023px) {
  .banner .content .headline {
    font-size: 2rem;
  }
}

.banner .content p {
  margin-bottom: 1rem;
}

.banner.custom-overlay-color {
  background-color: var(--color-28);
}

.banner.custom-overlay-color .content {
  color: var(--color-29);
}

.banner.custom-overlay-color .content .btn {
  color: var(--color-29);
}

.banner.custom-overlay-color .background .overlay::before {
  background: linear-gradient(180deg, var(--color-27) 0%, transparent 36%, var(--color-27) 100%);
}

/* --- Testimonials --- */
.testimonials {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.testimonials .background .overlay {
  background: radial-gradient(36.77% 33.69% at 50.00% 50.00%, transparent 0%, var(--color-4) 100%);
}

.testimonials .background .overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-4);
  opacity: 0.2;
}

.testimonials .grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--inner-spacing);
}

.testimonials .button-wrapper {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

@media (min-width: 640px) {
  .testimonials .button-wrapper {
    flex-direction: row;
    justify-content: center;
  }
}

@media (min-width: 1280px) {
  .testimonials .button-wrapper {
    margin-top: var(--inner-spacing);
  }
}

.testimonials-wrapper {
  position: relative;
  width: 100%;
}

.testimonials-wrapper .slide {
  display: grid;
  gap: 2em;
  position: relative;
  padding: 1.5rem;
  padding-top: 3.5rem;
}

@media (min-width: 640px) {
  .testimonials-wrapper .slide {
    padding: 2rem;
    padding-top: 4rem;
    gap: 2.5rem;
  }
}

.testimonials-wrapper .slide::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background-color: white;
  opacity: 0.1;
  border-radius: var(--br-lg);
}

.testimonials-wrapper .slide h3 {
  position: relative;
  font-weight: 700;
}

.testimonials-wrapper .slide h3::before {
  content: '"';
  position: absolute;
  top: -2.5rem;
  left: 0;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 3rem;
}

.testimonials-wrapper .slide .stars {
  position: relative;
  left: -.5rem;
  color: var(--color-1);
}

.author-wrapper {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.author-wrapper img {
  border-radius: 999vw;
  width: 72px;
  height: 72px;
  overflow: hidden;
  flex-shrink: 0;
}

.author-wrapper p {
  line-height: 1;
}

.author-wrapper p:first-child {
  font-weight: 700;
  margin-bottom: 0.75rem;
}

.author-wrapper p:last-child {
  opacity: 0.5;
}

[data-type=regular] .toggle-text-btn {
  display: none;
}

.collapsible-text {
  overflow: hidden;
}

[data-type=collapsible] .collapsible-text {
  max-height: 190px;
  /* transition: max-height var(--transition); */
}

[data-type=collapsible][data-state="open"] .collapsible-text {
  max-height: var(--scroll-height);
}

.toggle-text-btn {
  margin-top: 1rem;
  margin-inline: auto;
  border: 0;
  isolation: isolate;
  background-color: transparent;
}

.toggle-text-btn .icon {
  transition: transform var(--transition);
}

.toggle-text-btn .icon svg {
  width: 1.25rem;
  height: 1.25rem;
}

[data-state="closed"] .toggle-text-btn span:last-of-type {
  display: none;
}

[data-state="closed"] .toggle-text-btn span:first-of-type {
  display: block;
}

[data-state="open"] .toggle-text-btn span:last-of-type {
  display: block;
}

[data-state="open"] .toggle-text-btn span:first-of-type {
  display: none;
}

[data-state="open"] .toggle-text-btn .icon {
  transform: rotate(180deg);
}

/* Testimonials 2 */
.testimonials-2 .large-p {
  font-size: 1rem;
}

.testimonials-2 .text-xl {
  font-size: 1.125rem;
}

.testimonials-2 .slide::before {
  background-color: var(--color-35);
}

.testimonials-2 .slide .stars {
  color: var(--color-36);
}


/* --- CTA --- */
.cta {
  position: relative;
  isolation: isolate;
}

.cta .background {
  height: 100%;
  overflow: hidden;
}

.cta .bg-desktop {
  display: none;
}

.cta .overlay {
  background: linear-gradient(180deg, var(--color-4) 0%, transparent 20%), radial-gradient(76.34% 61.93% at 100.00% 30.36%, transparent 50.91%, var(--color-4) 100%);
}

.cta .overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--color-4);
  opacity: 0.5;
}

@media (min-width: 1024px) {
  .cta .bg-video {
    transform: translateX(30%);
  }

  .cta .bg-desktop {
    display: block;
    min-width: unset;
    width: 50%;
    left: auto;
  }

  .cta .bg-mobile {
    display: none;
  }

  .cta .overlay {
    background: linear-gradient(180deg, transparent 75.83%, var(--color-4) 100%), radial-gradient(227.59% 85.63% at 97.45% 10.64%, transparent 66.40%, var(--color-4) 100%), linear-gradient(90deg, var(--color-4) 54.99%, transparent 100%);
  }
}

.cta .content {
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

@media (min-width: 1024px) {
  .cta .content {
    width: 50%;
    align-items: flex-start;
    text-align: left;
  }
}

.cta .label {
  margin-bottom: var(--inner-spacing);
}

.cta .title {
  margin-bottom: var(--gap);
}

.cta .btn {
  margin-top: var(--inner-spacing);
}


/* --- WhatsApp Section --- */
.whatsapp {
  position: relative;
  isolation: isolate;
  background-color: var(--color-3);
}

.whatsapp>.background {
  opacity: 0.2;
}

.whatsapp .container {
  padding-bottom: 0;
}

.whatsapp .content {
  display: grid;
  justify-items: center;
  padding-top: 2.5rem;
  text-align: center;
}

@media (min-width: 768px) {
  .whatsapp-2 .content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--gap-xl);
    text-align: left;
  }
}

.whatsapp .headline {
  color: var(--color-1);
  text-transform: uppercase;
}

.whatsapp,
.whatsapp .title {
  color: var(--color-14);
}

.whatsapp .title {
  margin-bottom: 1rem;
}

.whatsapp .img-wrapper {
  position: relative;
  margin-top: var(--inner-spacing-lg);
  height: 450px;
  overflow: hidden;
}

@media (min-width: 768px) {
  .whatsapp-2 .img-wrapper {
    margin-top: 0;
  }
}

.whatsapp .img-wrapper .qr-img {
  position: absolute;
  top: 60px;
  left: 50%;
  transform: translateX(-50%);
}

.whatsapp .img-wrapper .btn {
  position: absolute;
  top: 370px;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
}



/* --- Footer --- */
.footer {
  background: var(--color-11);
  color: var(--color-12);
}

.footer .layout-grid>.grid-item {
  padding-block: var(--gap);
}

.footer .layout-grid>.grid-item+.grid-item {
  border-top: 2px solid var(--color-12);
}

.footer .button-wrapper {
  display: none;
}

.footer .button-wrapper .btn.outline {
  color: var(--color-23);
}

@media (min-width: 1280px) {
  .footer .layout-grid {
    display: grid;
    grid-template-columns: 280px 1fr 250px;
    padding-top: var(--inner-spacing-lg);
  }

  .footer .layout-grid>.grid-item {
    padding-block: 0;
    padding-inline: var(--inner-spacing);
  }

  .footer .layout-grid>.grid-item:first-child {
    padding-left: 0;
  }

  .footer .layout-grid>.grid-item:last-child {
    padding-right: 0;
  }

  .footer .layout-grid>.grid-item+.grid-item {
    border-left: 2px solid var(--color-12);
    border-top: 0;
  }

  .footer .button-wrapper {
    display: grid;
    gap: var(--gap);
  }
}

@media (min-width: 1536px) {
  .footer .layout-grid {
    grid-template-columns: 480px 1fr 250px;
  }
}

.footer .logo {
  width: 156px;
  margin-inline: auto;
}

.footer .logo img {
  width: 100%;
}

@media (min-width: 1280px) {
  .footer .logo {
    margin-bottom: var(--inner-spacing-lg);
  }
}

@media (min-width: 1536px) {
  .footer .logo-wrapper {
    align-self: start;
    display: flex;
    align-items: center;
    gap: var(--gap-lg);
    margin-top: calc(var(--inner-spacing-lg) + 1rem);
  }

  .footer .logo {
    margin-bottom: 0;
  }
}

.footer .text-2xl {
  margin-bottom: var(--inner-spacing);
  letter-spacing: var(--headline-letter-spacing, normal);
  text-transform: uppercase;
}

.footer-locations-grid {
  display: grid;
  gap: var(--gap-xl);
}

@media (min-width: 640px) {
  .footer-locations-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    column-gap: var(--inner-spacing);
  }
}

@media (min-width: 1536px) {
  .footer-locations-grid {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  }
}

.footer-locations-grid .grid-item,
.map-grid .grid-item,
.contact-new .grid .grid-item {
  display: flex;
  gap: 0.5rem;
}

.footer-locations-grid .grid-item .content,
.map-grid .grid-item .content,
.contact-new .grid .grid-item .content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.footer-locations-grid .icon,
.map-grid .icon,
.contact-new .grid .icon {
  transform: translateY(4px);
}

.footer-locations-grid a,
.map-grid a,
.contact-new .grid a {
  color: var(--color-1);
  font-weight: 700;
  font-size: 1rem;
}

.map-grid {
  display: grid;
  gap: 1rem;
}

.contact-new .grid {
  display: grid;
  gap: 3rem;
}

.map-grid iframe,
.contact-new .grid iframe {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  border-radius: var(--br);
}

.contact-new .grid .map-wrapper {
  max-width: 800px;
}

@media (min-width: 768px) {
  .map-grid {
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
  }
}

@media (min-width: 1024px) {
  .contact-new .grid {
    grid-template-columns: 200px 1fr 2fr;
    gap: var(--gap);
  }

  .contact-new .grid .map-wrapper {
    grid-column: span 1;
    max-width: unset;
  }
}

.footer .contact-new {
  grid-column: span 3;
  padding-top: 2rem;
}

@media (min-width: 1280px) {
  .footer .contact-new {
    padding-top: 0;
  }

  .contact-new .grid {
    grid-template-columns: 250px 1fr 2fr;
  }
}

.footer .contact-new a {
  font-weight: normal;
}

.footer-menu {
  display: grid;
  gap: 1rem;
}

.footer-menu a {
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: var(--button-letter-spacing, normal);
}

.footer-legals {
  background: var(--color-11);
}

.footer-bottom {
  text-align: center;
  font-size: 0.875rem;
  padding-top: var(--inner-spacing-lg);
  padding-bottom: var(--inner-spacing);
  color: var(--color-12);
}

.footer-bottom a {
  text-decoration: none;
}

.footer-bottom .grid {
  display: grid;
  justify-items: center;
  gap: 1rem
}

.legal-links-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  font-weight: 700;
}

.legal-links-wrapper>li {
  display: flex;
  gap: 0.25rem;
}

.legal-links-wrapper>li:last-child>div {
  display: none;
}

.fitmotion-wrapper {
  display: flex;
  gap: 0.25rem;
  font-weight: 700;
  font-size: 0.875rem;
}

.fitmotion-wrapper svg {
  width: 20px;
  height: 20px;
  transform: translateY(-2px);
}

.copyright-wrapper {
  margin-top: 0;
  font-size: 0.875rem;
}


@media (min-width: 1280px) {
  .footer-bottom {
    grid-column: span 3;
  }

  .footer-bottom .grid {
    display: flex;
    justify-content: space-between;
    gap: 1rem
  }

  .legal-links-wrapper {
    order: 2;
  }

  .fitmotion-wrapper {
    order: 3;
  }

  .lg-hidden {
    display: none;
  }
}

.footer .logo-2 {
  margin: 0 !important;
}


/* --- Studio Hero --- */
.hero-studio {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  height: 100vh;
  padding-top: 80px;
  overflow: hidden;
}

@media (min-width: 1024px) {
  .hero-studio .bg-desktop {
    display: block;
    left: auto;
    transform: translateX(0%);
    min-width: unset;
    width: 60%;
  }

  .hero-studio .bg-mobile {
    display: none;
  }

  .hero-studio .overlay {
    background: radial-gradient(150.09% 243.56% at 191% 15.11%, transparent 89%, var(--color-4) 100%), linear-gradient(180deg, transparent 75.14%, var(--color-4) 97%);
  }

  .hero-studio .overlay::before {
    display: none;
  }
}

.hero-studio .content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

@media (min-width: 1024px) {
  .hero-studio {
    align-items: center;
  }

  .hero-studio .content {
    width: 50%;
    align-items: flex-start;
    text-align: left;
    margin-inline: unset;
    margin-right: auto;
  }
}

.hero-studio .label {
  display: block;
  margin-bottom: var(--inner-spacing);
  padding: 0.5rem 0.75rem;
  color: white;
  background-color: var(--color-1);
  border-radius: var(--br);
  text-transform: uppercase;
  font-weight: 900;
}

.hero-studio .title {
  margin-bottom: var(--gap);
}

.hero-studio .btn {
  margin-top: var(--inner-spacing);
  width: 100%;
}

@media (min-width: 640px) {
  .hero-studio .btn {
    width: auto;
  }
}


/* --- Hero Arrow --- */
.hero-arrow .arrow-button {
  color: var(--color-8);
  margin-top: var(--inner-spacing);
}

@media (min-width: 1024px) {
  .hero-arrow .arrow-button {
    position: absolute;
    left: 50%;
    bottom: var(--container-p-block);
    transform: translateX(-50%);
    margin-top: 0;
  }
}


/* --- Services --- */
.services {
  overflow: hidden;
}

.services .title {
  margin-bottom: var(--inner-spacing);
  text-align: center;
}

.services-slider {
  position: relative;
  --swiper-scrollbar-bottom: 0;
  --swiper-scrollbar-sides-offset: 0%;
  padding-bottom: 25px;
}

@media (min-width: 1024px) {
  .services-slider {
    padding-bottom: 0;
  }

  .services-slider .swiper-wrapper {
    transform: none !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--gap);
  }

  .services-slider .swiper-slide {
    width: auto !important;
    margin-right: 0 !important;
    flex: 0 0 calc(33.3333% - var(--gap) * (2/3));
  }
}

@media (min-width: 1280px) {
  .services-slider .swiper-slide {
    flex: 0 0 calc(25% - var(--gap) * (3/4));
  }
}

.services-wrapper .controls {
  margin-top: var(--inner-spacing);
}

@media (min-width: 1024px) {
  .services-wrapper .controls {
    margin-top: 0;
  }
}

.services-slider .card {
  position: relative;
  display: grid;
  border-radius: var(--br);
  overflow: hidden;
  aspect-ratio: 345 / 514;
  color: var(--color-16);
}

@media (min-width: 1024px) {
  .services-slider .card {
    aspect-ratio: 382 / 612;
  }
}

.services-slider .card a {
  display: flex;
  text-decoration: none;
}

.services-slider .card .overlay {
  background: radial-gradient(102.58% 94.00% at 23.87% 0.00%, transparent 59.82%, rgba(0, 0, 0, 0.50) 100%);
}

.services-slider .card .content {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--card-padding);
  text-align: center;
  text-transform: uppercase;
}

.services-slider .card :is(.label, h3) {
  font-weight: var(--headline-font-weight-1, 900);
  letter-spacing: var(--headline-letter-spacing, normal);
}

.services-slider .card h3 {
  line-height: var(--headline-line-height, 1.2);
  margin-bottom: 1rem;
  overflow-wrap: break-word;
}

.services-slider .card .label {
  border-radius: var(--br);
  padding: 0.25rem 1rem;
}

.services-slider .card .label.color-1 {
  background-color: #9F0332;
}

.services-slider .card .label.color-2 {
  background-color: #359F03;
}

.services-slider .card .label.color-3 {
  background-color: #53C9E2;
}

.services-slider .card .label.color-4 {
  background-color: #BA7E47;
}

.services-slider .card .label.color-5 {
  background-color: #BE29C1;
}

.services-slider .card .label.color-6 {
  background-color: #FFA43C;
}

.services-slider .card .label.color-from-variable {
  background-color: var(--label-bg-color);
}


/* --- Services --- */
.services-2 {
  overflow: hidden;
}

.services-2 .title {
  margin-bottom: var(--inner-spacing);
  text-align: center;
}

.services-slider-2 {
  position: relative;
  --swiper-scrollbar-bottom: 0;
  --swiper-scrollbar-sides-offset: 0%;
  padding-bottom: 25px;
}

.services-wrapper-2 .controls {
  margin-top: var(--inner-spacing);
}

@media (min-width: 1024px) {
  .services-wrapper-2 .controls {
    margin-top: 0;
  }
}

.services-slider-2 .card {
  position: relative;
  display: flex;
  border-radius: var(--br);
  overflow: hidden;
  aspect-ratio: 345 / 514;
}

@media (min-width: 1280px) {
  .services-slider-2 .card {
    aspect-ratio: 378 / 612;
  }
}

.services-slider-2 .card .content {
  flex: 1;
  padding: var(--card-padding-lg) var(--card-padding);
  margin-top: auto;
  text-transform: uppercase;
  text-align: center;
  font-weight: 900;
}


/* Slider new */
.slider-new-wrapper {
  margin: -8px -4px 0;
  max-width: calc(100% + 8px);
}

.slider-new {
  position: relative;
  padding: 8px 8px 10px;
}

.slider-new .card {
  display: flex;
  flex-direction: column;
  height: auto;
  position: relative;
  border-radius: var(--br);
  overflow: hidden;
  box-shadow: var(--shadow-3);
}

.slider-new .card img {
  min-width: 100%;
}

.slider-new .card .content {
  display: flex;
  flex-direction: column;
  height: 100%;
  gap: 1rem;
  padding: var(--card-padding);
}

.slider-new .bulletlist {
  list-style: disc;
  list-style-position: inside;
}

.slider-new [data-cms-component="slider-button"] {
  margin-top: auto;
}

.slider-new .btn {
  font-size: 0.875rem;
  padding-block: 0.375rem;
}

.simple-gallery .card {
  border-radius: var(--br);
  overflow: hidden;
}


/* Simple Text */
.simple-text .container {
  padding-block: 3rem;
}

.simple-text .grid-vertical {
  display: grid;
  gap: var(--gap);
}

@media (min-width: 1024px) {
  .simple-text .content {
    max-width: 50%;
    margin-inline: auto;
  }

  .simple-text.left-aligned .content {
    max-width: 50%;
    margin-inline: unset;
  }
}

.info-text {
  --bg-color: #0e49ca;
  position: relative;
  isolation: isolate;
  padding: var(--gap);
  border: 2px solid var(--bg-color);
  border-radius: var(--br);
}

.info-text::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--bg-color);
  opacity: 0.2;
  z-index: -1;
}

@media (min-width: 1024px) {
  .info-text .content {
    max-width: 50%;
    margin-inline: auto;
  }

  .left-aligned .info-text .content {
    max-width: 50%;
    margin-inline: unset;
  }
}

.simple-text .grid {
  display: grid;
  gap: var(--gap-lg);
}

@media(min-width: 1024px) {
  .simple-text .grid {
    grid-template-columns: 1.5fr 1fr;
    gap: var(--gap-xl);
  }
}

.simple-text .button-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
}

/* Text and buttons */
.text-and-buttons .content {
  display: grid;
  gap: var(--gap);
  text-align: center;
}

@media (min-width: 1024px) {
  .text-and-buttons .content {
    max-width: 50%;
    margin-inline: auto;
  }

  .text-and-buttons.left-aligned .content {
    max-width: 50%;
    margin-inline: unset;
    text-align: left;
  }

  .text-and-buttons.left-aligned .button-wrapper {
    justify-content: flex-start;
  }

}

.text-and-buttons .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
}

.text-and-buttons .button-wrapper .btn {
  min-width: 180px;
}

@media (min-width: 640px) {
  .text-and-buttons .button-wrapper {
    flex-direction: row;
    justify-content: center;
  }
}

/* Columns Layout Section */
.columns-layout .container {
  padding-block: 3rem;
}

.columns-grid {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}

@media (min-width: 1024px) {
  .columns-grid {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 4rem;
  }

  .columns-grid>* {
    flex: 1 0 calc(50% - 2rem);
  }

  .columns-grid>*:nth-child(3) {
    flex: 100%
  }
}

@media (min-width: 1536px) {

  .columns-grid>*,
  .columns-grid>*:nth-child(3) {
    flex: 1 0 calc(33.3333% - (4rem / 3 * 2));
  }
}

/* --- CTA 2 --- */
.cta-2 .overlay {
  background: linear-gradient(180deg, var(--color-4) 0%, transparent 20%, transparent 65%, var(--color-4) 95%);
}

@media (min-width: 1024px) {
  .cta-2 .bg-desktop {
    display: block;
    min-width: unset;
    left: auto;
    transform: translateX(0);
    width: 60%;
  }

  .cta-2 .overlay {
    background: radial-gradient(150.09% 243.56% at 191% 15.11%, transparent 89%, var(--color-4) 100%), linear-gradient(180deg, transparent 75.14%, var(--color-4) 97%);
  }

  .cta-2 .overlay::before {
    display: none;
  }

  .cta-2 .content {
    width: 50%;
  }
}


/* --- Banner 2 --- */
.banner-2 .background .overlay::before {
  background: linear-gradient(180deg, var(--color-4) 5%, transparent 36%, var(--color-4) 100%);
}

.banner-2 .grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap);
  margin-block: var(--inner-spacing);
}

.banner-2 .number {
  font-size: 4.25rem;
  font-weight: 900;
  line-height: 1;
}

@media(min-width: 1024px) {
  .banner-2 .grid {
    flex-direction: row;
    margin-block: var(--inner-spacing-lg);
  }

  .banner-2 .arrow {
    transform: rotate(-90deg);
  }
}

@media(min-width: 1536px) {
  .banner-2 .grid {
    gap: var(--gap-xl);
  }
}


/* --- Studio Gallery --- */
.studio-gallery .container {
  padding-bottom: 0;
}

@media(min-width: 1024px) {
  .studio-gallery-wrapper {
    display: grid;
    grid-template-columns: 3fr 2fr;
    align-items: center;
    gap: calc(var(--inner-spacing) * 2);
  }

  .left-wrapper {
    min-width: 0;
    position: relative;
  }
}

@media(min-width: 1280px) {}

.studio-gallery .title {
  margin-bottom: var(--inner-spacing);
  text-align: center;
}

.studio-gallery .right-wrapper .title {
  display: none;
}

@media(min-width: 1024px) {
  .studio-gallery .title {
    display: none;
  }

  .studio-gallery .right-wrapper .title {
    display: block;
    margin-bottom: var(--inner-spacing);
    text-align: left;
  }
}

.studio-gallery .controls {
  display: none;
}

@media(min-width: 1280px) {
  .studio-gallery .controls {
    display: block;
  }

  .studio-gallery .controls :is(.prev, .next) svg {
    width: auto;
    height: 35px;
  }

  .studio-gallery .controls .prev {
    left: -35px;
  }

  .studio-gallery .controls .next {
    right: -35px;
  }
}

@media(min-width: 1536px) {
  .studio-gallery .controls .prev {
    left: -45px;
  }

  .studio-gallery .controls .next {
    right: -45px;
  }
}

.studio-gallery .swiper-slide {
  border-radius: var(--br);
  overflow: hidden;
}

.studio-gallery .swiper-slide img {
  width: 100%;
}

.studio-gallery .pagination {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-top: 1rem;
}

@media(min-width: 768px) {
  .studio-gallery .pagination {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media(min-width: 1024px) {
  .studio-gallery .pagination {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 0;
  }
}

@media(min-width: 1536px) {
  .studio-gallery .pagination {
    gap: 1rem;
  }
}

.studio-gallery .pagination>* {
  display: block;
  margin: 0 !important;
  border-radius: var(--br);
  overflow: hidden;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  transition: opacity var(--transition);
}

@media(min-width: 1024px) {
  .studio-gallery .pagination>* {
    aspect-ratio: 5 / 3;
  }
}

.studio-gallery .pagination>*:hover {
  opacity: 1;
}

.studio-gallery .pagination>*.swiper-pagination-bullet-active {
  background: unset;
}

.studio-gallery .pagination>* img {
  min-width: 100%;
  height: 100%;
}


/* --- Studio Info --- */
.studio-info .container {
  padding-top: 0;
}

.studio-info .grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem;
  row-gap: 1rem;
  margin-block: calc(var(--inner-spacing) * 2);
}

.studio-info .grid-item {
  display: flex;
  align-items: center;
  gap: 0.5em;
  font-size: 12px;
}

.studio-info .grid-item .icon {
  font-size: 1.75em;
}

@media(min-width: 400px) {
  .studio-info .grid {
    gap: 1rem;
  }

  .studio-info .grid-item .icon {
    font-size: 2em;
  }
}

@media(min-width: 480px) {
  .studio-info .grid-item {
    font-size: 16px;
  }
}

@media(min-width: 580px) {
  .studio-info .grid {
    column-gap: 2rem;
  }

  .studio-info .grid-item {
    min-width: 45%;
    font-size: 18px;
  }

  .studio-info .grid-item:nth-child(even) {
    justify-content: flex-end;
  }
}

@media(min-width: 736px) {
  .studio-info .grid {
    row-gap: 1.5rem;
  }
}

@media(min-width: 1024px) {
  .studio-info .grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .studio-info .grid-item {
    min-width: unset;
    font-size: 18px;
  }

  .studio-info .grid-item:nth-child(even) {
    justify-content: unset;
  }
}

@media(min-width: 1280px) {
  .studio-info .grid {
    row-gap: 2rem;
    grid-template-columns: repeat(4, 1fr);
  }
}


@media(min-width: 1536px) {
  .studio-info .grid {
    row-gap: 3rem;
  }

  .studio-info .grid-item {
    font-size: 20px;
  }
}


/* --- Legal Pages --- */
.legal-section {
  padding-top: 80px;
}

@media(min-width: 1280px) {
  .legal-section {
    padding-top: unset;
  }
}

.legal-section .title {
  margin-bottom: 2rem;
  font-weight: 700;
}

.legal-text-wrapper :is(h2, h3, h4) {
  font-weight: 700;
}

.legal-text-wrapper h2 {
  font-size: 1.25rem;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}

.legal-text-wrapper h3 {
  font-size: 1.125rem;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
}

.legal-text-wrapper h4 {
  margin-top: 0.5rem;
  margin-bottom: 0.25rem;
}

@media(min-width: 1024px) {
  .legal-text-wrapper h2 {
    font-size: 1.5rem;
  }

  .legal-text-wrapper h3 {
    font-size: 1.25rem;
  }

  .legal-text-wrapper h4 {
    font-size: 1.125rem;
  }
}

@media(min-width: 1536px) {
  .legal-text-wrapper h2 {
    font-size: 2rem;
  }

  .legal-text-wrapper h3 {
    font-size: 1.5rem;
  }

  .legal-text-wrapper h4 {
    font-size: 1.25rem;
  }
}

.legal-text-wrapper p+p {
  margin-top: 1rem;
}

.legal-text-wrapper ul {
  list-style: disc;
  list-style-position: inside;
  margin-block: 1rem;
}



/* --- Contact Form --- */
.contact-form .title {
  margin-bottom: var(--inner-spacing);
}

.contact-form .form-wrapper {
  padding: var(--card-padding);
  border-radius: var(--br);
  background-color: hsla(0, 0%, 100%, 10%);
  max-width: 600px;
  margin-inline: auto;
}

.form-wrapper form {
  display: grid;
  gap: var(--gap);
}

.form-wrapper .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--gap-sm);
}

@media (min-width: 1024px) {
  .form-wrapper .form-row.city {
    grid-template-columns: 1fr 3fr;
  }
}

.form-wrapper form .legals-text {
  padding-block: var(--gap);
}

.form-field :is(input, textarea) {
  width: 100%;
  padding: 0.75rem 1rem;
  border-radius: var(--br);
  border: 1px solid var(--color-7);
  background-color: transparent;
  color: var(--color-7);
  font-size: 1rem;
  transition: border-color var(--transition);
}

.form-field :is(input, textarea)::placeholder {
  color: var(--color-7);
}

.form-field :is(input, textarea):focus {
  outline: 0;
  border-color: var(--color-1);
}

.form-field.invalid :is(input, textarea) {
  border-color: var(--error);
}

.form-field textarea {
  resize: none;
}

.form-field .validation-text {
  display: none;
  margin-top: 0.5rem;
  color: var(--error);
}

.form-field.invalid .validation-text {
  display: block;
}

.form-wrapper .confirm-wrapper {
  height: 100%;
  min-height: 250px;
  display: grid;
  align-content: center;
  gap: var(--gap);
  text-align: center;
}


/* --- Mosaic Animation Section --- */
.mosaic-animation {
  overflow: hidden;
}

.mosaic-animation :is(.grid, .content) {
  display: grid;
  align-items: center;
  gap: var(--inner-spacing);
}

@media (min-width: 1024px) {
  .mosaic-animation .grid {
    grid-template-columns: 1fr 1fr;
  }
}

.mosaic-animation .content {
  justify-items: start;
}

.mosaic {
  --gap: 0.5rem;
  display: grid;
  gap: var(--gap);
  overflow: hidden;
}

@media (min-width: 1024px) {
  .mosaic {
    --gap: 0.75rem;
    order: 2;
    width: 125%;
    max-width: unset;
  }
}

@media (min-width: 1536px) {
  .mosaic {
    width: 150%;
  }
}

.mosaic-row {
  position: relative;
}

.mosaic-row::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(90deg, var(--color-4) 25%, transparent 40%, transparent 85%, var(--color-4) 100%);
}

.mosaic-row:nth-child(2)::before {
  background: linear-gradient(90deg, var(--color-4) 15%, transparent 30%, transparent 75%, var(--color-4) 90%);
}

.mosaic-row:nth-child(3)::before {
  background: linear-gradient(90deg, var(--color-4) 20%, transparent 35%, transparent 80%, var(--color-4) 95%);
}

.mosaic-row>div {
  display: flex;
  gap: var(--gap);
  animation: slide 10s infinite var(--easing, cubic-bezier(0.37, 0, 0.63, 1));
}

@keyframes slide {
  to {
    transform: translateX(var(--direction, calc(-100% - var(--gap))));
  }
}

.mosaic-row:nth-child(2)>div {
  --direction: calc(100% + var(--gap));
  --easing: cubic-bezier(0.65, 0, 0.35, 1);
  justify-content: flex-end;
}

.mosaic-row:nth-child(3)>div {
  --direction: calc(-100% - var(--gap));
  --easing: cubic-bezier(0.25, 0, 0.75, 1);
}

.mosaic-item {
  display: grid;
  flex: 0 0 calc(33.3333% - var(--gap) * (2/3));
}

.mosaic-item>* {
  aspect-ratio: 16 / 9;
  grid-column-start: 1;
  grid-row-start: 1;
  min-width: 100%;
  object-fit: cover;
  border-radius: var(--br);
}


.simple-headline.h1-section .container {
  padding: var(--card-padding);
}

.simple-headline .container {
  padding-bottom: var(--card-padding);
}

@media (min-width: 1280px) {
  .simple-headline .container {
    padding-top: 4rem;
  }
}

.simple-headline.custom-colors {
  background-color: var(--color-32);
}

.simple-headline.custom-colors .title {
  color: var(--color-33);
}

/* --- Trainings --- */
.trainings .grid-item {
  display: grid;
  gap: var(--inner-spacing-lg);
}

@media (min-width: 768px) {
  .trainings .grid-item {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }
}

@media (min-width: 768px) {
  .training-media-right .media {
    order: 2;
  }
}

.trainings .media {
  position: relative;
  border-radius: var(--br);
  overflow: hidden;
}

.trainings .media img {
  width: 100%;
}

.trainings .play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 0.5em;
  border: 0.25em solid var(--color-26);
  border-radius: 999vw;
  font-size: 2rem;
  color: var(--color-26);
}

@media (min-width: 1024px) {
  .trainings .play-btn {
    font-size: 3rem;
  }
}

.trainings .play-btn svg {
  transform: translateX(5%);
}

.trainings .content {
  display: grid;
  gap: var(--inner-spacing);
}


.trainings .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.trainings .button-wrapper .btn {
  width: 100%;
}

@media (min-width: 640px) {
  .trainings .button-wrapper {
    flex-direction: row;
  }

  .trainings .button-wrapper .btn {
    width: auto;
  }
}

@media (min-width: 768px) {
  .trainings .button-wrapper {
    flex-direction: column;
  }

  .trainings .button-wrapper .btn {
    width: 100%;
  }
}

@media (min-width: 1024px) {
  .trainings .button-wrapper {
    flex-direction: row;
  }

  .trainings .button-wrapper .btn {
    width: auto;
  }
}

.trainings.custom-colors {
  background-color: var(--color-30);
  color: var(--color-31);
}

.trainings.custom-colors :is(.title, .btn) {
  color: var(--color-31);
}

/* --- Text reveal --- */
.text-reveal {
  --timing: 2000ms;
  --delay: 1000ms;
}

.text-reveal .wrapper {
  position: relative;
  overflow: hidden;
  display: grid;
}

.text-reveal .wrapper>* {
  grid-column-start: 1;
  grid-row-start: 1;
}

.text-reveal .bg {
  min-height: 0;
  display: grid;
}

.text-reveal .bg img,
.text-reveal .bg video {
  height: 100%;
  min-width: 100%;
  grid-column-start: 1;
  grid-row-start: 1;
}

/* TODO: Work on animation, temporarly hide */
.text-reveal .text-wrapper {
  display: none;
}

.text-reveal .content {
  opacity: 1 !important;
  transform: none !important;
}

/* End of todo */

.text-reveal .text-wrapper {
  pointer-events: none;
}

.text-reveal .text-wrapper h2 {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 3rem;
  text-transform: uppercase;
  text-align: center;
  word-wrap: break-word;
  color: white;
  background-color: var(--color-4);
  mix-blend-mode: darken;
  font-weight: var(--headline-font-weight-1, 900);
  letter-spacing: var(--headline-letter-spacing, normal);
  transition: transform var(--timing) var(--ease-out-quart) var(--delay), opacity calc(var(--timing) / 2) var(--ease-out-quart) calc(var(--delay) + var(--timing) / 2);
  backface-visibility: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  transform: translateZ(0) perspective(1px);
}

@media (min-width: 768px) {
  .text-reveal .text-wrapper h2 {
    font-size: 4rem;
  }
}

@media (min-width: 1024px) {
  .text-reveal .text-wrapper h2 {
    font-size: 5rem;
  }
}

@media (min-width: 1280px) {
  .text-reveal .text-wrapper h2 {
    font-size: 6rem;
  }
}

@media (min-width: 1536px) {
  .text-reveal .text-wrapper h2 {
    font-size: 7rem;
  }
}

.animation .text-wrapper h2 {
  transform: scale(25) translateZ(0) perspective(1px);
  opacity: 0;
  transition: transform var(--timing) var(--ease-out-quart) var(--delay), opacity var(--timing) var(--ease-out-quart) var(--delay);
}

.text-reveal .content {
  z-index: 2;
  display: grid;
  align-content: center;
  gap: var(--inner-spacing);
  padding-inline: var(--container-p-inline);
  padding-block: calc(var(--inner-spacing) * 2);
  text-align: center;
  background: linear-gradient(transparent 5%, var(--color-4) 100%);
  opacity: 0;
  transform: translateY(2rem);
  transition: opacity 200ms var(--ease-out-quart) var(--delay), transform 200ms var(--ease-out-quart) var(--delay);
}

.text-reveal.no-gradient-overlay .content {
  background: transparent;
}

.animation .content {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 200ms var(--ease-out-quart) calc(var(--delay) + var(--timing) / 3), transform 200ms var(--ease-out-quart) calc(var(--delay) + var(--timing) / 3);
}

.text-reveal .content :is(.title, .h3, .btn) {
  color: var(--color-25);
}

.text-reveal .content .h3 {
  margin-top: 0.5em;
  font-weight: 400;
}

.text-reveal .button-wrapper {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 640px) {
  .text-reveal .button-wrapper {
    flex-direction: row;
    justify-content: center;
  }
}


/* --- Schedule --- */
.schedule .grid {
  display: grid;
  gap: var(--inner-spacing);
}

.course-plan-container {
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
}

.btn-wrapper {
  display: grid;
  gap: 1rem
}

.schedule-filter {
  border-bottom: 3px solid var(--color-1);
}

.schedule-filter .menu {
  overflow-x: auto;
  padding: 0;
  margin: 0;
  display: flex;
  max-width: 100%;
}

/* Hide scrollbar */
.schedule-filter .menu {
  scrollbar-width: none;
  /* For Firefox */
  -ms-overflow-style: none;
  /* For Internet Explorer and Edge */
}

.schedule-filter .menu::-webkit-scrollbar {
  display: none;
}

.schedule-filter .menu-link {
  padding: 0.75rem 1.5rem;
  min-width: 150px;
  color: black;
  white-space: nowrap;
  font-size: .875rem;
  gap: 2px;
}

.schedule-filter .menu-link.active,
.schedule-filter .menu-link:hover {
  color: var(--color-8);
  background: var(--color-4);
}

.schedule-filter .menu-link:focus {
  outline: 0;
}


.custom-dropdown-select {
  border: 0;
  position: relative;
}

.custom-dropdown-select .menu {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .1);
  border-radius: var(--br);
}

.custom-dropdown-select.open .menu {
  display: block;
}

.custom-dropdown-select .menu-link {
  width: 100%;
  cursor: pointer;
  background: var(--grey-1);
  white-space: normal;
}

.custom-dropdown-select .menu-link.active {
  position: relative;
}

.custom-dropdown-select .menu-link.active::after {
  position: absolute;
  content: "";
  top: 17px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: var(--color-8) transparent transparent transparent;
}

.custom-dropdown-select.open .menu-link.active::after {
  border-color: transparent transparent var(--color-8) transparent;
  top: 7px;
}

.custom-dropdown-select .filter-link.active::after {
  display: none;
}


.schedule-table {
  color: var(--color-7);
  text-align: center;
  display: grid;
  overflow: hidden;
  margin-top: 2rem;
  position: relative;
  isolation: isolate;
}

.schedule-table::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  /* background:
    linear-gradient(var(--color-4) 0 0) padding-box,
    conic-gradient(from 180deg at 50% 50%, #3F1F0F -28.12deg, #E3A455 26.25deg, #F6DBA6 88.12deg, #FFEBC4 156.58deg, #F0BE79 191.74deg, #8F653B 213.59deg, #673D22 225.95deg, #BA7F3B 255.19deg, #EEBC70 278.6deg, #3F1F0F 331.88deg, #E3A455 386.25deg) border-box;
  border: 2px solid transparent; */
  border: 2px solid var(--color-1);
  border-radius: var(--br);
}

.schedule-table::after {
  content: '';
  position: absolute;
  inset: 2px;
  z-index: -1;
  opacity: 0.25;
  /* background: url(/assets/images/waves-2.png) center center/cover; */
  border-radius: var(--br);
}

.schedule-table p {
  margin: 0;
}

.col-header {
  padding: 1rem;
  font-size: 1.125em;
  font-weight: var(--headline-font-weight-1, 900);
  text-transform: uppercase;
  filter: brightness(1.2);
}

.col-body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.schedule-table .col {
  position: relative;
}

.schedule-table .col+.col::after {
  content: '';
  position: absolute;
  top: 0;
  left: 5%;
  width: 90%;
  height: 1px;
  background: var(--color-7);
}

.col:last-of-type .col-body {
  border: 0;
}

.schedule-item {
  padding: 1rem;
  max-height: 150px;
  visibility: visible;
  opacity: 1;
  transition: all .3s;
  display: flex;
  flex-direction: column;
}

.schedule-item.inactive {
  visibility: hidden;
  max-height: 0;
  padding: 0 1rem;
  opacity: 0;
}

.schedule-item .time {
  opacity: 0.75;
  order: 2;
}

.schedule-item .event-title {
  font-weight: var(--headline-font-weight-1, 900);
  text-transform: uppercase;
}

.schedule-section .btn-with-icon .icon {
  position: relative;
  top: -1px;
}

.day-filter-item {
  visibility: visible;
  opacity: 1;
  transition: all .3s;
}

.day-filter-item.inactive {
  visibility: hidden;
  max-height: 0 !important;
  opacity: 0;
}

@media (min-width: 1024px) {
  .schedule .btn-wrapper {
    display: flex;
    justify-content: center;
    gap: 2rem;
  }

  .course-plan-container {
    max-width: 100%;
    margin: unset;
  }

  .schedule-table {
    grid-template-columns: repeat(7, 1fr);
  }

  .schedule-table .col+.col::after {
    top: 10%;
    left: 0;
    width: 1px;
    height: 80%;
  }

  .col-body {
    /* border-right: 1px solid var(--color-13); */
    grid-template-columns: 1fr;
    font-size: .75rem;
  }

  .schedule-section .btn-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }


  .schedule-section .xs-btn-full {
    left: unset;
    transform: unset;
  }
}

@media (min-width: 1280px) {
  .schedule-table {
    padding: calc(var(--inner-spacing) / 2);
  }

  .col-body {
    font-size: .875rem;
  }
}

@media (min-width: 1536px) {
  .col-body {
    font-size: 1rem;
  }
}


/* --- Courses Overview Section --- */
.courses-overview .cp-block-lg {
  padding-top: 0;
}

.courses-overview .grid {
  display: grid;
  gap: var(--inner-spacing);
  padding-inline: var(--c-padding);
}

.course-cards {
  --gap: 1rem;
  display: grid;
  gap: var(--gap);
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

@media (min-width: 1280px) {
  .course-cards {
    --gap: 1.5rem;
  }
}

.course-card {
  position: relative;
  isolation: isolate;
  border-radius: var(--br);
  overflow: hidden;
}

.course-card .card-pic {
  position: relative;
}

.course-card .card-pic img {
  width: 100%;
  aspect-ratio: 380 / 310;
}

.course-card .card-pic h3 {
  position: absolute;
  inset: auto 0 0 0;
  background: radial-gradient(93.53% 93.53% at 50% 50%, rgba(0, 0, 0, 0.88) 0%, #000000 100%);
  padding: 1rem;
  font-weight: 700;
  color: var(--color-24);
  transition: all 400ms var(--ease-out-quart);
}

.course-card .content {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  color: var(--color-24);
  background: radial-gradient(93.53% 93.53% at 50% 50%, rgba(0, 0, 0, 0.88) 0%, #000000 100%);
}

.course-card .content>div:first-child {
  padding: 1rem;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  flex: 1;
  min-height: 0;
}

.course-card .content>div:first-child h3 {
  font-weight: 700;
}

.course-card .content>div:first-child p {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.course-card .content .btn-wrapper {
  padding: 1rem;
  transform: translateY(-300%);
  transition: all 400ms var(--ease-out-quart);
}

.course-card .content .btn {
  color: var(--color-24);
}

.course-card .content {
  visibility: hidden;
  opacity: 0;
  transform: translateY(100%);
  transition: all 400ms var(--ease-out-quart);
}

.course-card:hover .content {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.course-card:hover .content .btn-wrapper {
  transform: translateY(0);
}

.course-card:hover .card-pic h3 {
  opacity: 0;
}

.course-card .custom-scrollbar {
  scrollbar-color: transparent var(--color-24);
}

.course-card .custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--color-24);
}

@supports (overflow: overlay) {
  .course-card .custom-scrollbar {
    overflow: overlay;
  }

  .course-card .custom-scrollbar::-webkit-scrollbar {
    width: 16px;
    height: 16px;
  }

  .course-card .custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 8px;
    border: 4px solid transparent;
    box-shadow: 4px 0px 0px 4px var(--color-24) inset;
  }
}


/* --- Job Offer --- */
.job-offer+.job-offer {
  border-top: 3px solid var(--color-1);
}

.job-offer .grid {
  display: grid;
  gap: var(--inner-spacing-lg);
}

.job-offer .img-wrapper img {
  border-radius: var(--br);
  aspect-ratio: 350 / 500;
  width: min(100%, 350px);
  margin-inline: auto;
}

.job-offer .locations {
  display: grid;
  gap: 1rem;
  justify-items: start;
}

.job-offer .locations li {
  border-radius: var(--br);
  background-color: var(--color-5);
  color: var(--color-4);
  padding: 0.25rem 0.5rem;
  font-weight: var(--headline-font-weight-1, 900);
  text-transform: uppercase;
}

.job-offer .title {
  margin-block: 1.5rem;
}

.job-offer .description ul {
  list-style: disc;
  list-style-position: inside;
  margin-block: 1rem;
}

.job-offer .button-wrapper {
  margin-top: var(--inner-spacing);
  display: grid;
  gap: 1rem;
}

.job-offer .button-wrapper p {
  text-align: center;
}

@media (min-width: 768px) {
  .job-offer .grid {
    grid-template-columns: 350px 1fr;
    align-items: center;
  }
}

@media (min-width: 1024px) {
  .job-offer .button-wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
  }

  .job-offer .button-wrapper p {
    text-align: left;
  }
}



/* --- Join Us --- */
.join-us {
  position: relative;
  isolation: isolate;
}

.join-us .bg-left,
.join-us .bg-right {
  display: none;
}

.join-us .bg-mobile .overlay {
  background: var(--color-4);
  opacity: 0.8;
}

.join-us .content {
  text-align: center;
  max-width: 640px;
  margin-inline: auto;
}

.join-us .title {
  text-transform: uppercase;
  margin-bottom: var(--inner-spacing);
}

.join-us .btn {
  margin-top: var(--inner-spacing);
}

@media (min-width: 768px) {
  .join-us .bg-mobile {
    display: none;
  }

  .join-us .bg-left,
  .join-us .bg-right {
    display: block;
    width: min(30%, 510px);
    height: min(100%, 628px);
    top: 50%;
    transform: translateY(-50%);
  }

  .join-us .bg-left {
    right: auto;
  }

  .join-us .bg-left .overlay {
    background: linear-gradient(180deg, var(--color-4) 1%, transparent 50%), radial-gradient(180% 75% at 0.00% 50.00%, transparent 0%, var(--color-4) 100%), linear-gradient(180deg, transparent 50%, var(--color-4) 99%), linear-gradient(90deg, transparent 50%, var(--color-4) 99%);
  }

  .join-us .bg-right {
    left: auto;
  }

  .join-us .bg-right .overlay {
    background: linear-gradient(180deg, var(--color-4) 1%, transparent 50%), radial-gradient(180% 75% at 100.00% 50.00%, transparent 0%, var(--color-4) 100%), linear-gradient(180deg, transparent 50%, var(--color-4) 99%), linear-gradient(-90deg, transparent 50%, var(--color-4) 99%);
  }

  .join-us .content {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}



/* --- Partners --- */
.partners .title {
  text-align: center;
  margin-bottom: var(--inner-spacing);
}

.partners .grid {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--inner-spacing-lg);
}

.partners .grid-item {
  max-width: 250px;
}


/* --- FAQ --- */
.faq .title {
  margin-bottom: var(--inner-spacing);
  text-align: center;
}

.faq-list-item {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}

.faq-list-item:last-child {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.faq-list-item .question {
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 1.5rem;
  transition: var(--transition);
}

.faq-list-item.active .question {
  padding-bottom: 1rem;
}

@media (max-width: 1279px) {
  .faq-list-item .question .h4 {
    font-size: 1.25rem;
  }
}

.faq-list-item .icon {
  flex-shrink: 0;
  transform: rotate(45deg);
  margin-top: 0.25rem;
  transition: var(--transition);
}

.faq-list-item.active .icon {
  transform: rotate(90deg);
}

@media (min-width: 1536px) {
  .faq-list-item .icon svg {
    width: 28px;
    height: 28px;
  }
}

.faq-list-item .answer {
  display: grid;
  grid-template-rows: 0fr;
  padding-bottom: 0;
  transition: var(--transition);
}

.faq-list-item.active .answer {
  grid-template-rows: 1fr;
  padding-bottom: 1.5rem;
}

.faq-list-item .answer>* {
  overflow: hidden;
}

.faq-2 .grid>div:first-child .faq-list-item:last-child {
  border-bottom: 0;
}

@media (min-width: 1280px) {
  .faq-2 .grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: start;
    column-gap: var(--gap-xl);
  }

  .faq-2 .grid>div:first-child .faq-list-item:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  }
}


/* --- Full Screen Menu --- */
.full-screen-menu {
  padding: 0;
  display: flex;
  flex-direction: column;
}

.full-screen-menu .modal-body {
  transform: translateY(0), translateX(-2rem);
  min-height: 0;
  width: 100%;
}

@media (min-width: 1280px) {
  .full-screen-menu {
    flex-direction: row;
  }

  .full-screen-menu .modal-body {
    transform: translateY(-2rem), translateX(0);
    min-width: 0;
  }
}

.full-screen-menu .grid {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (min-width: 1280px) {
  .full-screen-menu .grid {
    flex-direction: row;
  }
}

.full-screen-menu .grid-item {
  position: relative;
  display: flex;
  flex: 1;
  width: 100%;
  max-height: calc(100vh / 3);
  overflow: hidden;
  transform: translateX(-100%);
  opacity: 0;
  transition-property: transform, opacity;
  transition-duration: 200ms;
  transition-timing-function: var(--ease-out-quart);
  transition-delay: calc(50ms * var(--i, 1));
}

.full-screen-menu[data-state=open] .grid-item {
  transform: translate(0);
  opacity: 1;
}

@media (min-width: 1280px) {
  .full-screen-menu .grid-item {
    max-height: unset;
    max-width: calc(100vw / 3);
    height: 100vh;
    width: auto;
    transform: translateX(0);
    transform: translateY(-100%);
  }
}

.full-screen-menu .grid-item a {
  width: 100%;
  display: grid;
  text-decoration: none;
  transition: filter var(--transition);
}

@media (min-width: 1280px) {
  .full-screen-menu .grid-item a {
    filter: brightness(0.4);
  }

  .full-screen-menu .grid-item a:hover {
    filter: brightness(1);
  }
}

.full-screen-menu .grid-item a>* {
  grid-column-start: 1;
  grid-row-start: 1;
}

.full-screen-menu .grid-item img {
  width: 100%;
  min-height: 0;
  object-fit: cover;
  object-position: top center;
}

@media (min-width: 1280px) {
  .full-screen-menu .grid-item img {
    aspect-ratio: unset;
    width: 100%;
    height: 100%;
  }
}

.full-screen-menu .img-overlay {
  background: linear-gradient(transparent, black);
}

.full-screen-menu .grid-item h2 {
  margin-top: auto;
  padding: var(--card-padding);
  text-transform: uppercase;
  text-align: center;
  font-size: 1.25rem;
  font-weight: 700;
}

@media (min-width: 768px) {
  .full-screen-menu .grid-item h2 {
    font-size: 1.5rem;
  }
}

@media (min-width: 1536px) {
  .full-screen-menu .grid-item h2 {
    font-size: 2rem;
  }
}


/* Diagonal Transition */
.diagonal-transition {
  position: relative;
  height: var(--inner-spacing-lg);
  background-color: var(--bg-color-1, #fff);
}

.diagonal-transition>div {
  position: absolute;
  inset: 0;
  background-color: var(--bg-color-2, #000);
  clip-path: polygon(0 100%, 100% 0, 100% 100%, 0% 100%);
}

/* --- Locations --- */
.locations {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.locations .background {
  height: 200vw;
}

.locations .bg-desktop {
  display: none;
}

.locations .overlay {
  background: radial-gradient(66.66% 75% at 100.00% 10%, transparent 55%, var(--color-4) 100%),
    linear-gradient(var(--color-4) 0%, transparent 10%);
}

.locations .overlay::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--color-4);
  opacity: 0.5;
}

@media (min-width: 1024px) {

  .locations .background {
    height: unset;
  }

  .locations .bg-desktop {
    display: block;
    width: 50%;
    min-width: unset;
    left: auto;
  }

  .locations .bg-mobile {
    display: none;
  }

  .locations .overlay {
    background: linear-gradient(180deg, var(--color-4) 0%, transparent 16.70%),
      linear-gradient(180deg, transparent 39.58%, var(--color-4) 98.40%),
      radial-gradient(116.31% 54.76% at 98.59% 55.21%, transparent 54.96%, var(--color-4) 100%),
      linear-gradient(90deg, var(--color-4) 50.90%, transparent 79.60%);
  }
}

.locations .title {
  text-align: center;
  margin-bottom: var(--inner-spacing);
}


@media (min-width: 1280px) {
  .locations .title {
    text-align: left;
    max-width: 850px;
  }
}

@media (min-width: 1536px) {
  .locations .title {
    max-width: 1020px;
  }
}

.locations-slider-wrapper {
  position: relative;
}

@media (min-width: 1280px) {
  .locations-slider-wrapper {
    margin-right: 200px;
    margin-bottom: var(--inner-spacing-lg);
  }
}

@media (min-width: 1536px) {
  .locations-slider-wrapper {
    margin-right: 300px;
    margin-bottom: var(--container-p-block);
  }
}

.locations-slider {
  --swiper-scrollbar-bottom: 0;
  --swiper-scrollbar-sides-offset: 0%;
  position: relative;
  overflow: hidden;
  padding-bottom: 25px;
}

.locations-slider-wrapper .controls {
  display: flex;
  justify-content: center;
  margin-top: var(--inner-spacing);
}

@media (min-width: 1280px) {
  .locations-slider-wrapper .controls {
    position: absolute;
    top: -80px;
    right: -10px;
    margin-top: unset;
  }
}

@media (min-width: 1536px) {
  .locations-slider-wrapper .controls {
    top: -110px;
  }
}

.locations-slider-wrapper .controls :is(.prev, .next)[disabled] {
  opacity: 0.25;
}

.locations-slider-wrapper .controls :is(.prev, .next) svg {
  color: var(--color-1);
  width: 60px;
  height: 60px;
}

.locations .card {
  --color: black;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-radius: var(--br);
}

.locations .card::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-color: var(--color-34);
  opacity: 0.85;
}

.locations .card img {
  min-width: 100%;
  box-shadow: var(--s-1);
}

.locations .labels {
  position: absolute;
  inset: 0 0 auto 0;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  padding: var(--card-padding);
}

.locations .labels .logo svg {
  color: var(--color);
  height: 50px;
  width: auto;
}

.locations .label {
  padding: 0.5rem 0.75rem;
  color: white;
  background-color: var(--color);
  border-radius: var(--br);
  text-transform: uppercase;
  font-weight: 900;
}

.locations .card-content {
  padding: var(--card-padding);
  text-align: center;
}

.locations .card-content .flex {
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  text-transform: uppercase;
  font-size: 1.5rem;
  font-weight: 900;
  line-height: 1;
}

.locations .btn {
  margin-top: 1.5rem;
}



.c_logo img {
  display: none;
}

.c_logo p {
  position: relative;
}

.c_logo p::after {
  content: '';
  display: block;
  width: 150px;
  height: 36px;
  transform: translateX(-5px);
  background: url(https://app.fitmotion.cloud/img/logo_fitmotion_black.png);
  background-size: contain;
}



.background video {
  visibility: hidden;
}


.share-container .container,
.module-article .container {
  padding: 0;
}

@media (min-width: 1280px) {
  .share-container .container {
    grid-template-columns: 40% 60% !important;
  }
}