@import "https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@100..900&display=swap";
/* [project]/node_modules/slick-carousel/slick/slick.css [client] (css) */
.slick-slider {
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
  display: block;
  position: relative;
}

.slick-list {
  margin: 0;
  padding: 0;
  display: block;
  position: relative;
  overflow: hidden;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track, .slick-slider .slick-list {
  transform: translate3d(0, 0, 0);
}

.slick-track {
  margin-left: auto;
  margin-right: auto;
  display: block;
  position: relative;
  top: 0;
  left: 0;
}

.slick-track:before, .slick-track:after {
  content: "";
  display: table;
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none;
}

[dir="rtl"] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  border: 1px solid rgba(0, 0, 0, 0);
  height: auto;
  display: block;
}

.slick-arrow.slick-hidden {
  display: none;
}

/* [project]/node_modules/slick-carousel/slick/slick-theme.css [client] (css) */
.slick-loading .slick-list {
  background: #fff url("../media/ajax-loader.d5c1e833.gif") center no-repeat;
}

@font-face {
  font-family: slick;
  font-weight: normal;
  font-style: normal;
  src: url("../media/slick.3392c85e.eot");
  src: url("../media/slick.3392c85e.eot") format("embedded-opentype"), url("../media/slick.265d68e3.woff") format("woff"), url("../media/slick.31421072.ttf") format("truetype"), url("../media/slick.5f2cd927.svg") format("svg");
}

.slick-prev, .slick-next {
  cursor: pointer;
  color: rgba(0, 0, 0, 0);
  background: none;
  border: none;
  outline: none;
  width: 20px;
  height: 20px;
  padding: 0;
  font-size: 0;
  line-height: 0;
  display: block;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
  color: rgba(0, 0, 0, 0);
  background: none;
  outline: none;
}

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
  opacity: .25;
}

.slick-prev:before, .slick-next:before {
  opacity: .75;
  color: #fff;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: slick;
  font-size: 20px;
  line-height: 1;
}

.slick-prev {
  left: -25px;
}

[dir="rtl"] .slick-prev {
  left: auto;
  right: -25px;
}

.slick-prev:before {
  content: "←";
}

[dir="rtl"] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}

[dir="rtl"] .slick-next {
  left: -25px;
  right: auto;
}

.slick-next:before {
  content: "→";
}

[dir="rtl"] .slick-next:before {
  content: "←";
}

.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  text-align: center;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: block;
  position: absolute;
  bottom: -25px;
}

.slick-dots li {
  cursor: pointer;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  display: inline-block;
  position: relative;
}

.slick-dots li button {
  cursor: pointer;
  color: rgba(0, 0, 0, 0);
  background: none;
  border: 0;
  outline: none;
  width: 20px;
  height: 20px;
  padding: 5px;
  font-size: 0;
  line-height: 0;
  display: block;
}

.slick-dots li button:hover, .slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  content: "•";
  text-align: center;
  opacity: .25;
  color: #000;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 20px;
  height: 20px;
  font-family: slick;
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
}

.slick-dots li.slick-active button:before {
  opacity: .75;
  color: #000;
}

/* [project]/src/styles/globals.scss.css [client] (css) */
:root {
  --background: #fff;
  --foreground: #171717;
}

html, body {
  max-width: 100vw;
  overflow-x: hidden;
}

body {
  color: var(--foreground);
  background: var(--light-primary-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: Noto Sans Arabic, sans-serif;
}

body[dir="rtl"] {
  float: right;
}

body .text-rtl {
  text-align: right;
  direction: rtl;
}

body::-webkit-scrollbar {
  width: 0;
}

body::-webkit-scrollbar-track {
  background: var(--white-color);
  border-radius: 10px;
}

body::-webkit-scrollbar-thumb {
  background: var(--primary-color);
  border-radius: 10px;
}

body .main-content {
  place-items: center;
  width: 100%;
  height: 100vh;
  display: grid;
}

body .layout-container {
  scroll-behavior: smooth;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0;
  display: flex;
  position: relative;
  overflow-x: hidden;
  overflow-y: auto;
}

body .layout-container::-webkit-scrollbar {
  width: 0;
}

body .layout-container::-webkit-scrollbar-track {
  background: var(--white-color);
  border-radius: 10px;
}

body .layout-container::-webkit-scrollbar-thumb {
  background: var(--primary-color);
  border-radius: 10px;
}

body .layout-container.component-layout:before {
  content: "";
  z-index: 9;
  background-color: rgba(0, 0, 0, .2);
  width: 100%;
  height: 100%;
  transition: all .3s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
}

body .layout-container .home-page {
  width: 100%;
  margin: 15vh auto 0;
}

body .layout-container .home-page .app-intro {
  text-align: center;
  background: var(--white-color);
  width: 100%;
  padding: 2vh;
  position: relative;
}

body .layout-container .home-page .app-intro:before {
  content: "";
  clip-path: ellipse(50% 50% at 50% 90%);
  background: var(--white-color);
  z-index: -1;
  width: 100%;
  height: 20vh;
  position: absolute;
  top: -22%;
  left: 0;
}

body .layout-container .home-page .app-intro:after {
  content: "";
  clip-path: ellipse(50% 50% at 50% 10%);
  background: var(--white-color);
  z-index: -1;
  width: 100%;
  height: 20vh;
  position: absolute;
  bottom: -22%;
  left: 0;
}

body .layout-container .home-page .app-intro .inner-content {
  text-align: center;
}

body .layout-container .home-page .app-intro .inner-content .section-title {
  color: var(--secondary-color);
  text-transform: uppercase;
  margin-bottom: 5vh;
  font-size: 6vh;
  font-weight: 600;
  line-height: 1;
}

body .layout-container .home-page .app-intro .inner-content p {
  width: 100%;
  max-width: 40vw;
  color: var(--secondary-color);
  margin: 0 auto 5vh;
  font-size: 2vh;
  font-weight: 600;
}

body .layout-container .home-page .app-intro .inner-content .youtube-video {
  border: 1vh solid var(--primary-color);
  border-radius: 5vh;
  width: 100%;
  max-width: 55rem;
  height: 55vh;
  max-height: 55vh;
}

body .layout-container .home-page .speakers-section {
  text-align: center;
  width: 100%;
  padding: 10vh 2vh 2vh;
  position: relative;
}

body .layout-container .home-page .speakers-section:before {
  content: "";
  z-index: -5;
  background-image: url("../media/bg-1.be8481d4.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

body .layout-container .home-page .speakers-section .inner-content {
  text-align: center;
}

body .layout-container .home-page .speakers-section .inner-content .section-title {
  color: var(--white-color);
  text-transform: uppercase;
  margin: 5vh 0;
  font-size: 6vh;
  font-weight: 600;
  line-height: 1;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list {
  justify-content: center;
  align-items: center;
  gap: 4vh;
  width: 100%;
  margin: 8vh 0 10vh;
  display: flex;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
  border-radius: 2vh;
  width: 100%;
  max-width: 250px;
  height: 330px;
  position: relative;
  overflow: hidden;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name {
  z-index: 1;
  background: var(--white-color);
  width: 100%;
  padding: 3vh;
  position: absolute;
  bottom: 0;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name:before {
  content: "";
  clip-path: ellipse(60% 50% at 50% 100%);
  background: var(--white-color);
  width: 100%;
  height: 15vh;
  position: absolute;
  bottom: 55%;
  left: 0;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name h2 {
  color: var(--primary-color);
  text-transform: uppercase;
  z-index: 2;
  margin: 0;
  font-size: 2vh;
  font-weight: 600;
  line-height: 1;
  position: relative;
}

body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-button {
  z-index: 100;
  background: var(--white-color);
  color: var(--primary-color);
  border-radius: 1vh;
  padding: 2vh 1vh;
  transition: all .3s ease-in-out;
  position: absolute;
  bottom: -2vh;
  right: 0;
}

body .layout-container .home-page .about-us {
  background: var(--white-color);
  width: 100%;
  padding: 8vh 2vh;
  position: relative;
}

body .layout-container .home-page .about-us .inner-content .section-title {
  color: var(--secondary-color);
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 6vh;
  font-size: 6vh;
  font-weight: 600;
  line-height: 1;
}

body .layout-container .home-page .about-us .inner-content p {
  width: 100%;
  color: var(--secondary-color);
  margin: 0 auto 2vh;
  font-size: 2vh;
  font-weight: 600;
}

body .layout-container .home-page .about-us .inner-content .youtube-video {
  border: 1vh solid var(--primary-color);
  border-radius: 5vh;
  width: 100%;
  max-width: 80vw;
  height: 60vh;
  max-height: 60vh;
}

body .layout-container .home-page .faq-section {
  text-align: center;
  background: #e9ffe9;
  width: 100%;
  padding: 8vh 2vh;
  position: relative;
}

body .layout-container .home-page .faq-section .inner-content .section-title {
  color: var(--secondary-color);
  text-transform: uppercase;
  margin-bottom: 6vh;
  font-size: 6vh;
  font-weight: 600;
  line-height: 1;
}

body .layout-container .home-page .faq-section .inner-content .faq-list {
  flex-direction: column;
  gap: 2vh;
  width: 100%;
  max-width: 750px;
  margin: 0 auto 4vh;
  display: flex;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordion-root {
  margin: 0;
}

body .layout-container .home-page .faq-section .inner-content .faq-summary {
  padding: 2vh 3vh;
}

body .layout-container .home-page .faq-section .inner-content .faq-summary p {
  color: var(--secondary-color);
  margin: 0;
  font-size: 2.5vh;
  font-weight: 600;
}

body .layout-container .home-page .faq-section .inner-content .faq-summary.Mui-expanded p {
  color: var(--secondary-color);
  font-size: 2.5vh;
  font-weight: 600;
}

body .layout-container .home-page .faq-section .inner-content .MuiSvgIcon-root {
  width: 4vh;
  height: 4vh;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordion-root {
  background-color: var(--white-color);
  overflow: hidden;
  box-shadow: 0 8px 16px rgba(0, 0, 0, .08);
  border-radius: 2vh !important;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordion-root:before {
  display: none;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordionSummary-root {
  min-height: 6vh;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordionSummary-content, body .layout-container .home-page .faq-section .inner-content .MuiAccordionSummary-content.Mui-expanded {
  margin: 1.5vh 2vh !important;
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordionSummary-expandIconWrapper svg {
  color: var(--primary-color);
}

body .layout-container .home-page .faq-section .inner-content .MuiAccordionDetails-root {
  text-align: left;
  color: var(--secondary-color);
  padding: 2vh 3vh;
  font-size: 2.5vh;
  font-weight: 500;
}

body .layout-container .home-page .faq-section .inner-content .faq-more-btn {
  color: var(--white-color);
  cursor: pointer;
  background: linear-gradient(to right, #18a558 0%, #0f8b45 100%);
  border: none;
  border-radius: 5vh;
  justify-content: center;
  align-items: center;
  padding: 1.4vh 6vh;
  font-size: 2.2vh;
  font-weight: 700;
  transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
  display: inline-flex;
  box-shadow: 0 6px 12px rgba(0, 128, 64, .35);
}

body .layout-container .home-page .faq-section .inner-content .faq-more-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 16px rgba(0, 128, 64, .45);
}

body #chat-modal .MuiDialog-container {
  width: 100%;
  max-width: 450px;
  margin: 0 auto;
}

body #chat-modal .MuiPaper-root {
  width: 100%;
  max-width: 90%;
  height: 100%;
  max-height: 70%;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container {
  flex-direction: column;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  height: 100%;
  display: flex;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content {
  border: 1px solid var(--border-color);
  border-radius: 8px;
  height: 100%;
  padding: 10px;
  overflow-y: auto;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content .message-item {
  gap: 10px;
  width: 100%;
  display: flex;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content .message-item.my-message {
  text-align: right;
  flex-direction: row-reverse;
  justify-content: end;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content .message-item.other-message {
  text-align: left;
  justify-content: flex-start;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content .message-item .message-username {
  color: var(--primary-color);
  font-size: 12px;
  font-weight: 600;
}

body #chat-modal .MuiPaper-root .custom-modal-content .chat-messages-container .messages-content .message-item .message-text {
  background-color: var(--border-color);
  border-radius: 8px;
  padding: 5px 10px;
  font-size: 14px;
}

body #exit-game-modal .MuiDialog-container {
  width: 100%;
  max-width: 450px;
  margin: 0 auto;
}

body #exit-game-modal .MuiPaper-root {
  width: 100%;
  max-width: 90%;
}

body #exit-game-modal .wrapper-container .wrapper-header .wrapper-header-icon {
  background: linear-gradient(to right, #e47e6d 0%, #b31c02 100%);
}

body #exit-game-modal .exit-game-message {
  color: var(--error-color);
  text-align: center;
  font-size: 2vh;
}

body #exit-game-modal button {
  width: 100%;
  color: var(--white-color);
  text-transform: none;
  background: linear-gradient(to right, #e47e6d 0%, #b31c02 100%);
  border: none;
  border-radius: 5vh;
  padding: 1.2vh 2vh;
  font-family: Noto Sans Arabic, sans-serif;
  font-size: 2.5vh;
  font-weight: 700;
  transition: all .3s ease-in-out;
}

body #exit-game-modal button:hover {
  box-shadow: 0 5px 5px rgba(175, 76, 76, .41);
}

body .subcategory-info-modal .MuiDialog-container {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
}

body .subcategory-info-modal .MuiPaper-root {
  width: 100%;
  max-width: calc(100% - 20px);
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content {
  padding: 20px;
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content .subcategory-info-content {
  flex-direction: column;
  align-items: center;
  gap: 20px;
  display: flex;
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content .subcategory-info-content .subcategory-info-image {
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
  border-radius: 12px;
  width: 100%;
  max-width: 300px;
  height: auto;
  overflow: hidden;
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content .subcategory-info-content .subcategory-info-image img {
  object-fit: cover;
  width: 100%;
  height: auto;
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content .subcategory-info-content .subcategory-info-description {
  text-align: center;
  width: 100%;
}

body .subcategory-info-modal .MuiPaper-root .custom-modal-content .subcategory-info-content .subcategory-info-description p {
  color: var(--text-color, #333);
  background-color: var(--secondary-100, #f5f5f5);
  border-radius: 8px;
  margin: 0;
  padding: 15px;
  font-size: 16px;
  line-height: 1.6;
}

body .action-button-tooltip {
  color: var(--white-color) !important;
  text-align: center !important;
  background-color: #f6b400 !important;
  border-radius: 99px !important;
  padding: .3vh 1vh !important;
  font-size: 1.2vh !important;
  font-weight: 600 !important;
}

body .action-button-tooltip-arrow {
  color: #f6b400 !important;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

a {
  color: inherit;
  text-decoration: none !important;
}

a:focus-visible {
  outline: none;
}

div:focus-visible {
  outline: none;
}

span:focus-visible {
  outline: none;
}

p:focus-visible {
  outline: none;
}

img:focus-visible {
  outline: none;
}

.animate-spin {
  animation: 1s linear infinite spin;
}

.speed {
  animation: .8s linear infinite spin;
}

@keyframes spin {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  body .layout-container .home-page .app-intro .inner-content .section-title {
    margin-bottom: 4.5vh;
    font-size: 5.5vh;
  }

  body .layout-container .home-page .app-intro .inner-content p {
    max-width: 50vw;
    font-size: 1.8vh;
  }

  body .layout-container .home-page .speakers-section {
    padding: 13vh 2vh 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .section-title {
    margin: 4.5vh 0;
    font-size: 5.5vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list {
    margin: 6vh 0 8vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
    border-radius: 1.5vh;
    max-width: 240px;
    height: 300px;
  }

  body .layout-container .home-page .about-us {
    padding: 7.5vh 3vh;
  }

  body .layout-container .home-page .about-us .inner-content .section-title {
    margin-bottom: 4vh;
    font-size: 5.5vh;
  }

  body .layout-container .home-page .faq-section {
    padding: 7.5vh 3vh;
  }

  body .layout-container .home-page .faq-section .inner-content .section-title {
    margin-bottom: 4vh;
    font-size: 5.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list {
    max-width: 700px;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root {
    border-radius: 1.5vh !important;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root {
    min-height: 5.5vh;
    padding: 1.8vh 2.8vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root p {
    font-size: 2.2vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root {
    padding: 1vh 2.8vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root p {
    font-size: 2.2vh;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  body .layout-container .home-page .app-intro {
    padding: 1vh 2vh;
  }

  body .layout-container .home-page .app-intro:before {
    clip-path: ellipse(52% 50% at 50% 90%);
    top: -28%;
  }

  body .layout-container .home-page .app-intro:after {
    clip-path: ellipse(52% 50% at 50% 10%);
    bottom: -25%;
  }

  body .layout-container .home-page .app-intro .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 5vh;
  }

  body .layout-container .home-page .app-intro .inner-content p {
    max-width: 50vw;
    font-size: 1.6vh;
  }

  body .layout-container .home-page .app-intro .inner-content .youtube-video {
    max-width: 50rem;
    max-height: 50vh;
  }

  body .layout-container .home-page .speakers-section {
    padding: 15vh 2vh 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .section-title {
    margin: 3vh 0 0;
    font-size: 5vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list {
    gap: 3.5vh;
    margin: 5vh 0 6.5vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
    border-radius: 1.5vh;
    max-width: 220px;
    height: 280px;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name {
    padding: 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name h2 {
    font-size: 1.8vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name:before {
    height: 13vh;
    bottom: 60%;
  }

  body .layout-container .home-page .about-us {
    padding: 7vh 2vh;
  }

  body .layout-container .home-page .about-us .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 5vh;
  }

  body .layout-container .home-page .about-us .inner-content p {
    font-size: 1.8vh;
  }

  body .layout-container .home-page .faq-section {
    padding: 7vh 2vh;
  }

  body .layout-container .home-page .faq-section .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list {
    max-width: 650px;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root {
    border-radius: 1.5vh !important;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root {
    min-height: 5.5vh;
    padding: 1.5vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root p {
    font-size: 2vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root {
    padding: 1vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root p {
    font-size: 2vh;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  body .layout-container .home-page .app-intro {
    padding: 1vh 2vh;
  }

  body .layout-container .home-page .app-intro:before {
    clip-path: ellipse(55% 50% at 50% 90%);
    top: -25%;
  }

  body .layout-container .home-page .app-intro:after {
    clip-path: ellipse(55% 50% at 50% 10%);
    bottom: -25%;
  }

  body .layout-container .home-page .app-intro .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4.5vh;
  }

  body .layout-container .home-page .app-intro .inner-content p {
    max-width: 70vw;
    font-size: 1.8vh;
  }

  body .layout-container .home-page .app-intro .inner-content .youtube-video {
    border-radius: 4.5vh;
    max-width: 50rem;
    max-height: 48vh;
  }

  body .layout-container .home-page .speakers-section {
    padding: 13vh 2vh 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .section-title {
    margin: 3vh 0 0;
    font-size: 4.5vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list {
    gap: 3.5vh;
    margin: 6vh 0 7vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
    border-radius: 1.5vh;
    max-width: 200px;
    height: 260px;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name {
    padding: 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name h2 {
    font-size: 1.8vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name:before {
    height: 10vh;
    bottom: 60%;
  }

  body .layout-container .home-page .about-us {
    padding: 7vh 2vh;
  }

  body .layout-container .home-page .about-us .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4.5vh;
  }

  body .layout-container .home-page .about-us .inner-content p {
    font-size: 1.8vh;
  }

  body .layout-container .home-page .faq-section {
    padding: 7vh 2vh;
  }

  body .layout-container .home-page .faq-section .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list {
    max-width: 600px;
    margin: 0 auto 3vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root {
    border-radius: 1.5vh !important;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root {
    min-height: 5.5vh;
    padding: 1.5vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root p {
    font-size: 1.8vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root {
    padding: 1vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root p {
    font-size: 1.8vh;
  }
}

@media (min-width: 576px) and (max-width: 767px) {
  body .layout-container .home-page {
    margin: 13vh auto 0;
  }

  body .layout-container .home-page .app-intro {
    padding: 1vh 2vh;
  }

  body .layout-container .home-page .app-intro:before {
    clip-path: ellipse(60% 50% at 50% 90%);
    top: -20%;
  }

  body .layout-container .home-page .app-intro:after {
    clip-path: ellipse(60% 50% at 50% 10%);
    bottom: -20%;
  }

  body .layout-container .home-page .app-intro .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .app-intro .inner-content .section-title {
    margin-top: 4vh;
    margin-bottom: 4vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .app-intro .inner-content p {
    max-width: 70vw;
    font-size: 1.6vh;
  }

  body .layout-container .home-page .app-intro .inner-content .youtube-video {
    border: .5vh solid var(--primary-color);
    border-radius: 4vh;
    max-width: 100%;
    max-height: 45vh;
  }

  body .layout-container .home-page .speakers-section {
    padding: 8vh 2vh 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .speakers-section .inner-content .section-title {
    margin: 3vh 0 0;
    font-size: 4vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list {
    gap: 3.5vh;
    margin: 5vh 0 6vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
    border-radius: 1.5vh;
    max-width: 170px;
    height: 230px;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name {
    padding: 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name h2 {
    font-size: 1.6vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name:before {
    height: 9vh;
    bottom: 60%;
  }

  body .layout-container .home-page .about-us {
    padding: 6vh 2vh;
  }

  body .layout-container .home-page .about-us .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .about-us .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .about-us .inner-content p {
    font-size: 1.5vh;
  }

  body .layout-container .home-page .faq-section {
    padding: 6vh 2vh;
  }

  body .layout-container .home-page .faq-section .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .faq-section .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list {
    max-width: 85%;
    margin: 0 auto 3vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root {
    border-radius: 1.2vh !important;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root {
    min-height: 5.5vh;
    padding: 1.5vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root p {
    font-size: 1.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root {
    padding: 1vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root p {
    font-size: 1.5vh;
  }
}

@media (min-width: 320px) and (max-width: 575px) {
  body .layout-container .home-page {
    margin: 13vh auto 0;
  }

  body .layout-container .home-page .app-intro {
    padding: 1vh 2vh;
  }

  body .layout-container .home-page .app-intro:before {
    clip-path: ellipse(60% 50% at 50% 90%);
    height: 15vh;
    top: -20%;
  }

  body .layout-container .home-page .app-intro:after {
    clip-path: ellipse(60% 50% at 50% 10%);
    height: 15vh;
    bottom: -20%;
  }

  body .layout-container .home-page .app-intro .inner-content {
    max-width: 100%;
    padding: 0;
  }

  body .layout-container .home-page .app-intro .inner-content .section-title {
    margin-top: 4vh;
    margin-bottom: 4vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .app-intro .inner-content p {
    max-width: 70vw;
    font-size: 1.6vh;
  }

  body .layout-container .home-page .app-intro .inner-content .youtube-video {
    border: .5vh solid var(--primary-color);
    border-radius: 3vh;
    max-width: 100%;
    max-height: 35vh;
  }

  body .layout-container .home-page .speakers-section {
    padding: 7vh 2vh 2vh;
  }

  body .layout-container .home-page .speakers-section .inner-content {
    max-width: 100%;
    padding: 0;
  }

  body .layout-container .home-page .speakers-section .inner-content .section-title {
    margin: 3vh 0 0;
    font-size: 4vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list {
    gap: 2vh;
    margin: 5vh 0 6vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider {
    max-width: 100%;
    margin: 5vh auto 6vh;
    padding: 0;
    position: relative;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider {
    width: 100%;
    position: relative;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-list {
    margin: 0 auto;
    padding: 0;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-track {
    align-items: center;
    display: flex;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-slide {
    margin: 0;
    padding: 0;
    width: 100% !important;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-slide > div {
    justify-content: center;
    width: 100%;
    display: flex;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-dots {
    width: 100%;
    position: absolute;
    bottom: -4vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-dots li button:before {
    color: var(--white-color);
    opacity: .5;
    font-size: 12px;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-dots li.slick-active button:before {
    opacity: 1;
    color: var(--primary-color);
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-arrow {
    z-index: 10;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-arrow:before {
    color: var(--white-color);
    opacity: .9;
    font-size: 24px;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-arrow:hover:before {
    opacity: 1;
    color: var(--primary-color);
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-arrow.slick-prev {
    left: 0;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list.speakers-slider .slick-slider .slick-arrow.slick-next {
    right: 0;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item {
    border-radius: 1.5vh;
    width: 170px;
    max-width: 170px;
    height: 220px;
    margin: 0 auto;
    display: block !important;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name {
    padding: 1.5vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name h2 {
    font-size: 1.6vh;
  }

  body .layout-container .home-page .speakers-section .inner-content .speakers-list .speaker-item .speaker-name:before {
    height: 8vh;
    bottom: 60%;
  }

  body .layout-container .home-page .about-us {
    padding: 6vh 2vh;
  }

  body .layout-container .home-page .about-us .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .about-us .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .about-us .inner-content p {
    font-size: 1.5vh;
  }

  body .layout-container .home-page .faq-section {
    padding: 6vh 2vh;
  }

  body .layout-container .home-page .faq-section .inner-content {
    max-width: 100%;
  }

  body .layout-container .home-page .faq-section .inner-content .section-title {
    margin-bottom: 3vh;
    font-size: 4vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list {
    max-width: 95%;
    margin: 0 auto 3vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root {
    border-radius: 1.2vh !important;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root {
    min-height: 5.5vh;
    padding: 1.5vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiAccordionSummary-root p {
    font-size: 1.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root {
    padding: 1vh 2.5vh;
  }

  body .layout-container .home-page .faq-section .inner-content .faq-list .MuiAccordion-root .MuiCollapse-root .MuiAccordionDetails-root p {
    font-size: 1.5vh;
  }
}

