@charset "UTF-8";

:root {

  --mode: #fff;

  --text: #1d1f1f;

  --text2: #626c83;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-Thin.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-Thin.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-Thin.ttf") format("truetype");

  font-weight: 100;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-ExtraLight.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-ExtraLight.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-ExtraLight.ttf") format("truetype");

  font-weight: 200;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-Light.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-Light.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-Light.ttf") format("truetype");

  font-weight: 300;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-Regular.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-Regular.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-Regular.ttf") format("truetype");

  font-weight: normal;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-SemiBold.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-SemiBold.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-SemiBold.ttf") format("truetype");

  font-weight: 600;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-Medium.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-Medium.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-Medium.ttf") format("truetype");

  font-weight: 500;

  font-style: normal;

  font-display: swap;

}



@font-face {

  font-family: "IBM";

  src: url("../fonts/IBM/IBMPlexSansArabic-Bold.woff2") format("woff2"),

    url("../fonts/IBM/IBMPlexSansArabic-Bold.woff") format("woff"),

    url("../fonts/IBM/IBMPlexSansArabic-Bold.ttf") format("truetype");

  font-weight: bold;

  font-style: normal;

  font-display: swap;

}



html {

  scrollbar-width: thin;

  scrollbar-color: #035245 #edf8f6;

  scroll-behavior: unset !important;

}



body {

  font-family: IBM;

  font-weight: 400;

  color: var(--text);

  background-color: var(--mode);

}



body.darkMode {

  --mode: #1c1f26;

  --text: #fff;

  --text2: #96a0b6;

}



body::-webkit-scrollbar {

  background-color: #edf8f6;

  width: 4px;

  border-radius: 3px;

}



body::-webkit-scrollbar-thumb {

  background-color: #035245;

  border-radius: 3px;

}



.overflow {

  overflow: hidden;

}



.container {

  --bs-gutter-x: 30px;

}



@media (min-width: 1200px) {

  .container {

    max-width: 1200px;

  }

}



/* General Resets */

* {

  outline: 0 !important;

}



input::-moz-placeholder {

  color: inherit;

}



input::placeholder {

  color: inherit;

}



a,

a:hover,

a:focus {

  text-decoration: none;

  color: inherit;

}



button {

  border: none;

  background: none;

  outline: 0;

}



a,

img,

button,

input,

select {

  transition: all 0.3s ease;

}



iframe,

img {

  max-width: 100% !important;

}



[role="button"] {

  cursor: pointer;

}



ul {

  /*list-style: none;*/

  /*margin: 0;*/

  /*padding: 0;*/

}



input {

  -moz-appearance: textfield;

}



input::-webkit-outer-spin-button,

input::-webkit-inner-spin-button {

  -webkit-appearance: none;

  margin: 0;

}



input::-ms-clear {

  display: none;

  width: 0;

  height: 0;

}



input::-ms-reveal {

  display: none;

  width: 0;

  height: 0;

}



input::-webkit-search-decoration,

input::-webkit-search-cancel-button,

input::-webkit-search-results-button,

input::-webkit-search-results-decoration {

  display: none;

}



input::-webkit-inner-spin-button,

input::-webkit-calendar-picker-indicator {

  display: none;

  -webkit-appearance: none;

}



select {

  -webkit-appearance: none;

  -moz-appearance: none;

  appearance: none;

}



.fa-linkedin::before {

  content: "\f0e1";

}



.fa-twitter::before {

  content: "\e61b";

}



.fa-facebook::before {

  content: "\f39e";

}



.lazy-img-parent img {

  transition: all 0.3s ease-in-out;

}



.loading-img {

  position: relative;

  overflow: hidden;

  background-repeat: no-repeat;

  background-size: cover;

  display: inline-block;

  position: relative;

}



.loading-img img {

  opacity: 0 !important;

  filter: blur(40px);

}



.loaded-img img {

  opacity: 1;

  filter: blur(0);

}



.section-title {

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 14px 15px;

  font-size: 32px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.3125;

  text-transform: capitalize;

  margin: 0 0 40px;

}



@media (max-width: 767px) {

  .section-title {

    font-size: 28px;

    gap: 10px;

    margin-bottom: 25px;

  }

}



.section-title.title-start {

  align-items: flex-start;

  margin-bottom: 15px;

}



.section-title.title-row {

  flex-direction: row;

}



.section-title::before {

  content: "";

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 42px;

  aspect-ratio: 42/39;

  opacity: 0.3;

}



@media (max-width: 767px) {

  .section-title::before {

    width: 32px;

  }

}



.darkMode .section-title::before {

  filter: brightness(0) invert(1);

}



.productServices-section .section-title {

  margin-bottom: 30px;

}



@media (max-width: 767px) {

  .productServices-section .section-title {

    margin-bottom: 25px;

  }

}



.main-btn {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 40px;

  border-radius: 25px;

  width: -moz-max-content;

  width: max-content;

  padding: 0 20px;

  font-size: 14px;

  font-weight: 500;

  color: #fff;

  background-color: #035245;

  text-transform: capitalize;

  transition: all 0.3s ease-in-out;

}



.main-btn:hover {

  background-color: #bf1e2e;

  color: #fff;

}



.swiper-tools {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  margin-top: 30px;

}



@media (max-width: 767px) {

  .swiper-tools {

    gap: 20px;

  }

}



.swiper-tools .swiper-pagination {

  position: relative;

  inset: unset;

  display: flex;

  align-items: center;

  justify-content: center;

  width: auto;

  gap: 10px;

}



@media (max-width: 767px) {

  .swiper-tools .swiper-pagination {

    gap: 8px;

    display: none;

  }

}



.swiper-tools .swiper-pagination .swiper-pagination-bullet {

  margin: 0;

  background-color: #035245;

  opacity: 0.3;

  height: 8px;

  width: 20px;

  border-radius: 12px;

  transition: opacity 0.3s ease-in-out;

}



.swiper-tools

  .swiper-pagination

  .swiper-pagination-bullet.swiper-pagination-bullet-active {

  opacity: 1;

}



.darkMode .swiper-tools .swiper-pagination .swiper-pagination-bullet {

  background-color: #fff;

}



@media (max-width: 767px) {

  .swiper-tools .swiper-pagination .swiper-pagination-bullet {

    width: 8px;

  }

}



.swiper-tools .swiper-btn {

  width: 56px;

  height: 56px;

  border: 2px solid #035245;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: transparent;

  fill: #035245;

  cursor: pointer;

  transition: 0.3s ease-in-out;

  transition-property: fill, background-color;

}



.swiper-tools .swiper-btn:hover {

  fill: #fff;

  background-color: #035245;

}



@media (max-width: 767px) {

  .swiper-tools .swiper-btn {

    width: 40px;

    height: 40px;

  }

}



html[dir="ltr"] .swiper-tools .swiper-btn svg {

  transform: scaleX(-1);

}



.darkMode .swiper-tools .swiper-btn {

  border: 2px solid #fff;

  fill: #fff;

}



.darkMode .swiper-tools .swiper-btn:hover {

  fill: #035245;

  background-color: #fff;

}



.swiper-tools:has(.swiper-pagination-bullet:only-child) {

  display: none;

}



.productServices-slider .swiper-tools {

  display: none;

}



@media (max-width: 991px) {

  .productServices-slider .swiper-tools {

    display: flex;

  }

}



.hero-section {

  position: relative;

  overflow: hidden;

  --height: 80vh;

  --min-height: 540px;

  --header: 160px;

}



@media (max-width: 991px) {

  .hero-section {

    --header: 82px;

  }

}



@media (max-width: 767px) {

  .hero-section {

    --header: 105px;

    --height: 80vh;

  }

}



.hero-section .pattern {

  position: absolute;

  bottom: 50px;

  inset-inline-end: 0;

  opacity: 0.1;

  z-index: 2;

  pointer-events: none;

}



@media (max-width: 767px) {

  .hero-section .pattern {

    max-width: 35%;

    bottom: 50%;

    transform: translateY(50%);

  }

}



html[dir="rtl"] .hero-section .pattern {

  transform: scaleX(-1);

}



@media (max-width: 767px) {

  html[dir="rtl"] .hero-section .pattern {

    transform: scaleX(-1) translateY(50%);

  }

}



.hero-section .main-swiper-tools {

  position: absolute;

  z-index: 4;

  top: 0;

  bottom: 0;

  inset-inline-end: calc((100vw - 1180px) / 2);

  padding-top: var(--header);

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  gap: 30px;

}



@media (max-width: 1199px) {

  .hero-section .main-swiper-tools {

    inset-inline: 0;

    bottom: 40px;

    top: auto;

    padding: 0;

    flex-direction: row;

  }

}



@media (max-width: 991px) {

  .hero-section .main-swiper-tools {

    gap: 20px;

    bottom: 20px;

  }

}



.hero-section .swiper-btn {

  width: 56px;

  aspect-ratio: 1;

  border: 2px solid #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: transparent;

  fill: #fff;

  cursor: pointer;

  transition: all 0.3s ease-in-out;

}



.hero-section .swiper-btn:hover {

  fill: #035245;

  background-color: #fff;

}



@media (max-width: 1199px) {

  .hero-section .swiper-btn {

    width: 56px;

  }



  .hero-section .swiper-btn svg {

    transform: rotate(90deg);

  }



  html[dir="ltr"] .hero-section .swiper-btn svg {

    transform: rotate(-90deg);

  }

}



@media (max-width: 767px) {

  .hero-section .swiper-btn {

    width: 40px;

  }

}



.hero-section .swiper-pagination {

  position: relative;

  inset: unset;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  width: auto;

  gap: 15px;

  transform: none;

}



@media (max-width: 1199px) {

  .hero-section .swiper-pagination {

    flex-direction: row;

  }

}



@media (max-width: 767px) {

  .hero-section .swiper-pagination {

    gap: 8px;

  }

}



.hero-section .swiper-pagination .swiper-pagination-bullet {

  margin: 0;

  background-color: #fff;

  opacity: 0.3;

  width: 8px;

  height: 24px;

  border-radius: 12px;

  transition: opacity 0.3s ease-in-out;

}



.hero-section

  .swiper-pagination

  .swiper-pagination-bullet.swiper-pagination-bullet-active {

  opacity: 1;

}



@media (max-width: 1199px) {

  .hero-section .swiper-pagination .swiper-pagination-bullet {

    height: 8px;

    width: 24px;

  }

}



@media (max-width: 767px) {

  .hero-section .swiper-pagination .swiper-pagination-bullet {

    width: 8px;

  }

}



.main-slider {

  width: 100%;

  height: var(--height);

  min-height: var(--min-height);

  overflow: hidden;

  position: relative;

}



.main-slider .swiper {

  width: 100%;

  height: 100%;

}



.main-slide {

  width: 100%;

  height: 100%;

  overflow: hidden;

  position: relative;

  background-color: #fff;

}



.main-slide::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(180deg, #035245 0%, rgba(3, 82, 69, 0) 100%);

  display: block;

  z-index: 3;

}



.main-slide .slide-img {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 1;

}



.main-slide .slide-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.main-slide .main-text {

  position: relative;

  width: 100%;

  height: 100%;

  z-index: 4;

  padding-top: var(--header);

  display: flex;

  flex-direction: column;

  align-items: flex-start;

  justify-content: center;

}



@media (max-width: 991px) {

  .main-slide .main-text {

    padding: calc(var(--header) + 30px) 0 0;

    justify-content: flex-start;

  }

}



@media (max-width: 767px) {

  .main-slide .main-text {

    justify-content: center;

    align-items: center;

    text-align: center;

    padding: var(--header) 0 60px;

  }

}



.main-slide .slide-subtitle {

  font-size: 18px;

  font-weight: 400;

  color: #ff717f;

  line-height: 1.5;

  margin: 0 0 10px;

}



.main-slide .slide-title {

  font-size: 48px;

  font-weight: 600;

  color: #fff;

  line-height: 1.2;

  margin: 0 0 20px;

}



@media (max-width: 767px) {

  .main-slide .slide-title {

    font-size: 32px;

    margin-bottom: 15px;

  }

}



.main-slide .slide-desc {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: #fff;

  margin: 0 0 20px;

  /* display: -webkit-box;

  -webkit-line-clamp: 3;

  -webkit-box-orient: vertical; */

  overflow: hidden;

  width: 100%;

  max-width: 745px;

}

@media (max-width: 767px) {

  .main-slide .slide-desc {

    font-size: 13px;

    margin-bottom: 15px;

  }

}

.main-slide .slide-desc p {

  margin: 0;

}

.main-slide .slide-btn {

  background-color: rgba(255, 255, 255, 0.9);

  color: #035245;

}



.main-slide .slide-btn:hover {

  background-color: #bf1e2e;

  color: #fff;

}



@media (max-width: 767px) {

  .main-slide .slide-btn {

    margin: 0 auto;

  }

}



.about-content {

  display: flex;

  align-items: center;

  gap: 37px;

}



@media (max-width: 991px) {

  .about-content {

    flex-direction: column;

    align-items: flex-start;

    gap: 0;

  }

}



.about-content .section-title.mobile-title {

  display: none;

}



@media (max-width: 991px) {

  .about-content .section-title {

    display: none;

  }



  .about-content .section-title.mobile-title {

    display: flex;

  }

}



@media (max-width: 767px) {

  .about-content .section-title {

    align-items: center;

    width: 100%;

  }

}



.about-content .about-img {

  width: 40%;

  max-width: 423px;

  aspect-ratio: 423/360;

  border-radius: 20px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  overflow: hidden;

  padding: 20px;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

  background-color: var(--mode);

}



.darkMode .about-content .about-img {

  box-shadow: none;

  border: 3px solid #333;

}



.about-content .about-img img {

  width: 100%;

  max-width: 219px;

  height: auto;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .about-content .about-img {

    width: 100%;

    margin-bottom: 30px;

  }

}



@media (max-width: 767px) {

  .about-content .about-img {

    margin: 0 auto 25px;

  }

}



.about-content .about-title {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: #ff717f;

  margin: 0 0 15px;

}



@media (max-width: 767px) {

  .about-content .about-title {

    text-align: center;

  }

}



.about-content .about-description {

  padding-inline-start: 20px;

  border-inline-start: 1px solid #bf1e2e;

  color: var(--text2);

  font-size: 18px;

  font-weight: 400;

  margin: 0 0 20px;

}



@media (max-width: 767px) {

  .about-content .about-description {

    font-size: 16px;

    padding: 0;

    border: 0;

    text-align: justify;

    -moz-text-align-last: center;

    text-align-last: center;

  }

}



@media (max-width: 767px) {

  .about-content .about-btn {

    margin: 0 auto;

  }

}



.productServices-item {

  width: 100%;

  position: relative;

  margin-bottom: 18px;

}



@media (max-width: 767px) {

  .productServices-item {

    max-width: 370px;

    margin-inline: auto;

  }

}



.productServices-item .productServices-img {

  display: flex;

  width: 100%;

  overflow: hidden;

  border-radius: 20px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  aspect-ratio: 370/230;

}



.productServices-item .productServices-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.productServices-item .productServices-img:hover img {

  transform: scale(1.1);

}



.swiper-slide .productServices-item .productServices-img {

  box-shadow: none;

  border: 1px solid rgba(0, 0, 0, 0.0784313725);

}



.darkMode .swiper-slide .productServices-item .productServices-img {

  border: 1px solid #333;

}



.darkMode .productServices-item .productServices-img {

  border: 1px solid #333;

}



.productServices-item .productServices-information {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  background-color: var(--mode);

  border-radius: 20px;

  padding: 26px 20px 40px;

  text-align: center;

  margin-top: -35px;

  position: relative;

  z-index: 2;

}



.swiper-slide .productServices-item .productServices-information {

  box-shadow: none;

  border: 1px solid rgba(0, 0, 0, 0.0784313725);

}



.darkMode .swiper-slide .productServices-item .productServices-information {

  border: 1px solid #333;

}



.darkMode .productServices-item .productServices-information {

  border: 1px solid #333;

}



.productServices-item .productServices-head {

  position: relative;

  margin: 0 0 10px;

}



.productServices-item .productServices-head::before {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 42px;

  height: 39px;

  opacity: 0.1;

}



.darkMode .productServices-item .productServices-head::before {

  filter: brightness(0) invert(1);

}



.productServices-item .productServices-title {

  font-size: 20px;

  font-weight: 600;

  position: relative;

  z-index: 2;

  color: var(--text);

  line-height: 1.4;

  text-align: center;

  display: -webkit-box;

  -webkit-line-clamp: 1;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 0;

  text-transform: capitalize;

}



.productServices-item .productServices-title a {

  color: inherit;

  transition: all 0.3s ease-in-out;

}



.productServices-item .productServices-title a:hover {

  color: #bf1e2e;

}



.productServices-item .productServices-summary {

  font-size: 16px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  display: -webkit-box;

  -webkit-line-clamp: 4;

  -webkit-box-orient: vertical;

  overflow: hidden;

  height: 96px;

  margin: 0;

}



.productServices-item .productServices-btn {

  position: absolute;

  bottom: -18px;

  left: 50%;

  z-index: 3;

  transform: translateX(-50%);

}



.accreditation-item {

  width: 100%;

  aspect-ratio: 180/148;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  overflow: hidden;

  transition: all 0.1s ease-in-out;

}



@media (max-width: 1199px) {

  .accreditation-item {

    aspect-ratio: 270/230;

  }

}



.accreditation-item .accreditation-img {

  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: #fff;

}



.accreditation-item .accreditation-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (min-width: 1200px) {

  .swiper-slide-active .accreditation-item {

    aspect-ratio: 270/230;

  }



  .swiper-slide-next .accreditation-item,

  .swiper-slide-prev .accreditation-item {

    aspect-ratio: 230/190;

  }

}



.accreditations-slider .swiper {

  overflow: unset;

}



@media (min-width: 1200px) {

  .accreditations-slider .slider-content {

    height: 230px;

  }



  .accreditations-slider .swiper-wrapper {

    align-items: center;

  }



  .accreditations-slider .swiper-slide {

    width: 180px;

  }



  .accreditations-slider .swiper-slide.swiper-slide-active {

    width: 270px;

  }



  .accreditations-slider .swiper-slide.swiper-slide-next,

  .accreditations-slider .swiper-slide.swiper-slide-prev {

    width: 230px;

  }

}



.qualityMark-item {

  width: 100%;

  aspect-ratio: 180/148;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  overflow: hidden;

  transition: all 0.1s ease-in-out;

}



@media (max-width: 1199px) {

  .qualityMark-item {

    aspect-ratio: 270/230;

  }

}



.qualityMark-item .qualityMark-img {

  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: #fff;

}



.qualityMark-item .qualityMark-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (min-width: 1200px) {

  .swiper-slide-active .qualityMark-item {

    aspect-ratio: 270/230;

  }



  .swiper-slide-next .qualityMark-item,

  .swiper-slide-prev .qualityMark-item {

    aspect-ratio: 230/190;

  }

}



.qualityMarks-slider .swiper {

  overflow: unset;

}



@media (min-width: 1200px) {

  .qualityMarks-slider .slider-content {

    height: 230px;

  }



  .qualityMarks-slider .swiper-wrapper {

    align-items: center;

  }



  .qualityMarks-slider .swiper-slide {

    width: 180px;

  }



  .qualityMarks-slider .swiper-slide.swiper-slide-active {

    width: 270px;

  }



  .qualityMarks-slider .swiper-slide.swiper-slide-next,

  .qualityMarks-slider .swiper-slide.swiper-slide-prev {

    width: 230px;

  }

}



.why-grid {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  gap: 30px;

}



@media (max-width: 1199px) {

  .why-grid {

    grid-template-columns: 1fr 1fr;

  }

}



@media (max-width: 991px) {

  .why-grid {

    gap: 15px;

  }

}



@media (max-width: 767px) {

  .why-grid {

    grid-template-columns: 1fr;

  }

}



.why-item {

  border-radius: 20px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  padding: 20px 11px;

  max-width: 370px;

  min-height: 330px;

  margin: 0 auto;

  background-color: var(--mode);

}



.darkMode .why-item {

  border: 1px solid #333;

}



@media (max-width: 767px) {

  .why-item {

    min-height: auto;

  }

}



.why-item .why-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 16px;

}



.why-item .why-img {

  width: 112px;

  aspect-ratio: 112/105;

  display: flex;

  align-items: center;

  justify-content: center;

}



.why-item .why-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



.why-item .why-number {

  font-size: 64px;

  line-height: 1.5;

  color: #96a0b6;

  font-weight: 700;

  opacity: 0.3;

  margin: 0 30px;

}



.why-item .why-body {

  padding: 0 5px;

}



.why-item .why-title {

  font-size: 20px;

  color: var(--text);

  font-weight: 500;

  line-height: 1.5;

  margin: 0 0 8px;

}



.why-item .why-features {

  font-size: 14px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

}



.why-item .why-features li {

  display: flex;

  align-items: flex-start;

}



.why-item .why-features li::before {

  content: "";

  background-color: #74cebf;

  width: 9px;

  height: 9px;

  border-radius: 50%;

  flex-shrink: 0;

  transform: translateY(6px);

  margin-inline-end: 5px;

}



.contact-section .contact-map {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: flex;

  border: 1px solid #d6d6d6;

  border-radius: 10px;

  overflow: hidden;

}



.contact-section .contact-map #map {

  width: 100%;

  height: 100%;

}



.contact-section .contact-content {

  position: relative;

  z-index: 2;

  background-color: var(--mode);

  width: 100%;

  max-width: 704px;

  padding: 40px 40px 46px;

  border-radius: 20px;

  overflow: hidden;

}



@media (max-width: 767px) {

  .contact-section .contact-content .section-title {

    align-items: center;

  }

}



.contact-section .contact-content .contact-title {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 20px;

}



@media (max-width: 767px) {

  .contact-section .contact-content .contact-title {

    text-align: center;

    width: 100%;

  }

}



@media (max-width: 991px) {

  .contact-section .contact-content {

    margin: auto;

  }

}



@media (max-width: 767px) {

  .contact-section .contact-content {

    padding: 25px 15px 30px;

  }

}



.contact-section .contact-methods {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px;

}



@media (max-width: 767px) {

  .contact-section .contact-methods {

    grid-template-columns: 1fr;

  }

}



.contact-section .contact-method {

  background-color: var(--mode);

  border: 1px solid #eeeeee;

  border-radius: 10px;

  padding: 15px 20px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  position: relative;

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  transition: all 0.3s ease-in-out;

}



.darkMode .contact-section .contact-method {

  border-color: #2d2f2f;

}



.contact-section .contact-method:before {

  pointer-events: none;

  position: absolute;

  z-index: -1;

  content: "";

  top: 100%;

  left: 5%;

  height: 10px;

  width: 90%;

  opacity: 0;

  background: radial-gradient(

    ellipse at center,

    rgba(3, 82, 69, 0.35) 0%,

    rgba(3, 82, 69, 0) 80%

  );

  transition: all 0.3s ease-in-out;

}



.contact-section .contact-method:hover {

  transform: translateY(-5px);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.contact-section .contact-method:hover::before {

  opacity: 1;

  transform: translateY(5px);

}



@media (max-width: 767px) {

  .contact-section .contact-method {

    padding: 15px 10px;

  }

}



.contact-section .contact-method .method-icon {

  width: 45px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  fill: #74cebf;

  flex-shrink: 0;

}



.contact-section .contact-method .method-icon svg {

  max-width: 100%;

  max-height: 100%;

}



@media (max-width: 767px) {

  .contact-section .contact-method .method-icon {

    width: 40px;

  }

}



.contact-section .contact-method .method-text {

  margin-inline-start: 16px;

}



@media (max-width: 767px) {

  .contact-section .contact-method .method-text {

    margin-inline-start: 10px;

  }

}



.contact-section .contact-method .title {

  font-size: 18px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  display: block;

  margin-bottom: 4px;

}



@media (max-width: 767px) {

  .contact-section .contact-method .title {

    font-size: 16px;

  }

}



.contact-section .contact-method .value {

  font-size: 20px;

  font-weight: 500;

  color: var(--text);

  display: block;

  text-align: right;

  line-height: 1.5;

}



html[dir="ltr"] .contact-section .contact-method .value {

  text-align: left;

}



.contact-section .contact-method .value a {

  color: var(--text);

  transition: all 0.3s ease-in-out;

}



.contact-section .contact-method .value a:hover {

  color: #bf1e2e;

}



@media (max-width: 767px) {

  .contact-section .contact-method .value {

    font-size: 18px;

  }



  .contact-section .contact-method .value br {

    display: none;

  }

}



.contact-section .contact-method .en {

  direction: ltr;

}



.contact-section .contact-method:nth-of-type(n + 3) {

  grid-column: 1 / span 2;

}



@media (max-width: 767px) {

  .contact-section .contact-method:nth-of-type(n + 3) {

    grid-column: unset;

  }

}



.preloader-body {

  position: fixed;

  display: flex;

  justify-content: center;

  align-items: center;

  top: 0;

  left: 0;

  right: 0;

  min-height: 100vh;

  background: #111;

  z-index: 9999;

}



.load {

  position: relative;

  display: flex;

  flex-direction: column;

  align-items: center;

}



.load .coil {

  position: relative;

  width: 300px;

  height: 380px;

  background: url(../images/preloaderFilterd.png);

  background-size: 300px;

}



.load .coil::before {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url(../images/preloader.png);

  background-size: 300px;

  animation: animate 4s ease-in-out infinite;

}



.load .coil::after {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 8px;

  background: #035245;

  border-radius: 8px;

  filter: drop-shadow(0 0 20px #035245) drop-shadow(0 0 60px #035245);

  animation: animate_line 4s ease-in-out infinite;

}



.load h3 {

  text-transform: uppercase;

  font-size: 2em;

  letter-spacing: 2px;

  margin-top: 20px;

  color: #035245;

  filter: drop-shadow(0 0 20px #035245) drop-shadow(0 0 60px #035245);

  animation: animate_text 0.5s steps(1) infinite;

}



@keyframes animate {

  0%,

  100% {

    height: 0%;

  }

  50% {

    height: 100%;

  }

}



@keyframes animate_line {

  0%,

  100% {

    top: 0%;

  }

  50% {

    top: 100%;

  }

}



@keyframes animate_text {

  0%,

  100% {

    opacity: 0;

  }

  50% {

    opacity: 1;

  }

}



.mode-swithcher {

  position: fixed;

  top: 229px;

  inset-inline-start: 0;

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-end-end-radius: 8px;

  border-start-end-radius: 8px;

  width: 50px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 99;

  fill: #000;

  cursor: pointer;

  overflow: hidden;

  transition: all 0.3s ease-in-out;

}



.mode-swithcher input {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  padding: 0;

  margin: 0;

  opacity: 0;

  cursor: pointer;

}



.mode-swithcher .light-icon {

  display: none;

}



.mode-swithcher:hover {

  background-color: #000;

  fill: #fff;

}



.darkMode .mode-swithcher {

  fill: #fff;

  box-shadow: none;

  border: 1px solid #333;

}



.darkMode .mode-swithcher .dark-icon {

  display: none;

}



.darkMode .mode-swithcher .light-icon {

  display: block;

}



.page-content {

  padding: 60px 0 160px;

  overflow: hidden;

}



@media (max-width: 767px) {

  .page-content {

    padding: 40px 0 90px;

  }

}



.page-content.bg-section .bg {

  bottom: unset;

  align-items: flex-start;

}



header {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  z-index: 999;

}



@media (max-width: 991px) {

  header {

    overflow: hidden;

  }

}



.header {

  display: grid;

  grid-template-columns: 2fr 1fr 2fr;

  align-items: center;

  padding: 20px 0;

}



@media (max-width: 1199px) {

  .header {

    grid-template-columns: 5fr 2fr 5fr;

  }

}



@media (max-width: 991px) {

  .header {

    padding: 15px 0;

    grid-template-columns: 2fr 1fr 2fr;

  }

}



@media (max-width: 767px) {

  .header {

    display: flex;

    justify-content: space-between;

    flex-wrap: wrap;

    gap: 15px;

    padding: 10px 0 5px;

  }

}



.header-inlineStart {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  gap: 15px;

}



@media (max-width: 991px) {

  .header-inlineStart {

    display: none;

  }

}



.header-link-container ul {

  display: flex;

  align-items: center;

  margin: 0;

}



.header-link-container li:not(:last-of-type) {

  margin-inline-end: 15px;

}



.header-link-container li {

  display: flex;

  align-items: center;

}



.header-link-container li:after {

  content: "ا";

  font-size: 14px;

  font-weight: 500;

  color: #fff;

  margin-inline-start: 15px;

}



.header-link-container li a {

  font-size: 14px;

  font-weight: 500;

  color: #fff;

  text-transform: capitalize;

  transition: all 0.3s ease-in-out;

}



.header-link-container li a:hover {

  color: #ff717f;

}



.lang-content {

  position: relative;

}



.lang-content .lang-trigger {

  display: flex;

  align-items: center;

  justify-content: center;

  color: #fff;

  fill: #fff;

  stroke: #fff;

  font-size: 14px;

  font-weight: 500;

  padding: 0;

  transition: all 0.3s ease-in-out;

}



.lang-content .lang-trigger .icon {

  margin-inline-end: 10px;

}



.lang-content .lang-trigger .arrow {

  margin-inline-start: 8px;

}



@media (max-width: 991px) {

  .lang-content .lang-trigger {

    width: 100%;

    justify-content: space-between;

    font-size: 18px;

    font-weight: 600;

    color: #fff;

  }



  .lang-content .lang-trigger .icon svg {

    width: 20px;

    height: 20px;

  }



  .lang-content .lang-trigger .text {

    margin-inline-end: auto;

  }



  .lang-content .lang-trigger .arrow {

    color: #fff;

    transition: all 0.3s ease-in-out;

  }



  .lang-content .lang-trigger .arrow::before {

    font-family: "Font Awesome 6 Pro";

    content: "\f107";

    font-weight: 400;

  }



  .lang-content .lang-trigger .arrow svg {

    display: none;

  }



  .lang-content .lang-trigger.active {

    color: #fff;

  }



  .lang-content .lang-trigger.active .arrow {

    transform: rotate(180deg);

  }

}



.lang-content .lang-list {

  position: absolute;

  top: calc(100% + 10px);

  left: 50%;

  min-width: 140px;

  transform: translateX(-50%);

  background-color: #fff;

  border-radius: 10px;

  overflow: hidden;

  visibility: hidden;

  opacity: 0;

  z-index: 3;

  transition: all 0.3s ease-in-out;

}



@media (max-width: 991px) {

  .lang-content .lang-list {

    width: 100%;

    position: relative;

    inset: unset;

    transform: none;

    visibility: visible;

    opacity: 1;

    display: block;

    border-radius: 0;

    background-color: transparent;

    padding: 0 10px;

    transition: none;

    display: none;

  }

}



.lang-content .lang-item {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  width: 100%;

  height: 40px;

  font-size: 14px;

  font-weight: 500;

  padding: 0 16px;

  padding-inline-start: 12px;

  color: #1d1f1f;

  line-height: 1.5;

  transition: all 0.3s ease-in-out;

}



.lang-content .lang-item ~ .lang-item {

  border-top: 1px solid #d2ece9;

}



.lang-content .lang-item img {

  width: 24px;

  aspect-ratio: 1;

  -o-object-fit: cover;

  object-fit: cover;

  margin-inline-end: 10px;

}



.lang-content .lang-item:hover {

  color: #035245;

  background-color: #edf8f6;

}



@media (max-width: 991px) {

  .lang-content .lang-item {

    padding: 10px 0;

    color: rgba(255, 255, 255, 0.8);

    height: auto;

  }



  .lang-content .lang-item ~ .lang-item {

    border-top: none;

  }

}



.lang-content:hover .lang-trigger {

  color: #ff717f;

  fill: #ff717f;

  stroke: #ff717f;

}



@media (max-width: 991px) {

  .lang-content:hover .lang-trigger {

    color: #fff;

    fill: #fff;

    stroke: #fff;

  }

}



.lang-content:hover .lang-list {

  visibility: visible;

  opacity: 1;

}



.logo {

  display: flex;

  width: 111px;

  margin: auto;

}



.logo img {

  width: 100%;

}



@media (max-width: 991px) {

  .logo {

    width: 100px;

  }

}



@media (max-width: 767px) {

  .logo {

    order: 1;

    margin: 0;

    width: 70px;

  }

}



.header-inlineEnd {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 15px;

}



@media (max-width: 767px) {

  .header-inlineEnd {

    width: 100%;

    order: 3;

  }

}



.header-search {

  position: relative;

}



@media (max-width: 767px) {

  .header-search {

    width: 100%;

  }

}



.header-search .search-input {

  width: 100px;

  height: 40px;

  border-radius: 25px;

  background-color: rgba(255, 255, 255, 0.1);

  border: 1px solid #fff;

  padding: 0 16px;

  padding-inline-start: 37px;

  font-size: 14px;

  font-weight: 500;

  color: #fff;

  transition: all 0.3s ease-in-out;

}



.header-search .search-input::-moz-placeholder {

  font-size: 14px;

  font-weight: 500;

  color: #fff;

}



.header-search .search-input::placeholder {

  font-size: 14px;

  font-weight: 500;

  color: #fff;

}



.header-search .search-input:focus {

  width: 200px;

}



.header-search .search-input:not(:-moz-placeholder-shown) {

  width: 200px;

}



.header-search .search-input:not(:placeholder-shown) {

  width: 200px;

}



@media (max-width: 767px) {

  .header-search .search-input {

    width: 100%;

  }



  .header-search .search-input:focus {

    width: 100%;

  }



  .header-search .search-input:not(:-moz-placeholder-shown) {

    width: 100%;

  }



  .header-search .search-input:not(:placeholder-shown) {

    width: 100%;

  }

}



.header-search .search-icon {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  inset-inline-start: 17px;

  stroke: #fff;

  padding: 0;

  background-color: transparent;

  transition: all 0.3s ease-in-out;

}



.header-btn {

  display: flex;

  align-items: center;

  justify-content: center;

  width: -moz-max-content;

  width: max-content;

  padding: 0 20px;

  height: 40px;

  border-radius: 25px;

  background-color: rgba(255, 255, 255, 0.1);

  border: 1px solid #fff;

  font-size: 14px;

  font-weight: 500;

  color: #fff;

  text-transform: uppercase;

  transition: all 0.3s ease-in-out;

}



.header-btn:hover {

  color: #fff;

  background-color: #ff717f;

  border-color: #ff717f;

}



@media (max-width: 991px) {

  .header-btn {

    display: none;

  }

}



.header-socials {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 15px;

}



@media (max-width: 991px) {

  .header-socials {

    display: none;

  }

}



.header-socials .social {

  display: flex;

  align-items: center;

  justify-content: center;

  border: 1px solid #fff;

  width: 28px;

  aspect-ratio: 1;

  border-radius: 50%;

  font-size: 11px;

  color: #fff;

  transition: all 0.3s ease-in-out;

}



.header-socials .social i {

  display: flex;

  align-items: center;

}



.header-socials .social:hover {

  background-color: #fff;

  color: #035245;

}



.nav-trigger {

  display: none;

  align-items: center;

  justify-content: flex-start;

}



@media (max-width: 991px) {

  .nav-trigger {

    display: flex;

  }

}



@media (max-width: 767px) {

  .nav-trigger {

    order: 2;

  }

}



.menu-btn {

  display: flex;

  flex-flow: column;

  align-items: center;

  position: relative;

  cursor: pointer;

  width: -moz-max-content;

  width: max-content;

  padding: 0;

  z-index: 99;

}



.menu-btn .btn-bar {

  position: relative;

  width: 22px;

  height: 2px;

  border-radius: 5px;

  background: #fff;

}



.menu-btn .btn-bar.menu {

  transition: transform 0.3s ease-in-out 0.2s, opacity 0.15s ease-in-out 0.2s;

}



.menu-btn .btn-bar.menu:not(:first-child) {

  margin-top: 5px;

}



.menu-btn .btn-bar.menu:nth-child(even) {

  width: 30px;

}



.menu-btn .btn-bar.close {

  transform-origin: center center;

  position: absolute;

  margin-top: -1.5px;

  opacity: 0;

  top: 50%;

  transition: transform 0.2s ease-in-out, opacity 0.05s ease-in-out 0.2s;

}



.menu-btn .btn-bar.close:not(:last-child) {

  transform: rotate(45deg) translateX(-250%);

}



.menu-btn .btn-bar.close:last-child {

  transform: rotate(-45deg) translateX(250%);

}



.menu-btn.active .btn-bar.menu {

  transition: transform 0.3s ease-in-out, opacity 0.15s ease-in-out 0.15s;

  opacity: 0;

}



.menu-btn.active .btn-bar.menu:nth-child(odd) {

  transform: translateX(-400%);

}



.menu-btn.active .btn-bar.menu:nth-child(even) {

  transform: translateX(200%);

}



.menu-btn.active .btn-bar.close {

  opacity: 1;

  transition: transform 0.2s ease-in-out 0.3s, opacity 0.05s ease-in-out 0.3s;

}



.menu-btn.active .btn-bar.close:not(:last-child) {

  transform: rotate(45deg);

}



.menu-btn.active .btn-bar.close:last-child {

  transform: rotate(-45deg);

}



.header-nav {

  display: flex;

  align-items: center;

  justify-content: space-between;

  background-color: rgba(255, 255, 255, 0.1);

  border: 1px solid rgba(255, 255, 255, 0.1);

  border-radius: 10px;

  padding: 0 19px;

  position: relative;

}

.header-nav.mobile-nav {

  display: none;

}

.nav-list {

  display: flex;

  align-items: center;

  gap: 30px;

  list-style: none;

  margin: 0;

}

.nav-list > .menu-item {

  display: flex;

  align-items: center;

  height: 56px;

}

.nav-list .nav-item.mobile-li {

  display: none;

}



@media (max-width: 991px) {

  .nav-list .nav-item.mobile-li {

    display: block;

  }

}

.nav-list .menu-item.has-children:not(:has(h4)) {

  position: relative;

}



.nav-list .nav-link {

  color: #fff;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.5;

  display: flex;

  padding: 0;

  position: relative;

  transition: all 0.3s ease-in-out;

}



.nav-list .nav-link:hover,

.nav-list .nav-link:focus {

  color: #ff717f;

}



.nav-list .nav-link:before {

  content: url(../images/pattern/navbar.png);

  position: absolute;

  top: 100%;

  left: 50%;

  height: 12px;

  display: none;

  align-items: center;

  justify-content: center;

  pointer-events: none;

  transform: translateX(-50%);

  transition: all 0.3s ease-in-out;

}



.nav-list .nav-link.active::before {

  display: flex;

}



.nav-content .header-btn {

  display: flex;

  width: 100%;

}



.children-content {

  position: absolute;

  top: calc(100% + 10px);

  inset-inline-start: 0;

  background-color: #fff;

  border-radius: 10px;

  overflow: hidden;

  display: flex;

  visibility: hidden;

  opacity: 0;

  width: 100%;

  transition: all 0.3s ease-in-out;

}

.nav-list .menu-item.has-children:not(:has(h4)) .children-content {

  width: 255px;

  padding: 20px;

  flex-direction: column;

}

.children-content > li {

  padding: 20px;

  flex: 1;

  min-width: 255px;

  min-height: 100%;

}

.nav-list .menu-item.has-children:not(:has(h4)) .children-content > li {

  min-width: auto;

  padding: 0;

  height: 45px;

  display: flex;

  align-items: center;

  margin-bottom: 5px;

  border-bottom: 1px solid #d2ece9;

  background-color: #fff;

  flex: unset;

}

@media (max-width: 991px) {

  .children-content > li {

    min-width: auto;

  }

}



.children-content > li:nth-of-type(even) {

  background-color: #edf8f6;

}



.children-content .child-title {

  font-size: 16px;

  font-weight: 600;

  color: #035245;

  line-height: 1.5;

  margin: 0 0 5px;

}

.children-content > li:not(:has(h4)) .child-link {

  font-size: 16px;

  font-weight: 600;

  color: #035245;

  line-height: 1.5;

  transition: all 0.3s ease-in-out;

}

.children-content > li:not(:has(h4)) .child-link:hover {

  color: #3aae07;

}

.children-content .child-list {

  width: 100%;

}



.children-content .child-list li {

  height: 45px;

  display: flex;

  align-items: center;

  margin-bottom: 5px;

  border-bottom: 1px solid #d2ece9;

}



.children-content .child-list li:last-of-type {

  margin: 0;

}



.nav-list .menu-item.has-children:not(:has(h4)) .children-content > li a {

  font-size: 14px;

  line-height: 1.5;

  color: #626c83;

  transition: all 0.3s ease-in-out;

}



.nav-list .menu-item.has-children:not(:has(h4)) .children-content > li a:hover {

  color: #3aae07;

}

.children-content .child-list a {

  font-size: 14px;

  line-height: 1.5;

  color: #626c83;

  transition: all 0.3s ease-in-out;

}



.children-content .child-list a:hover {

  color: #3aae07;

}



.has-children .nav-link::before {

  display: flex;

  visibility: hidden;

  opacity: 0;

}



.has-children .nav-link.active::before {

  visibility: visible;

  opacity: 1;

}



.has-children:hover .nav-link {

  color: #fff;

}



.has-children:hover .nav-link::before {

  visibility: visible;

  opacity: 1;

}



.has-children:hover .children-content {

  visibility: visible;

  opacity: 1;

}



.background {

  position: absolute;

  flex-flow: column;

  align-items: stretch;

  top: 0;

  left: 0;

  right: 0;

  bottom: -2px;

  display: none;

}



.background .portion {

  background: #035245;

  flex: 1 1 100%;

  transition: transform 0.2s ease-in-out;

}



.background .portion:not(:first-child) {

  margin-top: -1px;

}



.background .portion:nth-child(odd) {

  transform: translateX(-100%);

}



.background .portion:nth-child(even) {

  transform: translateX(100%);

}



@media (max-width: 991px) {

  .header-nav {

    display: none;

  }

  .mobile-nav {

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    z-index: -1;

    border: none;

    padding: 0;

    background-color: transparent;

    border-radius: 0;

    display: none;

    transition: z-index 0.01s ease-in-out 0.2s;

  }



  .mobile-nav .background {

    display: flex;

  }



  .mobile-nav .nav-content {

    visibility: hidden;

    opacity: 0;

    transform: matrix(1, 0, 0, 1, 0, 20);

    display: block;

    background-color: transparent;

    border: none;

    padding: 80px 30px 40px;

    width: 100%;

    height: 100%;

    background-color: #035245;

    overflow-y: auto;

    border-radius: 0;

    transition: all 0.01s ease-in-out;

  }

  .mobile-nav .nav-list {

    display: block;

    padding: 0;

  }

  .mobile-nav .nav-list > li {

    padding: 10px 20px;

    padding-inline-end: 0;

    height: auto;

    display: block;

  }

  .mobile-nav .lang-content {

    padding: 10px 20px;

    padding-inline-end: 0;

  }

  .mobile-nav .lang-content .lang-content {

    padding: 0;

  }



  .mobile-nav .nav-list .nav-link {

    font-size: 18px;

    font-weight: 600;

  }



  .mobile-nav .nav-list .nav-link::before {

    content: unset;

  }



  .mobile-nav .has-children .nav-link {

    align-items: center;

    justify-content: space-between;

    width: 100%;

  }



  .mobile-nav .has-children .nav-link:after {

    font-family: "Font Awesome 6 Pro";

    content: "\f107";

    font-weight: 400;

    color: #fff;

    transition: all 0.3s ease-in-out;

  }



  .mobile-nav .has-children .nav-link.sub-active {

    color: #fff;

  }



  .mobile-nav .has-children .nav-link.sub-active:after {

    transform: rotate(180deg);

    color: #fff;

  }



  .mobile-nav .children-content {

    position: relative;

    inset: unset;

    visibility: visible;

    opacity: 1;

    display: block;

    border-radius: 0;

    background-color: transparent;

    padding: 0 10px;

    transition: none;

    display: none;

  }

  .mobile-nav

    .nav-list

    .menu-item.has-children:not(:has(h4))

    .children-content {

    width: 100%;

    padding: 0 10px;

  }

  .mobile-nav .children-content > li {

    padding: 7px 0;

    width: 100%;

    min-height: auto;

  }

  .mobile-nav

    .nav-list

    .menu-item.has-children:not(:has(h4))

    .children-content

    > li {

    padding: 7px 0;

    width: 100%;

    height: auto;

    margin: 0;

    display: block;

    height: auto;

    border: none;

    background-color: transparent;

  }

  .mobile-nav .children-content > li:nth-of-type(even) {

    background-color: transparent;

  }



  .mobile-nav .children-content .child-title {

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin: 0;

  }

  .children-content > li:not(:has(h4)) .child-link {

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin: 0;

  }

  .children-content > li:not(:has(h4)) .child-link:hover {

    color: #fff;

  }

  .mobile-nav

    .nav-list

    .menu-item.has-children:not(:has(h4))

    .children-content

    > li

    a {

    color: rgba(255, 255, 255, 0.8);

    display: flex;

    align-items: center;

    justify-content: space-between;

    margin: 0;

    font-size: 16px;

    font-weight: 600;

  }

  .mobile-nav .children-content .child-title:after {

    font-family: "Font Awesome 6 Pro";

    content: "\f107";

    font-weight: 400;

    color: rgba(255, 255, 255, 0.8);

    transition: all 0.3s ease-in-out;

  }



  .mobile-nav .children-content .child-title.sub-active {

    color: rgba(255, 255, 255, 0.8);

  }



  .mobile-nav .children-content .child-title.sub-active:after {

    transform: rotate(180deg);

    color: rgba(255, 255, 255, 0.8);

  }



  .mobile-nav .children-content .child-list {

    padding: 0 10px;

    display: none;

  }



  .mobile-nav .children-content .child-list li {

    height: auto;

    padding: 7px 0;

    margin: 0;

    border: none;

  }



  .mobile-nav .children-content .child-list a {

    color: #edf8f6;

  }



  .mobile-nav .children-content .child-list a:hover {

    color: #fff;

  }



  .mobile-nav.active {

    z-index: 98;

    transition: z-index 0.01s ease-in-out 0.3s;

  }



  .mobile-nav.active .background .portion {

    transform: translateX(0%);

    transition: transform 0.2s ease-in-out 0.3s;

  }



  .mobile-nav.active .nav-content {

    visibility: visible;

    opacity: 1;

    transform: matrix(1, 0, 0, 1, 0, 0);

    transition: all 0.3s ease-in-out 0.5s;

  }

}



.breadcrumb-section {

  background-position: center;

  background-size: cover;

  position: relative;

  overflow: hidden;

  padding: 209px 0 57px;

}



.breadcrumb-section .container {

  position: relative;

  z-index: 2;

}



.breadcrumb-section::after {

  content: "";

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(

    180deg,

    #035245 0%,

    rgba(3, 82, 69, 0.7) 56%,

    rgba(3, 82, 69, 0.6) 100%

  );

}



@media (max-width: 991px) {

  .breadcrumb-section {

    padding: 125px 0 50px;

  }

}



@media (max-width: 767px) {

  .breadcrumb-section {

    padding: 130px 0 30px;

  }

}



.page-title {

  font-size: 32px;

  font-weight: 600;

  line-height: 1.3125;

  color: #fff;

  text-align: center;

  margin: 0 0 15px;

}



@media (max-width: 767px) {

  .page-title {

    margin: 0;

  }

}



.breadcrumb-content {

  display: flex;

  align-items: center;

  justify-content: center;

  color: #fff;

  fill: #fff;

  font-size: 18px;

}



@media (max-width: 767px) {

  .breadcrumb-content {

    display: none;

  }

}



.breadcrumb-content li {

  font-size: 18px;

  color: #ff717f;

  font-weight: 400;

  line-height: 1.5;

  display: flex;

  align-items: center;

  justify-content: center;

}



.breadcrumb-content li ~ li::before {

  content: "";

  background-image: url(../images/icons/breadcrumb.svg);

  width: 15px;

  height: 12px;

  background-position: center;

  background-repeat: no-repeat;

  margin: 0 9px;

}



.breadcrumb-content span {

  margin: 0 3px;

}

.breadcrumb-content > span:last-of-type {

  color: #ff717f;

}



.breadcrumb-content a {

  display: flex;

  align-items: center;

  justify-content: center;

  color: #fff;

  fill: #fff;

  transition: all 0.3s ease-in-out;

}



.breadcrumb-content a svg {

  margin-inline-end: 6px;

}



.breadcrumb-content a:hover {

  color: #bf1e2e;

  fill: #bf1e2e;

}



.footer-section {

  padding: 64px 0 40px;

  border-radius: 50px 50px 0px 0px;

  background-color: #035245;

  overflow: hidden;

  position: relative;

  z-index: 2;

  margin-top: -101px;

}



.footer-section .bg {

  position: absolute;

  inset: 0;

  z-index: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  overflow: hidden;

  opacity: 0.1;

}



.footer-section .bg img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



@media (max-width: 767px) {

  .footer-section {

    border-radius: 30px 30px 0 0;

    padding: 40px 0 25px;

    margin-top: -50px;

  }

}



.footer-content {

  position: relative;

  z-index: 2;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

}



.footer-logo {

  display: flex;

  width: 111px;

  margin: 0 auto 22px;

}



.footer-logo img {

  width: 100%;

}



.footer-text {

  width: 100%;

  max-width: 728px;

  font-size: 14px;

  color: #ccd2e0;

  text-align: justify;

  -moz-text-align-last: center;

  text-align-last: center;

  line-height: 1.5;

  margin: 0 auto 22px;

}



.socials {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 15px;

  margin: 0 auto 40px;

}



.socials .social {

  display: flex;

  align-items: center;

  justify-content: center;

  border: 1px solid #fff;

  width: 28px;

  aspect-ratio: 1;

  border-radius: 50%;

  font-size: 11px;

  color: #fff;

  transition: all 0.3s ease-in-out;

}



.socials .social i {

  display: flex;

  align-items: center;

}



.socials .social:hover {

  background-color: #fff;

  color: #035245;

}



.footer-nav {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 15px 30px;

  margin: 0 auto 47px;

  list-style: none;

}



@media (max-width: 767px) {

  .footer-nav {

    flex-direction: column;

    margin-bottom: 22px;

  }

}



.footer-nav a {

  font-size: 14px;

  line-height: 1.5;

  font-weight: 500;

  color: #ccd2e0;

  transition: all 0.3s ease-in-out;

}



.footer-nav a:hover {

  color: #ff717f;

}



.copyrights {

  width: 100%;

  text-align: center;

  font-size: 14px;

  font-weight: 400;

  line-height: 1.5;

  color: #ccd2e0;

  border-top: 1px solid #96a0b6;

  padding: 24px 0 0;

  margin: 0;

}



@media (max-width: 767px) {

  .copyrights {

    padding-top: 22px;

  }

}



.bg-section {

  position: relative;

}



.bg-section .bg {

  position: absolute;

  inset: 0;

  z-index: -1;

  display: flex;

  align-items: center;

  justify-content: center;

  overflow: hidden;

  opacity: 0.03;

}



.bg-section .bg img {

  width: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



@media (max-width: 767px) {

  .bg-section .bg img {

    width: auto;

    height: calc(100% + 250px);

  }

}



.bg-section .bg-content {

  position: relative;

  z-index: 2;

}



.about-section {

  padding: 70px 0 72px;

  width: 100%;

  overflow: hidden;

}



@media (max-width: 767px) {

  .about-section {

    padding: 50px 0;

  }

}



.productServices-section {

  padding: 60px 0 70px;

  width: 100%;

  overflow: hidden;

}



@media (max-width: 767px) {

  .productServices-section {

    padding: 50px 0;

  }

}



.accreditations-section {

  padding: 45px 0;

  width: 100%;

  overflow: hidden;

}



@media (max-width: 767px) {

  .accreditations-section {

    padding: 50px 0;

  }

}



.accreditations-section .accreditations-content .section-title {

  align-items: center;

}



.qualityMarks-section {

  padding: 60px 0;

  width: 100%;

  overflow: hidden;

}



@media (max-width: 767px) {

  .qualityMarks-section {

    padding: 50px 0;

  }

}



.why-section {

  padding: 50px 0 37px;

  width: 100%;

  overflow: hidden;

}



@media (max-width: 767px) {

  .why-section {

    padding: 50px 0;

  }

}



.more-content {

  display: flex;

  align-items: center;

  justify-content: center;

  margin-top: 40px;

}



@media (max-width: 767px) {

  .more-content {

    margin-top: 30px;

  }

}



.contact-section {

  padding: 70px 70px 237px;

  overflow: hidden;

  width: 100%;

  position: relative;

}



@media (max-width: 991px) {

  .contact-section {

    padding: 70px 20px 237px;

  }

}



@media (max-width: 767px) {

  .contact-section {

    padding: 70px 15px 120px;

  }

}



.facts-list {

  padding: 9px 0 16px;

  display: grid;

  grid-template-columns: 1fr;

  gap: 70px;

}



.fact-item {

  display: flex;

  align-items: center;

  gap: 33px;

}



.fact-item:nth-of-type(even) {

  flex-direction: row-reverse;

}



@media (max-width: 991px) {

  .fact-item {

    flex-direction: column;

    align-items: flex-start;

    gap: 0px;

  }



  .fact-item:nth-of-type(even) {

    flex-direction: column;

  }

}



.fact-item .fact-img {

  width: 240px;

  aspect-ratio: 240/205;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  padding: 20px;

  overflow: hidden;

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  flex-shrink: 0;

}



.darkMode .fact-item .fact-img {

  border: 2px solid #333;

}



.fact-item .fact-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .fact-item .fact-img {

    margin-bottom: 15px;

  }

}



@media (max-width: 767px) {

  .fact-item .fact-img {

    margin: 0 auto 15px;

  }

}



.fact-item .fact-title {

  display: flex;

  align-items: center;

  font-size: 32px;

  font-weight: 600;

  color: var(--text);

  gap: 15px;

  line-height: 1.3125;

  margin: 0 0 15px;

}



.fact-item .fact-title::before {

  content: "";

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 32px;

  aspect-ratio: 42/39;

  opacity: 0.3;

  flex-shrink: 0;

}



.darkMode .fact-item .fact-title::before {

  filter: brightness(0) invert(1);

}



.fact-item .fact-title.mobile {

  display: none;

}



@media (max-width: 991px) {

  .fact-item .fact-title {

    display: none;

  }



  .fact-item .fact-title.mobile {

    display: flex;

  }

}



@media (max-width: 767px) {

  .fact-item .fact-title {

    width: 100%;

    flex-direction: column;

    justify-content: center;

    text-align: center;

    font-size: 24px;

    gap: 10px;

  }

}



.fact-item .fact-subtitle {

  font-size: 18px;

  font-weight: 700;

  color: #40444c;

  line-height: 1.5;

  padding-inline-start: 11px;

  margin-bottom: 13px;

}



.darkMode .fact-item .fact-subtitle {

  color: #ccc;

}



@media (max-width: 767px) {

  .fact-item .fact-subtitle {

    text-align: center;

    padding: 0;

  }

}



.fact-item .fact-features {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

  padding-inline-start: 15px;

  border-inline-start: 1px solid #bf1e2e;

}



@media (max-width: 767px) {

  .fact-item .fact-features {

    font-size: 16px;

  }

}



.fact-item .fact-features li {

  display: flex;

  align-items: flex-start;

}



.fact-item .fact-features li::before {

  content: "";

  background-color: var(--text2);

  width: 5px;

  height: 5px;

  border-radius: 50%;

  flex-shrink: 0;

  transform: translateY(10px);

  margin-inline-end: 5px;

}



.media-block {

  background-color: var(--mode);

  border: 1px solid #e2e6ee;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  padding: 30px;

}



@media (max-width: 991px) {

  .media-block {

    padding: 20px 15px;

  }

}



.media-block ~ .media-block {

  margin-top: 30px;

}



@media (max-width: 767px) {

  .media-block ~ .media-block {

    margin-top: 15px;

  }

}



.darkMode .media-block {

  border-color: #333;

}



.media-block .block-head {

  padding: 10px 10px 30px;

}



@media (max-width: 767px) {

  .media-block .block-head {

    padding: 0 0 15px;

  }

}



.media-block .section-title {

  align-items: flex-start;

  margin: 0 0 10px;

}



.media-block .block-title {

  font-size: 18px;

  font-weight: 500;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 10px;

}



@media (max-width: 767px) {

  .media-block .block-title {

    font-size: 16px;

  }

}



.media-block .block-date {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: #ff717f;

  display: flex;

}



@media (max-width: 767px) {

  .media-block .block-date {

    font-size: 16px;

  }

}



.media-block .block-images {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 15px;

}



@media (max-width: 767px) {

  .media-block .block-images {

    gap: 10px;

    grid-template-columns: repeat(2, 1fr);

  }

}



.media-block .block-img {

  width: 100%;

  aspect-ratio: 266/350;

  border-radius: 20px;

  overflow: hidden;

  border: 1px solid #e2e6ee;

  padding: 0;

  position: relative;

  transition: all 0.3s ease-in-out;

}



.darkMode .media-block .block-img {

  border-color: #333;

}



.media-block .block-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.media-block .block-img .image-caption {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: flex;

  align-items: flex-end;

  justify-content: center;

  padding: 42px 10px;

  background: linear-gradient(

    180deg,

    rgba(255, 255, 255, 0.3) 0%,

    rgba(131, 167, 161, 0.9584) 51.21%,

    #035245 100%

  );

  visibility: hidden;

  opacity: 0;

  transition: all 0.3s ease-in-out;

}



@media (max-width: 1199px) {

  .media-block .block-img .image-caption {

    padding: 20px 5px;

  }

}



.media-block .block-img .icon {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  display: flex;

  align-items: center;

  justify-content: center;

  fill: #fff;

}



.media-block .block-img .image-title {

  font-size: 20px;

  line-height: 1.5;

  color: #fff;

  font-weight: 700;

  text-align: center;

  margin: 0;

}



@media (max-width: 1199px) {

  .media-block .block-img .image-title {

    font-size: 14px;

  }

}



.media-block .block-img:hover {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.darkMode .media-block .block-img:hover {

  box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.15);

}



.media-block .block-img:hover .image-caption {

  visibility: visible;

  opacity: 1;

}



.modal-backdrop {

  background: linear-gradient(

    270deg,

    rgba(0, 0, 0, 0.7) 0%,

    rgba(54, 54, 54, 0.9) 100%

  );

  --bs-backdrop-opacity: 1;

}



@media (min-width: 1200px) {

  .media-modal .modal-dialog {

    --bs-modal-width: 970px;

    margin-inline: auto;

    width: var(--bs-modal-width);

  }

}



.media-modal .modal-content {

  border-radius: 30px;

  border: none;

  border-top: 1px solid #333333;

  padding: 60px 40px 50px;

  position: relative;

  background-color: #f8f8f8;

}



.darkMode .media-modal .modal-content {

  background-color: var(--mode);

}



@media (max-width: 991px) {

  .media-modal .modal-content {

    border-radius: 15px;

    padding: 40px 15px 15px;

  }

}



.media-modal .modal-header {

  border: none;

  margin: 0;

  padding: 0;

  text-align: center;

  justify-content: center;

}



.media-modal .modal-close {

  position: absolute;

  top: 33px;

  inset-inline-end: 33px;

  fill: #333;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 0;

  transition: all 0.3s ease-in-out;

}



.media-modal .modal-close:hover {

  fill: #035245;

}



.darkMode .media-modal .modal-close {

  fill: #ff717f;

}



.darkMode .media-modal .modal-close:hover {

  fill: #035245;

}



@media (max-width: 991px) {

  .media-modal .modal-close {

    width: 25px;

    height: 25px;

    top: 10px;

    inset-inline-end: 10px;

  }

}



.media-modal .modal-title {

  text-align: center;

  font-size: 24px;

  line-height: 1.5;

  font-weight: 700;

  color: var(--text);

  margin: 0 0 30px;

}



.media-main-slider {

  margin: 0 0 20px;

}



.media-main-img {

  width: 100%;

  max-width: 518px;

  aspect-ratio: 518/682;

  margin: 0 auto;

  border-radius: 20px;

  overflow: hidden;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.media-main-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.media-thumbs-slider {

  position: relative;

  padding: 0 87px;

}



@media (max-width: 991px) {

  .media-thumbs-slider {

    padding: 0;

  }

}



.media-thumbs-slider .swiper-btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  width: 56px;

  height: 56px;

  border: 2px solid #035245;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: transparent;

  fill: #035245;

  cursor: pointer;

  transition: 0.3s ease-in-out;

  transition-property: fill, background-color;

}



.media-thumbs-slider .swiper-btn:hover {

  fill: #fff;

  background-color: #035245;

}



@media (max-width: 991px) {

  .media-thumbs-slider .swiper-btn {

    display: none;

  }

}



.media-thumbs-slider .swiper-btn.swiper-btn-prev {

  inset-inline-start: 0;

}



.media-thumbs-slider .swiper-btn.swiper-btn-next {

  inset-inline-end: 0;

}



html[dir="ltr"] .media-thumbs-slider .swiper-btn svg {

  transform: scaleX(-1);

}



.darkMode .media-thumbs-slider .swiper-btn {

  border: 2px solid #fff;

  fill: #fff;

}



.darkMode .media-thumbs-slider .swiper-btn:hover {

  fill: #035245;

  background-color: #fff;

}



.media-thumb-img {

  width: 100%;

  aspect-ratio: 131/150;

  border: 1px solid #e2e6ee;

  cursor: pointer;

  transition: all 0.3s ease-in-out;

}



.media-thumb-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.swiper-slide-thumb-active .media-thumb-img {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.specification-block {

  padding: 35px 30px 30px;

  background-color: var(--mode);

  border-radius: 25px;

  border-bottom: 5px solid #ff717f;

  box-shadow: 0px -2px 2px 1px rgba(16, 24, 40, 0.0509803922);

}



@media (max-width: 1199px) {

  .specification-block {

    padding: 30px;

  }

}



@media (max-width: 991px) {

  .specification-block {

    padding: 20px 15px;

  }

}



.specification-block ~ .specification-block {

  margin-top: 30px;

}



@media (max-width: 767px) {

  .specification-block ~ .specification-block {

    margin-top: 15px;

  }

}



.darkMode .specification-block {

  border: 1px solid #333;

  border-bottom: 5px solid #ff717f;

}



.specification-block .block-flex {

  display: flex;

  align-items: center;

  gap: 30px;

}



@media (max-width: 991px) {

  .specification-block .block-flex {

    flex-direction: column;

    align-items: flex-start;

  }

}



.specification-block .block-title {

  font-size: 24px;

  font-weight: 600;

  color: var(--text);

  line-height: 1.5;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .specification-block .block-title {

    font-size: 20px;

  }

}



.specification-block .block-subtitle {

  font-size: 20px;

  font-weight: 500;

  color: #40444c;

  line-height: 1.5;

  margin: 0 0 10px;

}



@media (max-width: 991px) {

  .specification-block .block-subtitle {

    font-size: 18px;

  }

}



.specification-block .block-subtitle span {

  font-size: 16px;

  font-weight: 400;

  color: var(--text2);

}



@media (max-width: 991px) {

  .specification-block .block-subtitle span {

    font-size: 14px;

  }

}



.darkMode .specification-block .block-subtitle {

  color: #ccc;

}



.specification-block .block-description {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

}



@media (max-width: 991px) {

  .specification-block .block-description {

    font-size: 16px;

  }

}



.specification-block .block-text {

  width: 100%;

}



.specification-block .block-img {

  width: 100%;

  flex-shrink: 0;

}



.specification-block .block-img .img-here {

  overflow: hidden;

  width: 100%;

  border-radius: 20px;

  display: flex;

}



.specification-block .block-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.main-block {

  padding: 50px 30px;

  border-bottom: none;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



@media (max-width: 1199px) {

  .main-block {

    padding: 30px;

  }

}



.main-block .block-img {

  max-width: 408px;

  margin-inline-start: 20px;

}



.main-block .block-img .img-here {

  width: 100%;

  aspect-ratio: 408/355;

}



@media (max-width: 1199px) {

  .main-block .block-img {

    margin: 0;

  }

}



.darkMode .main-block {

  border: 1px solid #333;

}



@media (max-width: 991px) {

  .main-block .block-flex {

    flex-direction: column-reverse;

  }

}



.properties-block .block-title {

  margin-bottom: 25px;

}



.properties-block .block-img {

  max-width: 333px;

  margin: 0 40px;

}



@media (max-width: 1199px) {

  .properties-block .block-img {

    margin: 0;

  }

}



.properties-block .block-img .img-here {

  border-radius: 15px;

  aspect-ratio: 333/468;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.properties-block .block-img .img-caption {

  display: block;

  text-align: center;

  font-size: 20px;

  font-weight: 600;

  color: var(--text);

  line-height: 1.4;

  margin: 15px 0 0;

}



.properties-block .properties-table {

  border: 1px solid #e1e4ea;

  border-radius: 10px;

  overflow: hidden;

}



.properties-block .properties-table .table-item {

  display: grid;

  grid-template-columns: 1fr 1fr;

  border-bottom: 1px solid #e1e4ea;

}



.properties-block .properties-table .table-item:last-of-type {

  border: none;

}



.properties-block .properties-table span,

.properties-block .properties-table strong {

  height: 50px;

  display: flex;

  align-items: center;

  padding: 0 16px;

}



@media (max-width: 991px) {

  .properties-block .properties-table span,

  .properties-block .properties-table strong {

    padding: 10px;

    height: auto;

  }

}



.properties-block .properties-table span {

  background-color: var(--mode);

  font-size: 14px;

  color: var(--text2);

  font-weight: 400;

  border-inline-start: 1px solid #e1e4ea;

}



.properties-block .properties-table strong {

  font-size: 16px;

  color: var(--text);

  background-color: rgba(58, 174, 7, 0.051);

}



@media (max-width: 991px) {

  .properties-block .properties-table strong {

    font-size: 14px;

  }

}



.specification-note {

  font-size: 20px;

  color: #40444c;

  line-height: 1.5;

  font-weight: 500;

  margin-top: 20px;

}



.darkMode .specification-note {

  color: #ccc;

}



@media (max-width: 991px) {

  .specification-note {

    font-size: 16px;

  }

}



.specifications-tabs {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 0 68px 13px;

  border-bottom: 2px solid #e2e6ee;

  gap: 40px;

  position: relative;

  margin-bottom: 25px;

}



@media (max-width: 991px) {

  .specifications-tabs {

    padding: 0 20px 13px;

    gap: 20px;

    justify-content: center;

  }

}



.specifications-tabs::after,

.specifications-tabs::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  bottom: -6px;

  display: flex;

}



.specifications-tabs::before {

  inset-inline-start: 0;

}



.specifications-tabs::after {

  inset-inline-end: 0;

}



.specifications-tabs button {

  font-size: 16px;

  font-weight: 500;

  line-height: 1.5;

  padding: 0;

  color: var(--text2);

  position: relative;

  transition: all 0.3s ease-in-out;

}



.specifications-tabs button::after {

  content: "";

  position: absolute;

  width: 80px;

  height: 4px;

  background-color: #ff717f;

  bottom: -16px;

  left: 50%;

  transform: translateX(-50%) scaleX(0);

  transform-origin: center;

  transition: all 0.3s ease-in-out;

}



.specifications-tabs button:hover {

  color: var(--text);

}



.specifications-tabs button.active {

  color: var(--text);

}



.specifications-tabs button.active::after {

  transform: translateX(-50%) scaleX(1);

}



.dimensions-block .block-description {

  margin-bottom: 30px;

}



.dimensions-block .block-subtitle {

  margin-bottom: 15px;

}



.dimensions-block .block-img {

  max-width: 400px;

}



.dimensions-block .img-here {

  aspect-ratio: 400/350;

}



.dimensions-block .img-hint {

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 10px;

  font-size: 14px;

  line-height: 1.5;

  color: var(--text2);

  border: 1px solid #e2e6ee;

  border-radius: 10px;

  margin-top: 15px;

}



@media (max-width: 767px) {

  .dimensions-block .img-hint {

    font-size: 13px;

  }

}



.dimensions-block .img-hint .icon {

  stroke: var(--text2);

  margin-inline-end: 10px;

}



@media (max-width: 767px) {

  .dimensions-block .img-hint .icon {

    margin-inline-end: 5px;

  }

}



.dimensions-block .img-hint .hint-close {

  padding: 0;

  margin-inline-start: auto;

  fill: var(--text);

  stroke: var(--text);

  transition: all 0.3s ease-in-out;

}



.dimensions-block .img-hint .hint-close:hover {

  fill: #bf1e2e;

  stroke: #bf1e2e;

}



.dimensions-block .dimensions-table {

  border: 1px solid #e1e4ea;

  border-radius: 10px;

  overflow: hidden;

  margin-bottom: 10px;

}



.dimensions-block .table-item {

  display: grid;

  grid-template-columns: 1fr 1fr 1fr;

  border-bottom: 1px solid #e1e4ea;

}



@media (max-width: 767px) {

  .dimensions-block .table-item {

    grid-template-columns: 2fr 1fr 1fr;

  }

}



.dimensions-block .table-item:last-of-type {

  border: none;

}



.dimensions-block .table-item span {

  padding: 0 16px;

  height: 55px;

  display: flex;

  align-items: center;

  font-size: 14px;

  font-weight: 400;

  color: var(--text2);

  max-width: 100%;

  overflow: hidden;

}



.dimensions-block .table-item span ~ span {

  border-inline-start: 1px solid #e1e4ea;

}



@media (max-width: 991px) {

  .dimensions-block .table-item span {

    padding: 10px;

    height: auto;

  }

}



.dimensions-block .table-item.table-head span {

  font-size: 16px;

  color: var(--text);

  font-weight: 500;

  background-color: rgba(58, 174, 7, 0.051);

}



@media (max-width: 991px) {

  .dimensions-block .table-item.table-head span {

    font-size: 14px;

  }

}



.dimensions-block .dimensions-note {

  font-size: 16px;

  color: #eb5757;

  font-weight: 400;

  margin: 0;

  line-height: 1.5;

}



.description-block .block-title {

  margin: 0;

}



.description-block .block-img {

  max-width: 639px;

  margin: 0 auto 30px;

}



.description-block .img-here {

  aspect-ratio: 639/450;

}



.library-content {

  padding: 40px 30px 50px;

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

}



@media (max-width: 991px) {

  .library-content {

    padding: 20px 15px;

  }

}



.darkMode .library-content {

  border: 2px solid #333;

}



.library-list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



@media (max-width: 1199px) {

  .library-list {

    gap: 15px;

  }

}



@media (max-width: 991px) {

  .library-list {

    grid-template-columns: 1fr 1fr;

  }

}



@media (max-width: 767px) {

  .library-list {

    grid-template-columns: 1fr;

  }

}



.library-item {

  display: flex;

  width: 100%;

  aspect-ratio: 350/260;

  border-radius: 20px;

  overflow: hidden;

  position: relative;

}



@media (max-width: 767px) {

  .library-item {

    max-width: 350px;

    margin: 0 auto;

  }

}



.library-item img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.library-item .library-title {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: flex;

  align-items: flex-end;

  text-align: center;

  justify-content: center;

  padding: 25px 5px;

  background: linear-gradient(

    180deg,

    rgba(255, 255, 255, 0.3) 0%,

    rgba(131, 167, 161, 0) 51.21%,

    #035245 100%

  );

  font-size: 20px;

  font-weight: 700;

  color: #fff;

  margin: 0;

  line-height: 1.5;

}



@media (max-width: 1199px) {

  .library-item .library-title {

    font-size: 16px;

  }

}



@media (max-width: 767px) {

  .library-item .library-title {

    font-size: 18px;

  }

}



.library-item::after {

  content: "";

  position: absolute;

  inset: 0;

  border-bottom: 5px solid #ff717f;

  border-radius: 20px;

  visibility: hidden;

  opacity: 0;

  transition: all 0.3s ease-in-out;

}



.library-item:hover img {

  transform: scale(1.1);

}



.library-item:hover::after {

  visibility: visible;

  opacity: 1;

}



.library-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 30px;

}



.darkMode .library-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .library-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .library-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.library-accordion .accordion-item {

  background-color: var(--mode);

  border-radius: 15px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  padding: 0 30px;

  border: none;

}



@media (max-width: 991px) {

  .library-accordion .accordion-item {

    padding: 0 20px;

  }

}



.library-accordion .accordion-item ~ .accordion-item {

  margin-top: 30px;

}



@media (max-width: 991px) {

  .library-accordion .accordion-item ~ .accordion-item {

    margin-top: 20px;

  }

}



.darkMode .library-accordion .accordion-item {

  border: 2px solid #333;

}



.library-accordion .accordion-button {

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: transparent;

  padding: 20px 0 17px;

  border: none;

  font-size: 20px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.4;

  border-radius: 0;

  box-shadow: none;

  gap: 10px;

}



@media (max-width: 991px) {

  .library-accordion .accordion-button {

    font-size: 18px;

    padding: 15px 0;

  }

}



.library-accordion .accordion-button .number {

  width: 40px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background-color: #035245;

  color: #fff;

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  flex-shrink: 0;

}



@media (max-width: 991px) {

  .library-accordion .accordion-button .number {

    font-size: 16px;

    width: 30px;

  }

}



.library-accordion .accordion-button .icon {

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 26px;

  aspect-ratio: 26/24;

  opacity: 0.3;

  margin-inline-end: 5px;

}



@media (max-width: 767px) {

  .library-accordion .accordion-button .icon {

    width: 20px;

  }

}



.darkMode .library-accordion .accordion-button .icon {

  filter: brightness(0) invert(1);

}



.library-accordion .accordion-button .plus {

  display: flex;

  align-items: center;

  justify-content: center;

  width: 18px;

  aspect-ratio: 1;

  margin-inline-start: auto;

  position: relative;

  flex-shrink: 0;

}



@media (max-width: 991px) {

  .library-accordion .accordion-button .plus {

    width: 16px;

  }

}



.library-accordion .accordion-button .plus::after,

.library-accordion .accordion-button .plus::before {

  content: "";

  border-radius: 2px;

  background-color: #40444c;

  transition: all 0.3s ease-in-out;

}



.darkMode .library-accordion .accordion-button .plus::after,

.darkMode .library-accordion .accordion-button .plus::before {

  background-color: #ccc;

}



.library-accordion .accordion-button .plus::after {

  width: 100%;

  height: 3px;

}



.library-accordion .accordion-button .plus::before {

  position: absolute;

  height: 100%;

  width: 3px;

  top: 50%;

  left: 50%;

  transform: translateX(-50%) translateY(-50%);

}



.library-accordion .accordion-button::after {

  display: none;

}



.library-accordion .accordion-button:not(.collapsed) .plus::before {

  opacity: 0;

  transform: translateX(-50%) translateY(-50%) rotate(90deg);

}



.library-accordion .accordion-body {

  padding: 20px 0 30px;

  position: relative;

  border-top: 2px solid #e2e6ee;

}



@media (max-width: 991px) {

  .library-accordion .accordion-body {

    padding: 15px 0 25px;

  }

}



.library-accordion .accordion-body::after,

.library-accordion .accordion-body::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  top: -10px;

  display: flex;

  opacity: 0;

  visibility: hidden;

}



.library-accordion .accordion-body::before {

  inset-inline-start: 0;

}



.library-accordion .accordion-body::after {

  inset-inline-end: 0;

}



.library-accordion .accordion-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 25px;

}



@media (max-width: 991px) {

  .library-accordion .accordion-description {

    font-size: 16px;

    margin: 0 0 20px;

  }

}



.library-accordion .show .accordion-body::after,

.library-accordion .show .accordion-body:before {

  opacity: 1;

  visibility: visible;

  transition: all 0.3s ease-in-out;

}



.library-accordion .studies-title {

  font-size: 20px;

  font-weight: 600;

  line-height: 1.5;

  color: #40444c;

  margin: 0 0 17px;

}



.darkMode .library-accordion .studies-title {

  color: #ccc;

}



@media (max-width: 991px) {

  .library-accordion .studies-title {

    font-size: 18px;

  }

}



.studies-list {

  /*display: grid;*/

  /*grid-template-columns: 1fr;*/

  /*gap: 20px;*/

}

.study-item:not(:last-of-type) {

  margin-bottom: 30px;

}

.study-item {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  border: 1px solid #e2e6ee;

  border-radius: 20px;

  padding: 32px 30px;

}



@media (max-width: 991px) {

  .study-item {

    padding: 20px 15px;

    /*gap: 30px;*/

  }

}



@media (max-width: 767px) {

  .study-item {

    flex-direction: column;

    align-items: flex-start;

    gap: 0;

  }

}



.darkMode .study-item {

  border: 1px solid #333;

}



.study-item .study-img {

  width: 100%;

  max-width: 241px;

  aspect-ratio: 241/205;

  border-radius: 20px;

  background: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 20px;

  flex-shrink: 0;

}



.study-item .study-img img {

  max-width: 100%;

  max-height: 92px;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 767px) {

  .study-item .study-img {

    width: 150px;

    aspect-ratio: 150/75;

    padding: 0;

  }

}



.study-item .study-text {

  padding: 0 37px;

}



@media (max-width: 991px) {

  .study-item .study-text {

    padding: 0;

  }

}



.study-item .study-title {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text);

  font-weight: 500;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 1;

  -webkit-box-orient: vertical;

  margin: 0 0 10px;

}



@media (max-width: 991px) {

  .study-item .study-title {

    font-size: 16px;

  }

}



.study-item .study-title a {

  color: inherit;

  transition: all 0.3s ease-in-out;

}



.study-item .study-title a:hover {

  color: #bf1e2e;

}



.darkMode .study-item .study-title a:hover {

  color: #ff717f;

}



.study-item .study-summary {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  font-weight: 400;

  display: block;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 4;

  -webkit-box-orient: vertical;

  margin: 0 0 15px;

}



.study-item .study-summary:is(span) {

  margin: 0 0 10px;

}



.study-item .study-summary a {

  text-decoration: underline;

  transition: all 0.3s ease-in-out;

}



.study-item .study-summary a:hover {

  text-decoration: none;

  color: #bf1e2e;

}



.darkMode .study-item .study-summary a:hover {

  color: #ff717f;

}



@media (max-width: 991px) {

  .study-item .study-summary {

    font-size: 16px;

  }

}



.organizations-list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 35px;

  margin-bottom: 30px;

}



@media (max-width: 991px) {

  .organizations-list {

    gap: 15px;

    margin-bottom: 20px;

  }

}



@media (max-width: 767px) {

  .organizations-list {

    grid-template-columns: 1fr;

  }

}



.organizations-list .organization-item {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 20px;

  border: 3px solid #e2e6ee;

  border-radius: 20px;

  overflow: hidden;

  padding: 20px;

  width: 100%;

  aspect-ratio: 347/237;

}



@media (max-width: 767px) {

  .organizations-list .organization-item {

    max-width: 300px;

    margin-inline: auto;

  }

}



.organizations-list .organization-item img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



.darkMode .organizations-list .organization-item {

  border-color: #333;

}



.videos-list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



@media (max-width: 991px) {

  .videos-list {

    gap: 15px;

  }

}



@media (max-width: 767px) {

  .videos-list {

    grid-template-columns: 1fr;

  }

}



.videos-list .video-item {

  width: 100%;

  aspect-ratio: 350/260;

  border-radius: 20px;

  overflow: hidden;

  padding: 0;

  position: relative;

  transition: all 0.3s ease-in-out;

}



.videos-list .video-item img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.videos-list .video-item .image-caption {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  display: flex;

  align-items: flex-end;

  justify-content: center;

  padding: 34px 10px;

  background: linear-gradient(

    180deg,

    rgba(3, 82, 69, 0.8) 0%,

    rgba(28, 28, 28, 0.6) 51.21%,

    rgba(3, 82, 69, 0.8) 100%

  );

  transition: all 0.3s ease-in-out;

}



@media (max-width: 1199px) {

  .videos-list .video-item .image-caption {

    padding: 20px 5px;

  }

}



.videos-list .video-item .icon {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  display: flex;

  align-items: center;

  justify-content: center;

  stroke: #fff;

}



.videos-list .video-item .image-title {

  font-size: 18px;

  line-height: 1.5;

  color: #fff;

  font-weight: 600;

  text-align: center;

  margin: 0;

}



@media (max-width: 1199px) {

  .videos-list .video-item .image-title {

    font-size: 14px;

  }

}



.videos-list .video-item:hover img {

  transform: scale(1.1);

}



.news-list {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



@media (max-width: 1199px) {

  .news-list {

    gap: 30px 15px;

  }

}



@media (max-width: 991px) {

  .news-list {

    grid-template-columns: repeat(2, 1fr);

    gap: 30px;

  }

}



@media (max-width: 991px) {

  .news-list {

    grid-template-columns: 1fr;

    gap: 20px;

  }

}



.article-item {

  width: 100%;

  position: relative;

  margin-bottom: 20px;

  display: flex;

  flex-direction: column;

}



@media (max-width: 767px) {

  .article-item {

    max-width: 370px;

    margin-inline: auto;

  }

}



.article-item .article-img {

  display: flex;

  width: 100%;

  overflow: hidden;

  border-radius: 20px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  aspect-ratio: 370/230;

  flex-shrink: 0;

}



.article-item .article-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.article-item .article-img:hover img {

  transform: scale(1.1);

}



.darkMode .article-item .article-img {

  border: 1px solid #333;

}



.article-item .article-information {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  background-color: var(--mode);

  border-radius: 20px;

  padding: 26px 23px 40px;

  text-align: center;

  margin-top: -20px;

  position: relative;

  z-index: 2;

  height: 100%;

}



.darkMode .article-item .article-information {

  border: 1px solid #333;

}



.article-item .article-head {

  position: relative;

  margin: 0 0 15px;

}



.article-item .article-head::before {

  content: "";

  position: absolute;

  top: -6px;

  left: 50%;

  transform: translateX(-50%);

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 42px;

  height: 39px;

  opacity: 0.1;

}



.darkMode .article-item .article-head::before {

  filter: brightness(0) invert(1);

}



.article-item .article-title {

  font-size: 20px;

  font-weight: 600;

  position: relative;

  z-index: 2;

  color: var(--text);

  line-height: 1.4;

  text-align: center;

  display: -webkit-box;

  -webkit-line-clamp: 2;

  /* -webkit-line-clamp: 3; */

  -webkit-box-orient: vertical;

  height: 56px;

  /* height: 84px; */

  overflow: hidden;

  margin: 0;

  text-transform: capitalize;

}



.article-item .article-title a {

  color: inherit;

  transition: all 0.3s ease-in-out;

}



.article-item .article-title a:hover {

  color: #bf1e2e;

}



.article-item .article-summary {

  font-size: 16px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  /* -webkit-line-clamp: 4; */

  -webkit-box-orient: vertical;

  overflow: hidden;

  height: 72px;

  /* height: 96px; */

  margin: 0;

}



.article-item .article-btn {

  position: absolute;

  bottom: -20px;

  left: 50%;

  z-index: 3;

  transform: translateX(-50%);

}



.article-item .article-date {

  position: absolute;

  top: 15px;

  inset-inline-end: 15px;

  background: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  padding: 0 10px;

  height: 40px;

  border-radius: 5px;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 7px;

  font-size: 16px;

  color: var(--text);

  font-weight: 400;

  stroke: #ff717f;

}



.darkMode .article-item .article-date {

  border: 2px solid #333;

}



.handling-main-img {

  width: 100%;

  max-width: 850px;

  aspect-ratio: 850/243;

  border-radius: 20px;

  overflow: hidden;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  margin: 0 auto 50px;

}



@media (max-width: 991px) {

  .handling-main-img {

    aspect-ratio: 2/1;

    margin-bottom: 30px;

  }

}



.darkMode .handling-main-img {

  border: 1px solid #333;

}



.handling-main-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.handling-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 50px;

}



.darkMode .handling-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .handling-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 30px;

  }



  .darkMode .handling-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.handling-item {

  display: flex;

  align-items: center;

  gap: 33px;

  margin-bottom: 50px;

}



@media (max-width: 991px) {

  .handling-item {

    flex-direction: column;

    align-items: flex-start;

    gap: 0px;

    margin-bottom: 30px;

  }

}



.handling-item .item-img {

  width: 239px;

  aspect-ratio: 239/204;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  padding: 20px;

  overflow: hidden;

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  flex-shrink: 0;

}



.handling-item .item-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



.darkMode .handling-item .item-img {

  border: 2px solid #333;

}



@media (max-width: 991px) {

  .handling-item .item-img {

    margin-bottom: 15px;

  }

}



@media (max-width: 767px) {

  .handling-item .item-img {

    margin: 0 auto 15px;

  }

}



.handling-item .item-title {

  display: flex;

  align-items: center;

  font-size: 32px;

  font-weight: 600;

  color: var(--text);

  gap: 15px;

  line-height: 1.3125;

  margin: 0 0 15px;

}



.handling-item .item-title::before {

  content: "";

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 32px;

  aspect-ratio: 42/39;

  opacity: 0.3;

  flex-shrink: 0;

}



.darkMode .handling-item .item-title::before {

  filter: brightness(0) invert(1);

}



.handling-item .item-title.mobile {

  display: none;

}



@media (max-width: 991px) {

  .handling-item .item-title {

    display: none;

  }



  .handling-item .item-title.mobile {

    display: flex;

  }

}



@media (max-width: 767px) {

  .handling-item .item-title {

    width: 100%;

    flex-direction: column;

    justify-content: center;

    text-align: center;

    font-size: 24px;

    gap: 10px;

  }

}



.handling-item .item-subtitle {

  font-size: 18px;

  font-weight: 700;

  color: #40444c;

  line-height: 1.5;

  padding-inline-start: 11px;

  margin-bottom: 13px;

}



.darkMode .handling-item .item-subtitle {

  color: #ccc;

}



@media (max-width: 767px) {

  .handling-item .item-subtitle {

    text-align: center;

    padding: 0;

  }

}



.handling-item .item-features {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

  padding-inline-start: 15px;

  border-inline-start: 1px solid #bf1e2e;

}



@media (max-width: 767px) {

  .handling-item .item-features {

    font-size: 16px;

  }

}



.handling-item .item-features li {

  display: flex;

  align-items: flex-start;

}



.handling-item .item-features li::before {

  content: "";

  background-color: var(--text2);

  width: 5px;

  height: 5px;

  border-radius: 50%;

  flex-shrink: 0;

  transform: translateY(10px);

  margin-inline-end: 5px;

}



.handling-item .item-description {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

  padding-inline-start: 15px;

  border-inline-start: 1px solid #bf1e2e;

}



@media (max-width: 767px) {

  .handling-item .item-description {

    font-size: 16px;

  }

}



.handling-block {

  padding: 30px;

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

}



@media (max-width: 991px) {

  .handling-block {

    padding: 20px;

  }

}



.darkMode .handling-block {

  border: 2px solid #333;

}



.handling-block ~ .handling-block {

  margin-top: 40px;

}



@media (max-width: 991px) {

  .handling-block ~ .handling-block {

    margin-top: 25px;

  }

}



.handling-block img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.handling-block .block-title {

  font-size: 24px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.42;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .handling-block .block-title {

    font-size: 20px;

    margin-bottom: 15px;

  }

}



.handling-block .block-subtitle {

  font-size: 20px;

  font-weight: 500;

  line-height: 1.5;

  color: #40444c;

  margin: 0 0 15px;

}



.darkMode .handling-block .block-subtitle {

  color: #ccc;

}



@media (max-width: 991px) {

  .handling-block .block-subtitle {

    font-size: 18px;

  }

}



.handling-block .block-features {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .handling-block .block-features {

    margin-bottom: 20px;

  }

}



@media (max-width: 767px) {

  .handling-block .block-features {

    font-size: 16px;

  }

}



.handling-block .block-features li {

  display: flex;

  align-items: flex-start;

}



.handling-block .block-features li::before {

  content: "";

  background-color: var(--text2);

  width: 5px;

  height: 5px;

  border-radius: 50%;

  flex-shrink: 0;

  transform: translateY(10px);

  margin-inline-end: 5px;

}



.handling-block .block-imgs {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 20px;

  margin: 0 0 30px;

}



@media (max-width: 1199px) {

  .handling-block .block-imgs {

    gap: 10px;

  }

}



@media (max-width: 991px) {

  .handling-block .block-imgs {

    grid-template-columns: 1fr 1fr;

    margin-bottom: 20px;

  }

}



@media (max-width: 767px) {

  .handling-block .block-imgs {

    grid-template-columns: 1fr;

  }

}



.handling-block .img-item {

  width: 100%;

  aspect-ratio: 360/224;

  border-radius: 15px;

  display: flex;

  overflow: hidden;

}



@media (max-width: 767px) {

  .handling-block .img-item {

    max-width: 360px;

  }

}



.handling-block .block-note {

  text-align: center;

  font-size: 18px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .handling-block .block-note {

    margin-bottom: 20px;

  }

}



@media (max-width: 767px) {

  .handling-block .block-note {

    font-size: 16px;

  }

}



.handling-block .block-img {

  width: 100%;

  max-width: 800px;

  aspect-ratio: 800/229;

  display: flex;

  margin: 0 auto 30px;

}



@media (max-width: 767px) {

  .handling-block .block-img {

    margin-bottom: 20px;

  }

}



.handling-block .block-description {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .handling-block .block-description {

    margin-bottom: 20px;

  }

}



@media (max-width: 767px) {

  .handling-block .block-description {

    font-size: 16px;

  }

}



.handling-block .block-frame {

  border: 1px solid #e2e6ee;

  border-radius: 20px;

  padding: 30px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin: 0 0 30px;

}



.darkMode .handling-block .block-frame {

  border: 1px solid #333;

}



@media (max-width: 991px) {

  .handling-block .block-frame {

    padding: 20px;

    margin-bottom: 20px;

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

  }

}



.handling-block .frame-features {

  color: var(--text2);

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  display: grid;

  grid-template-columns: 1fr;

  gap: 10px;

  margin: 0 0 30px;

}



.handling-block .frame-img {

  width: 100%;

  max-width: 408px;

}



.handling-block .frame-img .img-here {

  width: 100%;

  display: flex;

  aspect-ratio: 408/254;

  border-radius: 20px;

  overflow: hidden;

  margin-bottom: 15px;

}



@media (max-width: 991px) {

  .handling-block .frame-img {

    max-width: 100%;

    margin: 0 auto;

  }



  .handling-block .frame-img .img-here {

    max-width: 408px;

    margin-inline: auto;

  }

}



.handling-block :last-child {

  margin: 0;

}



.laboratories-block {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  background-color: var(--mode);

  border-radius: 20px;

}



.darkMode .laboratories-block {

  border: 2px solid #333;

}



.laboratories-block.main-block {

  padding: 50px 40px;

  margin-bottom: 60px;

}



@media (max-width: 991px) {

  .laboratories-block.main-block {

    padding: 30px 15px;

    margin-bottom: 40px;

  }

}



.laboratories-block:last-child {

  margin: 0;

}



.laboratory-main {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 14px;

  margin-bottom: 40px;

}



@media (max-width: 991px) {

  .laboratory-main {

    flex-direction: column;

    justify-content: center;

    margin-bottom: 20px;

  }

}



.laboratory-main .laboratory-img {

  /*width: 35%;*/

  /*max-width: 376px;*/

  /*aspect-ratio: 396/337;*/

  padding: 20px;

  border-radius: 20px;

  overflow: hidden;

  /*flex-shrink: 0;*/

  /*display: flex;*/

  /*align-items: center;*/

  /*justify-content: center;*/

  background-color: #fff;

}



.laboratory-main .laboratory-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .laboratory-main .laboratory-img {

    /*width: 100%;*/

    /*aspect-ratio: 410/250;*/

    margin: 0 auto;

  }

}



.laboratory-main .laboratory-description {

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: var(--text2);

  margin: 0;

}



@media (max-width: 991px) {

  .laboratory-main .laboratory-description {

    font-size: 16px;

    text-align: center;

  }

}



.laboratory-certificates {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 30px;

  margin-bottom: 40px;

}



@media (max-width: 1199px) {

  .laboratory-certificates {

    gap: 15px;

  }

}



@media (max-width: 991px) {

  .laboratory-certificates {

    margin-bottom: 30px;

  }

}



@media (max-width: 767px) {

  .laboratory-certificates {

    grid-template-columns: 1fr;

  }

}



.laboratory-certificate {

  border: 1px solid #e2e6ee;

  background-color: var(--mode);

  border-radius: 20px;

  padding: 20px 45px 30px;

}



@media (max-width: 991px) {

  .laboratory-certificate {

    padding: 15px 15px 20px;

  }

}



.darkMode .laboratory-certificate {

  border-color: #333;

}



.laboratory-certificate .certificate-img {

  width: 100%;

  max-width: 410px;

  aspect-ratio: 410/250;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto;

  margin-bottom: 15px;

}



.laboratory-certificate .certificate-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .laboratory-certificate .certificate-img {

    max-width: 250px;

  }

}



.laboratory-certificate .certificate-summary {

  font-size: 16px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  text-align: center;

  display: -webkit-box;

  -webkit-line-clamp: 7;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 0 0 23px;

}



@media (max-width: 991px) {

  .laboratory-certificate .certificate-summary {

    font-size: 14px;

    margin: 0 0 15px;

  }

}



.laboratory-certificate .certificate-btn {

  margin: 0 auto;

}



.laboratories-note {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  font-weight: 400;

  text-align: center;

  margin: 0 0 0;

}



.laboratories-note a {

  text-decoration: underline;

  color: inherit;

  transition: all 0.3s ease-in-out;

}



.laboratories-note a:hover {

  color: #ff717f;

}



@media (max-width: 991px) {

  .laboratories-note {

    font-size: 16px;

  }

}



.laboratories-tabs-content {

  margin: 50px 0;

}



@media (max-width: 991px) {

  .laboratories-tabs-content {

    margin: 30px 0;

  }

}



.laboratories-tabs-content .laboratories-note {

  margin-top: 30px;

}



@media (max-width: 991px) {

  .laboratories-tabs-content .laboratories-note {

    margin-top: 20px;

  }

}



.laboratories-tabs {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 0 50px 13px;

  border-bottom: 2px solid #e2e6ee;

  gap: 40px;

  position: relative;

  margin-bottom: 25px;

}



@media (max-width: 991px) {

  .laboratories-tabs {

    padding: 0 5px 13px;

    gap: 15px;

    justify-content: center;

  }

}



.laboratories-tabs::after,

.laboratories-tabs::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  bottom: -6px;

  display: flex;

}



.laboratories-tabs::before {

  inset-inline-start: 0;

}



.laboratories-tabs::after {

  inset-inline-end: 0;

}



.laboratories-tabs button {

  font-size: 16px;

  font-weight: 500;

  line-height: 1.5;

  padding: 0;

  color: var(--text2);

  position: relative;

  transition: all 0.3s ease-in-out;

}



@media (max-width: 767px) {

  .laboratories-tabs button {

    font-size: 14px;

  }

}



.laboratories-tabs button::after {

  content: "";

  position: absolute;

  width: 80px;

  height: 4px;

  background-color: #ff717f;

  bottom: -16px;

  left: 50%;

  transform: translateX(-50%) scaleX(0);

  transform-origin: center;

  transition: all 0.3s ease-in-out;

}



.laboratories-tabs button:hover {

  color: var(--text);

}



.laboratories-tabs button.active {

  color: var(--text);

}



.laboratories-tabs button.active::after {

  transform: translateX(-50%) scaleX(1);

}



.laboratories-media {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 30px;

}



@media (max-width: 1199px) {

  .laboratories-media {

    gap: 15px;

  }

}



@media (max-width: 991px) {

  .laboratories-media {

    gap: 30px;

    grid-template-columns: 1fr 1fr;

  }

}



@media (max-width: 767px) {

  .laboratories-media {

    gap: 20px;

    grid-template-columns: 1fr;

  }

}



.laboratories-media-item {

  background-color: var(--mode);

  overflow: hidden;

  display: flex;

  flex-direction: column;

}



.laboratories-media-item .media-img {

  width: 100%;

  aspect-ratio: 350/240;

  display: flex;

  position: relative;

  overflow: hidden;

  border-radius: 20px 20px 0 0;

  flex-shrink: 0;

}



.laboratories-media-item .media-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.laboratories-media-item .media-img::after {

  content: "";

  position: absolute;

  inset: 0;

  background: linear-gradient(

    180deg,

    rgba(255, 255, 255, 0.3) 0%,

    rgba(131, 167, 161, 0) 51.21%,

    #035245 100%

  );

  display: block;

  z-index: 3;

}



.laboratories-media-item .media-img .icon {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  stroke: #fff;

  z-index: 4;

}



.laboratories-media-item .media-img.video::after {

  background: linear-gradient(

    180deg,

    rgba(3, 82, 69, 0.8) 0%,

    rgba(28, 28, 28, 0.6) 51.21%,

    rgba(3, 82, 69, 0.8) 100%

  );

}



.laboratories-media-item .media-img:hover img {

  transform: scale(1.1);

}



.laboratories-media-item .media-information {

  border: 1px solid #e2e6ee;

  padding: 20px;

  border-radius: 0 0 20px 20px;

  height: 100%;

}

.laboratories-media-item .media-information :last-child {

  margin: 0;

}

.darkMode .laboratories-media-item .media-information {

  border: 1px solid #333;

}



.laboratories-media-item .media-title {

  font-size: 20px;

  font-weight: 700;

  color: var(--text);

  line-height: 1.5;

  margin: 0 0 5px;

}



.laboratories-media-item .media-subtitle {

  font-size: 18px;

  color: #4c4d4d;

  font-weight: 400;

  line-height: 1.5;

  margin: 0 0 15px;

}



.darkMode .laboratories-media-item .media-subtitle {

  color: #ddd;

}



.laboratories-media-item .media-description {

  font-size: 16px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  margin: 0 0 15px;

  height: 72px;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  -webkit-box-orient: vertical;

}



.laboratories-media-item .media-device {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

}



.laboratories-media-item .media-device span {

  font-weight: 600;

  color: var(--text);

}



.offer-block {

  padding: 30px;

  margin-bottom: 40px;

}



@media (max-width: 991px) {

  .offer-block {

    padding: 25px 15px;

    margin: 0 0 20px;

  }

}



.offer-block .section-title {

  flex-direction: row;

  justify-content: flex-start;

  margin: 0 0 15px;

}



.offer-block .section-title::before {

  width: 33.5px;

}



@media (max-width: 991px) {

  .offer-block .section-title {

    flex-direction: column;

    align-items: flex-start;

    font-size: 22px;

  }

}



.offer-block .offer-description {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0 0 30px;

  padding-inline-start: 15px;

  border-inline-start: 1px solid #bf1e2e;

}



@media (max-width: 991px) {

  .offer-block .offer-description {

    font-size: 16px;

  }

}



.offer-information {

  display: grid;

  grid-template-columns: 1fr 1fr;

}



@media (max-width: 991px) {

  .offer-information {

    grid-template-columns: 1fr;

    gap: 15px;

  }

}



.offer-information .offer-img {

  display: flex;

  width: 100%;

  overflow: hidden;

  aspect-ratio: 555/781;

}



@media (max-width: 991px) {

  .offer-information .offer-img {

    max-width: 555px;

    margin: 0 auto;

  }

}



.offer-information .offer-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.offer-tables {

  padding-inline-start: 25px;

}



@media (max-width: 991px) {

  .offer-tables {

    padding: 0;

  }

}



.offer-table {

  border: 1px solid #e1e4ea;

  border-radius: 10px;

  overflow: hidden;

  margin-bottom: 30px;

}



@media (max-width: 991px) {

  .offer-table {

    margin-bottom: 15 [x];

  }

}



.offer-table .table-item {

  display: grid;

  grid-template-columns: 2fr 1fr;

  border-bottom: 1px solid #e1e4ea;

}



@media (max-width: 767px) {

  .offer-table .table-item {

    grid-template-columns: 3fr 2fr;

  }

}



.offer-table .table-item:last-of-type {

  border: none;

}



.offer-table .table-item span {

  padding: 0 16px;

  height: 55px;

  display: flex;

  align-items: center;

  font-size: 14px;

  font-weight: 400;

  color: var(--text2);

  max-width: 100%;

  overflow: hidden;

}



.offer-table .table-item span ~ span {

  border-inline-start: 1px solid #e1e4ea;

}



@media (max-width: 991px) {

  .offer-table .table-item span {

    padding: 10px;

    height: auto;

  }

}



.offer-table .table-item.table-head span {

  font-size: 16px;

  color: var(--text);

  font-weight: 500;

  background-color: rgba(58, 174, 7, 0.051);

}



@media (max-width: 991px) {

  .offer-table .table-item.table-head span {

    font-size: 14px;

  }

}



.offer-text {

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

}



.darkMode .offer-text {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .offer-text {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .offer-text {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.offer-text .offer-description {

  padding: 0;

  border: none;

  margin-bottom: 20px;

}



.accreditations-content .section-title {

  align-items: flex-start;

  margin-bottom: 30px;

}



.accreditations-subtitle {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  margin: 0 0 28px;

}



@media (max-width: 991px) {

  .accreditations-subtitle {

    font-size: 16px;

    margin-bottom: 20px;

  }

}



.accreditations-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 40px;

}



.darkMode .accreditations-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .accreditations-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .accreditations-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.institutions-content {

  margin: 0 0 40px;

}



@media (max-width: 991px) {

  .institutions-content {

    margin: 0 0 20px;

  }

}



.institutions-title {

  font-size: 20px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.4;

  margin: 0 0 11px;

}



.institutions-list {

  display: grid;

  grid-template-columns: repeat(10, 1fr);

  gap: 10px 0;

}



@media (max-width: 991px) {

  .institutions-list {

    grid-template-columns: repeat(8, 1fr);

  }

}



@media (max-width: 767px) {

  .institutions-list {

    grid-template-columns: repeat(6, 1fr);

  }

}



@media (max-width: 480px) {

  .institutions-list {

    grid-template-columns: repeat(4, 1fr);

  }

}



.institution-item {

  border: 2px solid #e2e6ee;

  background-color: #fff;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 5px;

}



.institution-item img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



.accreditations-list {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 30px;

  margin: 0 0 65px;

}



@media (max-width: 991px) {

  .accreditations-list {

    gap: 15px;

    margin: 0 0 40px;

  }

}



@media (max-width: 767px) {

  .accreditations-list {

    grid-template-columns: repeat(2, 1fr);

    gap: 15px;

  }

}



.accreditations-list .accreditation-item {

  display: flex;

  align-items: center;

  justify-content: center;

  aspect-ratio: 374/226;

}



.accreditations-block {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  padding: 30px 30px 50px;

  background-color: var(--mode);

  border-radius: 20px;

}



.darkMode .accreditations-block {

  border: 2px solid #333;

}



@media (max-width: 991px) {

  .accreditations-block {

    padding: 20px 15px 25px;

  }

}



.accreditations-block .block-title {

  font-size: 24px;

  font-weight: 600;

  color: var(--text);

  line-height: 1.4;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .accreditations-block .block-title {

    font-size: 20px;

  }

}



.accreditations-block .block-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  font-weight: 400;

  margin: 0 0 40px;

}



@media (max-width: 991px) {

  .accreditations-block .block-description {

    font-size: 16px;

    margin-bottom: 20px;

  }

}



.members-list {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 30px;

  padding: 0 20px;

}



@media (max-width: 1199px) {

  .members-list {

    gap: 15px;

    padding: 0;

  }

}



@media (max-width: 767px) {

  .members-list {

    grid-template-columns: 1fr;

  }

}



.member-item {

  border: 1px solid #e2e6ee;

  border-radius: 20px;

  padding: 39px 25px 36px;

}



@media (max-width: 991px) {

  .member-item {

    padding: 15px 15px 20px;

  }

}



.darkMode .member-item {

  border-color: #333;

}



.member-item .member-img {

  width: 100%;

  max-width: 394px;

  aspect-ratio: 394/197;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: #fff;

  border-radius: 20px;

  margin: 0 auto;

  margin-bottom: 20px;

}



.darkMode .member-item .member-img {

  border: 1px solid #333;

}



.member-item .member-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .member-item .member-img {

    max-width: 250px;

  }

}



.member-item .member-title {

  font-size: 24px;

  font-weight: 600;

  color: var(--text);

  line-height: 1.5;

  margin: 0 0 10px;

}



@media (max-width: 991px) {

  .member-item .member-title {

    font-size: 20px;

  }

}



.member-item .member-summary {

  font-size: 16px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  display: -webkit-box;

  -webkit-line-clamp: 5;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin: 0 0 23px;

}



@media (max-width: 991px) {

  .member-item .member-summary {

    font-size: 14px;

    margin: 0 0 15px;

  }

}



.accreditation-content {

  display: flex;

  align-items: center;

  gap: 30px;

  padding-top: 30px;

}



@media (max-width: 991px) {

  .accreditation-content {

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

  }

}



.accreditation-content .accreditation-img {

  width: 100%;

  max-width: 231px;

  flex-shrink: 0;

  display: flex;

  aspect-ratio: 231/197;

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  overflow: hidden;

  background-color: #fff;

}



.accreditation-content .accreditation-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .accreditation-content .accreditation-img {

    justify-content: flex-start;

  }

}



.accreditation-content .accreditation-title {

  font-size: 24px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.4;

  margin: 0 0 5px;

}



@media (max-width: 991px) {

  .accreditation-content .accreditation-title {

    font-size: 18px;

  }

}



.accreditation-content .accreditation-date {

  display: block;

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: #ff717f;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .accreditation-content .accreditation-date {

    font-size: 16px;

  }

}



.accreditation-content .accreditation-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .accreditation-content .accreditation-description {

    font-size: 16px;

  }

}



.responsibility-block {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  background-color: var(--mode);

  border-radius: 20px;

  padding: 30px;

}



@media (max-width: 991px) {

  .responsibility-block {

    padding: 20px 15px;

  }

}



.responsibility-block ~ .responsibility-block {

  margin-top: 30px;

}



@media (max-width: 991px) {

  .responsibility-block ~ .responsibility-block {

    margin-top: 20px;

  }

}



.darkMode .responsibility-block {

  border: 2px solid #333;

}



.responsibility-block .video-content {

  width: 100%;

}



.responsibility-block .video-here {

  width: 100%;

  aspect-ratio: 1110/560;

}



.responsibility-block .video-here iframe {

  width: 100%;

  height: 100%;

}



.responsibility-block .video-caption {

  width: 100%;

  text-align: center;

  display: block;

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 20px 0 0;

}



@media (max-width: 991px) {

  .responsibility-block .video-caption {

    font-size: 16px;

    margin-top: 10px;

  }

}



.responsibility-block :last-child {

  margin-bottom: 0 !important;

}



.responsibility-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 30px;

}



.darkMode .responsibility-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .responsibility-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .responsibility-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.responsibility-item {

  display: flex;

  align-items: center;

  gap: 30px;

  padding: 20px 0;

}



@media (max-width: 1199px) {

  .responsibility-item {

    padding: 0;

  }

}



@media (max-width: 991px) {

  .responsibility-item {

    flex-direction: column;

    align-items: flex-start;

    gap: 0px;

  }

}



.responsibility-item .item-img {

  width: 396px;

  aspect-ratio: 396/227;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  overflow: hidden;

  flex-shrink: 0;

}



.responsibility-item .item-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



@media (max-width: 991px) {

  .responsibility-item .item-img {

    margin-bottom: 15px;

  }

}



@media (max-width: 767px) {

  .responsibility-item .item-img {

    margin: 0 auto 15px;

  }

}



.responsibility-item .item-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.4;

  color: var(--text);

  margin: 0 0 15px;

}



@media (max-width: 767px) {

  .responsibility-item .item-title {

    text-align: center;

    font-size: 22px;

  }

}



.responsibility-item .item-description {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  padding-inline-start: 11px;

  margin: 0;

}



@media (max-width: 991px) {

  .responsibility-item .item-description {

    font-size: 16px;

  }

}



@media (max-width: 767px) {

  .responsibility-item .item-description {

    text-align: center;

    padding: 0;

  }

}



.responsibility-item .item-features {

  font-size: 18px;

  color: var(--text2);

  line-height: 1.5;

  margin: 0;

}



@media (max-width: 991px) {

  .responsibility-item .item-features {

    font-size: 16px;

  }

}



.responsibility-item .item-features li {

  display: flex;

  align-items: flex-start;

}



.responsibility-item .item-features li::before {

  content: "";

  background-color: var(--text2);

  width: 5px;

  height: 5px;

  border-radius: 50%;

  flex-shrink: 0;

  transform: translateY(10px);

  margin-inline-end: 5px;

}



.programs-content {

  margin-top: 40px;

  padding: 45px 0 0;

}



@media (max-width: 991px) {

  .programs-content {

    padding: 30px 0 0;

    margin-top: 25px;

  }

}



.programs-description {

  width: 100%;

  max-width: 860px;

  font-size: 18px;

  font-weight: 400;

  line-height: 1.5;

  color: var(--text2);

  text-align: center;

  margin: 0 auto 40px;

}



@media (max-width: 991px) {

  .programs-description {

    font-size: 16px;

    margin-bottom: 25px;

  }

}



.programs-block {

  padding: 25px 30px;

}



@media (max-width: 991px) {

  .programs-block {

    padding: 20px 15px;

  }

}



.programs-block .block-title {

  position: relative;

  font-size: 20px;

  font-weight: 600;

  color: var(--text);

  line-height: 1.4;

  text-align: center;

  margin: 0 0 20px;

}



@media (max-width: 991px) {

  .programs-block .block-title {

    font-size: 16px;

    margin-bottom: 15px;

  }

}



.programs-block .block-title span {

  position: relative;

  z-index: 2;

}



.programs-block .block-title::before {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background-image: url(../images/pattern/title.png);

  background-size: cover;

  background-position: center;

  width: 42px;

  aspect-ratio: 42/39;

  opacity: 0.1;

}



.darkMode .programs-block .block-title::before {

  filter: brightness(0) invert(1);

}



@media (max-width: 991px) {

  .programs-block .block-title::before {

    width: 35px;

  }

}



.programs-block .block-description {

  text-align: center;

  font-size: 16px;

  line-height: 1.5;

  color: var(--text2);

  margin: 0 0 25px;

}



@media (max-width: 991px) {

  .programs-block .block-description {

    font-size: 14px;

    margin-bottom: 15px;

  }

}



.programs-block .block-btn {

  margin: auto;

}



.programs-block .block-imgs {

  display: flex;

  gap: 30px;

}



@media (max-width: 991px) {

  .programs-block .block-imgs {

    gap: 15px;

  }

}



@media (max-width: 767px) {

  .programs-block .block-imgs {

    flex-direction: column;

  }

}



.programs-block .block-img {

  border-radius: 15px;

  width: 100%;

  flex: 1;

  aspect-ratio: 505/304;

  overflow: hidden;

  display: flex;

}



.programs-block .block-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



@media (max-width: 767px) {

  .programs-block .block-img {

    max-width: 350px;

    margin: 0 auto;

  }

}



.programs-block .radio-stations {

  background-color: #fff;

  border-radius: 15px;

  overflow: hidden;

  width: -moz-max-content;

  width: max-content;

  max-width: 100%;

  margin: 0 auto 30px;

}



@media (max-width: 991px) {

  .programs-block .radio-stations {

    margin: 0 0 15px;

  }

}



.audios-grid {

  width: 100%;

  max-width: 1020px;

  margin: 0 auto;

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px 30px;

}



@media (max-width: 991px) {

  .audios-grid {

    gap: 30px 15px;

  }

}



@media (max-width: 767px) {

  .audios-grid {

    grid-template-columns: 1fr;

  }

}



.audio-item .audio-label {

  font-size: 16px;

  line-height: 1.5;

  color: var(--text);

  font-weight: 500;

  margin-bottom: 10px;

}



@media (max-width: 991px) {

  .audio-item .audio-label {

    font-size: 14px;

  }

}



.audio-item .audio-player {

  width: 100% !important;

  height: 34px !important;

  border-radius: 5px;

  background-color: #222222;

}



.darkMode .audio-item .audio-player {

  border: 1px solid #333;

}



.audio-item .audio-player .mejs__controls {

  height: 34px;

  background: none !important;

  display: flex;

  align-items: center;

}



.audio-item .audio-player .mejs__button,

.audio-item .audio-player .mejs__time,

.audio-item .audio-player .mejs__time-rail {

  height: 34px;

  display: flex;

  align-items: center;

  padding-block: 0;

}



.audio-item .audio-player .mejs__button *,

.audio-item .audio-player .mejs__time *,

.audio-item .audio-player .mejs__time-rail * {

  margin-block: 0;

}



.audio-item .audio-player .mejs__horizontal-volume-slider {

  height: 34px;

}



.audio-item

  .audio-player

  .mejs__horizontal-volume-slider

  .mejs__horizontal-volume-total {

  top: 50%;

  transform: translateY(-50%);

}



.brands-content .section-title {

  align-items: flex-start;

}



.brands-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 30px;

}



.darkMode .brands-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .brands-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .brands-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.brands-tabs-content {

  padding: 20px 0 30px;

}



.brands-tabs {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 0 56px 12px;

  border-bottom: 2px solid #e2e6ee;

  gap: 40px;

  position: relative;

  margin-bottom: 30px;

}



@media (max-width: 991px) {

  .brands-tabs {

    padding: 0 20px 13px;

    gap: 20px;

    justify-content: center;

  }

}



.brands-tabs::after,

.brands-tabs::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  bottom: -6px;

  display: flex;

}



.brands-tabs::before {

  inset-inline-start: 0;

}



.brands-tabs::after {

  inset-inline-end: 0;

}



.brands-tabs button {

  width: 162px;

  aspect-ratio: 162/40;

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

}



@media (max-width: 767px) {

  .brands-tabs button {

    width: 100px;

  }

}



.brands-tabs button img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



.brands-tabs button::after {

  content: "";

  position: absolute;

  width: 80px;

  height: 4px;

  background-color: #ff717f;

  bottom: -15px;

  left: 50%;

  transform: translateX(-50%) scaleX(0);

  transform-origin: center;

  transition: all 0.3s ease-in-out;

}



.brands-tabs button:hover {

  color: var(--text);

}



.brands-tabs button.active {

  color: var(--text);

}



.brands-tabs button.active::after {

  transform: translateX(-50%) scaleX(1);

}



.brands-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 30px;

}



@media (max-width: 991px) {

  .brands-grid {

    gap: 15px;

  }

}



@media (max-width: 767px) {

  .brands-grid {

    grid-template-columns: repeat(2, 1fr);

  }

}



.brand-item {

  width: 100%;

  aspect-ratio: 270/168;

  border-radius: 20px;

  background-color: #fff;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  padding: 5px;

  overflow: hidden;

  display: flex;

  align-items: center;

  justify-content: center;

}



.darkMode .brand-item {

  border: 1px solid #333;

}



.brand-item img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

  transition: all 0.3s ease-in-out;

}



.brand-item:hover img {

  transform: scale(0.9);

}



.brands-flex-block {

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  overflow: hidden;

  padding: 30px;

  margin: 0 0 30px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}



@media (max-width: 991px) {

  .brands-flex-block {

    flex-direction: column !important;

    align-items: flex-start;

    gap: 20px;

    padding: 20px 15px;

  }



  .brands-flex-block.flex-row-reverse {

    flex-direction: column-reverse !important;

  }

}



.darkMode .brands-flex-block {

  border: 1px solid #333;

}



.brands-flex-block .block-img {

  width: 100%;

  max-width: 100%;

  flex-shrink: 0;

  display: flex;

  /* aspect-ratio: 300/271; */

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  margin: 0 0;

  overflow: hidden;

  background-color: #fff;

}



.brands-flex-block .block-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



@media (max-width: 991px) {

  .brands-flex-block .block-img {

    justify-content: flex-start;

    max-width: 500px;

    /* aspect-ratio: 300/150; */

    margin: 0;

  }

}



.brands-flex-block .block-information {

  padding-inline-end: 40px;

}



@media (max-width: 1199px) {

  .brands-flex-block .block-information {

    padding: 0;

  }

}



.brands-flex-block .block-title {

  font-size: 24px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.4;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .brands-flex-block .block-title {

    font-size: 20px;

  }

}



.brands-flex-block .block-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  margin: 0;

}



@media (max-width: 991px) {

  .brands-flex-block .block-description {

    font-size: 16px;

  }

}



.brands-flex-block:nth-of-type(odd) {

  flex-direction: row-reverse;

}



@media (max-width: 991px) {

  .brands-flex-block:nth-of-type(odd) {

    flex-direction: column;

  }

}



.brands-flex-block:nth-of-type(odd) .block-information {

  padding-inline-start: 40px;

}



@media (max-width: 1199px) {

  .brands-flex-block:nth-of-type(odd) .block-information {

    padding: 0;

  }

}



.brands-block {

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  overflow: hidden;

  padding: 30px;

  margin: 0 0 40px;

}



@media (max-width: 991px) {

  .brands-block {

    padding: 20px 15px;

    margin: 0 0 25px;

  }

}



.darkMode .brands-block {

  border: 1px solid #333;

}



.brands-block .block-flex {

  display: flex;

  align-items: center;

  gap: 30px;

  padding-top: 30px;

}



@media (max-width: 991px) {

  .brands-block .block-flex {

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

  }

}



.brands-block .block-img {

  width: 100%;

  max-width: 231px;

  flex-shrink: 0;

  display: flex;

  aspect-ratio: 231/197;

  align-items: center;

  justify-content: center;

  border-radius: 20px;

  overflow: hidden;

  background-color: #fff;

}



.brands-block .block-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .brands-block .block-img {

    justify-content: flex-start;

  }

}



.brands-block .block-title {

  font-size: 24px;

  color: var(--text);

  font-weight: 600;

  line-height: 1.4;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .brands-block .block-title {

    font-size: 18px;

  }

}



.brands-block .block-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  margin: 0;

}



@media (max-width: 991px) {

  .brands-block .block-description {

    font-size: 16px;

  }

}



.brands-block .block-btn {

  margin-top: 17px;

}



.brands-cover {

  width: 100%;

  aspect-ratio: 1170/333;

  border-radius: 20px;

  overflow: hidden;

  margin-bottom: 30px;

}



@media (max-width: 991px) {

  .brands-cover {

    margin-bottom: 20px;

  }

}



.brands-cover img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.brands-notes {

  background-color: var(--mode);

  padding: 25px 25px 15px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

}



.darkMode .brands-notes {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .brands-notes {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .brands-notes {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



.brands-notes .notes-title {

  font-size: 16px;

  line-height: 1.5;

  color: var(--text);

  font-weight: 500;

  margin: 0;

}



.brands-notes .notes-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  margin-bottom: 25px;

}



.brands-notes :last-child {

  margin-bottom: 0;

}



.brands-table {

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-bottom: 5px solid #ff717f;

  border-radius: 25px;

  overflow: hidden;

  margin-bottom: 30px;

}



.darkMode .brands-table {

  border: 1px solid #333;

  border-bottom: 5px solid #ff717f;

}



.brands-table .table-head {

  height: 72px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: var(--text);

  font-size: 20px;

  font-weight: 600;

  border-bottom: 1px solid #e1e4ea;

}



.darkMode .brands-table .table-head {

  border-bottom: 1px solid #333;

}



@media (max-width: 991px) {

  .brands-table .table-head {

    font-size: 18px;

    height: 65px;

  }

}



.brands-table .table-item {

  display: grid;

  grid-template-columns: 1fr 1fr;

  border-bottom: 1px solid #e1e4ea;

}



.darkMode .brands-table .table-item {

  border-bottom: 1px solid #333;

}



.brands-table .table-item:last-of-type {

  border: none;

}



.darkMode .brands-table .table-item:last-of-type {

  border: none;

}



.brands-table span,

.brands-table strong {

  height: 50px;

  display: flex;

  align-items: center;

  padding: 0 16px;

}



@media (max-width: 991px) {

  .brands-table span,

  .brands-table strong {

    padding: 10px;

    height: auto;

  }

}



.brands-table span {

  background-color: var(--mode);

  font-size: 14px;

  color: var(--text2);

  font-weight: 400;

  border-inline-start: 1px solid #e1e4ea;

}



.darkMode .brands-table span {

  border-inline-start: 1px solid #333;

}



.brands-table strong {

  font-size: 16px;

  color: var(--text);

  background-color: rgba(58, 174, 7, 0.051);

}



@media (max-width: 991px) {

  .brands-table strong {

    font-size: 14px;

  }

}



.brand-main {

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  overflow: hidden;

  padding: 30px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 30px;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .brand-main {

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

    padding: 20px 15px;

  }

}



.darkMode .brand-main {

  border: 1px solid #333;

}



.brand-main .brand-img {

  width: 100%;

  max-width: 408px;

  flex-shrink: 0;

  aspect-ratio: 408/254;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: #fff;

  border-radius: 20px;

  overflow: hidden;

}



.brand-main .brand-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 991px) {

  .brand-main .brand-img {

    justify-content: center;

  }

}



.brand-main .brand-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.4;

  color: var(--text);

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .brand-main .brand-title {

    font-size: 22px;

    margin-bottom: 10px;

  }

}



.brand-main .brand-summary {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .brand-main .brand-summary {

    font-size: 16px;

    margin-bottom: 20px;

  }

}



.brand-main .brand-subtitle {

  font-size: 20px;

  font-weight: 500;

  color: #40444c;

  line-height: 1.5;

  margin: 0 0 15px;

}



@media (max-width: 991px) {

  .brand-main .brand-subtitle {

    font-size: 18px;

  }

}



.darkMode .brand-main .brand-subtitle {

  color: #ccc;

}



.brand-main .brand-standards {

  display: grid;

  grid-template-columns: 1fr;

  gap: 15px;

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

}



@media (max-width: 991px) {

  .brand-main .brand-standards {

    font-size: 16px;

  }

}



.brand-tabs {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 0 56px 13px;

  border-bottom: 2px solid #e2e6ee;

  gap: 40px;

  position: relative;

  margin-bottom: 25px;

}



@media (max-width: 991px) {

  .brand-tabs {

    padding: 0 0 13px;

    gap: 15px;

    justify-content: center;

  }

}



.brand-tabs::after,

.brand-tabs::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  bottom: -6px;

  display: flex;

}



.brand-tabs::before {

  inset-inline-start: 0;

}



.brand-tabs::after {

  inset-inline-end: 0;

}



.brand-tabs button {

  font-size: 16px;

  font-weight: 500;

  line-height: 1.5;

  padding: 0;

  color: var(--text2);

  position: relative;

  transition: all 0.3s ease-in-out;

}



.brand-tabs button::after {

  content: "";

  position: absolute;

  width: 80px;

  height: 4px;

  background-color: #ff717f;

  bottom: -16px;

  left: 50%;

  transform: translateX(-50%) scaleX(0);

  transform-origin: center;

  transition: all 0.3s ease-in-out;

}



.brand-tabs button:hover {

  color: var(--text);

}



.brand-tabs button.active {

  color: var(--text);

}



.brand-tabs button.active::after {

  transform: translateX(-50%) scaleX(1);

}



.brand-tab-block {

  background-color: var(--mode);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-bottom: 5px solid #ff717f;

  border-radius: 20px;

  overflow: hidden;

  padding: 30px 30px 25px;

}



@media (max-width: 991px) {

  .brand-tab-block {

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

    padding: 20px 15px;

  }

}



.darkMode .brand-tab-block {

  border: 1px solid #333;

  border-bottom: 5px solid #ff717f;

}



.brand-tab-block .block-description {

  font-size: 18px;

  font-weight: 400;

  color: var(--text2);

  line-height: 1.5;

  margin: 0 0 30px;

}



@media (max-width: 991px) {

  .brand-tab-block .block-description {

    font-size: 16px;

    margin-bottom: 20px;

  }

}



.brand-tab-block .block-title {

  font-size: 20px;

  font-weight: 500;

  color: #40444c;

  line-height: 1.5;

  margin: 0 0 15px;

}



.brand-tab-block .block-title span {

  font-size: 16px;

  color: var(--text2);

  font-weight: 400;

}



@media (max-width: 991px) {

  .brand-tab-block .block-title span {

    font-size: 14px;

  }

}



@media (max-width: 991px) {

  .brand-tab-block .block-title {

    font-size: 18px;

    margin-bottom: 10px;

  }

}



.darkMode .brand-tab-block .block-title {

  color: #ccc;

}



.brand-tab-block .block-imgs {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  flex-wrap: wrap;

  gap: 20px;

  margin-bottom: 25px;

}



@media (max-width: 991px) {

  .brand-tab-block .block-imgs {

    gap: 10px;

    margin-bottom: 15px;

  }

}



.brand-tab-block .block-img {

  display: flex;

  width: 230px;

  aspect-ratio: 230/143;

}



.brand-tab-block .block-img img {

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

}



.brand-tab-block .block-table {

  border: 1px solid #e1e4ea;

  border-radius: 20px;

  overflow: hidden;

  margin-bottom: 30px;

}



@media (max-width: 991px) {

  .brand-tab-block .block-table {

    margin-bottom: 20px;

  }

}



.brand-tab-block .table-item {

  display: flex;

  border-bottom: 1px solid #e1e4ea;

}



.brand-tab-block .table-item:last-of-type {

  border: none;

}



.brand-tab-block .table-item p,

.brand-tab-block .table-item strong {

  padding: 10px 16px;

  min-height: 55px;

  display: flex;

  align-items: center;

  max-width: 100%;

  overflow: hidden;

  flex: 1;

  border-inline-start: 1px solid #e1e4ea;

  margin: 0;

}



@media (max-width: 991px) {

  .brand-tab-block .table-item p,

  .brand-tab-block .table-item strong {

    padding: 10px;

    height: auto;

  }

}



.brand-tab-block .table-item p {

  font-size: 14px;

  font-weight: 400;

  color: var(--text2);

}



.brand-tab-block .table-item strong {

  color: var(--text);

  font-weight: 500;

  background-color: rgba(58, 174, 7, 0.051);

}



@media (max-width: 991px) {

  .brand-tab-block .table-item strong {

    font-size: 14px;

  }

}



.brand-tab-block .table-item :first-child {

  border: none;

}



.brand-tab-block :last-child {

  margin: 0;

}



.download-list {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 30px;

}



@media (max-width: 991px) {

  .download-list {

    grid-template-columns: 1fr;

    gap: 15px;

  }

}



.download-item {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  background-color: #f8e9ea;

  fill: #d9434d;

  border-radius: 15px;

  padding: 25px 30px;

  min-height: 114px;

  position: relative;

  transition: all 0.3s ease-in-out;

}



@media (max-width: 991px) {

  .download-item {

    padding: 15px;

    min-height: auto;

  }

}



.download-item:before {

  pointer-events: none;

  position: absolute;

  z-index: -1;

  content: "";

  top: 100%;

  left: 5%;

  height: 10px;

  width: 90%;

  opacity: 0;

  background: radial-gradient(

    ellipse at center,

    rgba(217, 67, 77, 0.35) 0%,

    rgba(217, 67, 77, 0) 80%

  );

  transition: all 0.3s ease-in-out;

}



.download-item .file-icon {

  width: 64px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-shrink: 0;

}



@media (max-width: 991px) {

  .download-item .file-icon {

    width: 40px;

  }



  .download-item .file-icon svg {

    max-width: 100%;

  }

}



.download-item svg {

  flex-shrink: 0;

}



.download-item h6 {

  width: 100%;

  margin: 0 20px;

  font-size: 18px;

  color: #333;

  font-weight: 500;

  line-height: 1.5;

}



@media (max-width: 991px) {

  .download-item h6 {

    margin: 0 10px;

    font-size: 18px;

    margin-inline-end: 15px;

  }

}



.download-item h6 span {

  display: block;

  font-size: 16px;

  font-weight: 400;

  line-height: 2;

}



.download-item span {

  font-size: 16px;

  font-weight: 400;

  line-height: 2;

  color: #333;

}



@media (max-width: 991px) {

  .download-item .arrow {

    animation: scr-pos 2s linear infinite;

  }

}



.download-item:hover {

  transform: translateY(-5px);

}



.download-item:hover::before {

  opacity: 1;

  transform: translateY(5px);

}



.download-item:hover .arrow {

  animation: scr-pos 2s linear infinite;

}



@keyframes scr-pos {

  0% {

    transform: translateY(0px);

  }

  50% {

    transform: translateY(-5px);

  }

  100% {

    transform: translateY(0px);

  }

}



.contact-page {

  padding: 50px 0 0;

  overflow: hidden;

}



@media (max-width: 991px) {

  .contact-page {

    padding: 40px 0 0;

  }

}



.contact-page ~ .contact-page,

.branch-notes {

  padding: 62px 0 0;

}



@media (max-width: 991px) {

  .contact-page ~ .contact-page,

  .branch-notes {

    padding: 45px 0 0;

  }

}



.contact-page.bg-section .bg {

  bottom: unset;

  align-items: flex-start;

}



.contact-page .section-title {

  margin-bottom: 20px;

}



.contact-information {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 15px;

}



@media (max-width: 1199px) {

  .contact-information {

    grid-template-columns: 1fr 1fr;

  }

}



@media (max-width: 991px) {

  .contact-information {

    margin-bottom: 40px;

  }

}



@media (max-width: 767px) {

  .contact-information {

    grid-template-columns: 1fr;

  }

}



.contact-information .contact-block {

  padding: 15px;

  background-color: var(--mode);

  box-shadow: 0px -2px 2px 1px rgba(16, 24, 40, 0.0509803922);

  border-bottom: 5px solid transparent;

  border-radius: 25px;

  transition: border-bottom-color 0.3s ease-in-out;

}



@media (max-width: 991px) {

  .contact-information .contact-block {

    padding: 10px;

    border-radius: 15px;

  }

}



.contact-information .contact-block:hover {

  border-bottom-color: #ff717f;

}



.darkMode .contact-information .contact-block {

  padding: 14px;

  border: 1px solid #333;

}



.darkMode .contact-information .contact-block:hover {

  padding-bottom: 9px;

  border-bottom: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .darkMode .contact-information .contact-block:hover {

    padding-bottom: 4px;

  }

}



@media (max-width: 991px) {

  .darkMode .contact-information .contact-block {

    padding: 9px;

  }

}



.contact-information .block-title {

  font-size: 20px;

  line-height: 1.4;

  color: var(--text);

  margin: 0 0 15px;

  height: 56px;

}



@media (max-width: 1199px) {

  .contact-information .block-title {

    font-size: 18px;

    height: auto;

    margin-bottom: 10px;

  }

}



.contact-information .contact-method {

  padding: 0 14px;

  min-height: 54px;

  border: 1px solid #eeeeee;

  border-radius: 10px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  gap: 10px;

  font-size: 14px;

  font-weight: 500;

  line-height: 1.5;

  background-color: var(--mode);

  fill: #74cebf;

}



@media (max-width: 991px) {

  .contact-information .contact-method {

    padding: 10px;

    min-height: auto;

  }

}



.darkMode .contact-information .contact-method {

  border-color: #2d2f2f;

}



.contact-information .contact-method .icon {

  width: 24px;

  aspect-ratio: 1;

}



@media (max-width: 991px) {

  .contact-information .contact-method .icon {

    width: 20px;

  }

}



.contact-information .contact-method .icon svg {

  max-width: 100%;

  max-height: 100%;

}



.contact-information .contact-method ~ .contact-method {

  margin-top: 10px;

}



.location-content {

  /* padding: 50px 0 300px; */

  padding: 50px 0 75px;

  position: relative;

  z-index: 2;

}



@media (max-width: 991px) {

  .location-content {

    /* margin-bottom: 40px; */

    /* padding: 70px 0 120px; */

    padding: 70px 0;

  }

}



.location-content .location-map {

  /* position: absolute; */

  /* top: 277px; */

  /* left: 0; */

  width: 100%;

  min-height: 350px;

  height: 100%;

  /* bottom: 0; */

  display: flex;

  border: 1px solid #d6d6d6;

  border-radius: 10px;

  overflow: hidden;

  /* margin-top: -50px; */

}



.location-content .location-map .map {

  width: 100%;

  height: 100%;

}



@media (max-width: 991px) {

  .location-content .location-map {

    /* top: 0; */

    margin-top: 25px;

    height: 360px;

  }

}



.location-information {

  padding: 30px 30px 25px;

  background-color: var(--mode);

  box-shadow: 0px -2px 2px 1px rgba(16, 24, 40, 0.0509803922);

  border-bottom: 5px solid #ff717f;

  border-radius: 25px;

  position: relative;

  z-index: 4;

}



.darkMode .location-information {

  padding: 29px 29px 25px;

  border: 1px solid #333;

  border-bottom: 5px solid #ff717f;

}



@media (max-width: 767px) {

  .darkMode .location-information {

    padding: 24px 14px;

  }

}



@media (max-width: 767px) {

  .location-information {

    padding: 25px 15px;

  }

}



.location-information .section-title {

  gap: 10px;

  align-items: flex-start;

  margin-bottom: 15px;

}



.location-information .section-title span {

  color: var(--text2);

  font-size: 18px;

  font-weight: 400;

}



@media (max-width: 991px) {

  .location-information .section-title {

    font-size: 22px;

  }



  .location-information .section-title span {

    font-size: 16px;

  }

}



.location-contacts {

  display: flex;

  align-items: center;

  gap: 40px;

}



@media (max-width: 1199px) {

  .location-contacts {

    flex-direction: column;

    gap: 15px;

  }

}



.location-contacts .location-img {

  width: 100%;

  overflow: hidden;

  flex-shrink: 0;

}



.location-contacts .location-img.alJubail {

  max-width: 282px;

  aspect-ratio: 282/399;

}



.location-contacts .location-img.jeddah {

  max-width: 488px;

  aspect-ratio: 488/345;

}



.location-contacts .location-img img {

  max-width: 100%;

  max-height: 100%;

  -o-object-fit: contain;

  object-fit: contain;

}



@media (max-width: 1199px) {

  .location-contacts .location-img {

    margin: auto;

  }

}



.location-contacts .location-methods {

  display: grid;

  grid-template-columns: 1fr;

  gap: 15px;

  width: 100%;

}



.location-contacts .contact-method {

  background-color: var(--mode);

  border: 1px solid #eeeeee;

  border-radius: 10px;

  padding: 10px 20px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  position: relative;

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  transition: all 0.3s ease-in-out;

}



.darkMode .location-contacts .contact-method {

  border-color: #2d2f2f;

}



.location-contacts .contact-method:before {

  pointer-events: none;

  position: absolute;

  z-index: -1;

  content: "";

  top: 100%;

  left: 5%;

  height: 10px;

  width: 90%;

  opacity: 0;

  background: radial-gradient(

    ellipse at center,

    rgba(3, 82, 69, 0.35) 0%,

    rgba(3, 82, 69, 0) 80%

  );

  transition: all 0.3s ease-in-out;

}



.location-contacts .contact-method:hover {

  transform: translateY(-5px);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.location-contacts .contact-method:hover::before {

  opacity: 1;

  transform: translateY(5px);

}



@media (max-width: 767px) {

  .location-contacts .contact-method {

    padding: 15px 10px;

  }

}



.location-contacts .contact-method .method-icon {

  width: 48px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  fill: #74cebf;

  flex-shrink: 0;

}



.location-contacts .contact-method .method-icon svg {

  max-width: 100%;

  max-height: 100%;

}



@media (max-width: 767px) {

  .location-contacts .contact-method .method-icon {

    width: 40px;

  }

}



.location-contacts .contact-method .method-text {

  margin-inline-start: 16px;

}



@media (max-width: 767px) {

  .location-contacts .contact-method .method-text {

    margin-inline-start: 10px;

  }

}



.location-contacts .contact-method .title {

  font-size: 18px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  display: block;

  margin-bottom: 4px;

}



@media (max-width: 767px) {

  .location-contacts .contact-method .title {

    font-size: 16px;

  }

}



.location-contacts .contact-method .value {

  font-size: 20px;

  font-weight: 500;

  color: var(--text);

  display: block;

  text-align: right;

  line-height: 1.5;

}



html[dir="ltr"] .location-contacts .contact-method .value {

  text-align: left;

}



.location-contacts .contact-method .value a {

  color: var(--text);

  transition: all 0.3s ease-in-out;

}



.location-contacts .contact-method .value a:hover {

  color: #bf1e2e;

}



@media (max-width: 767px) {

  .location-contacts .contact-method .value {

    font-size: 18px;

  }



  .location-contacts .contact-method .value br {

    display: none;

  }

}



.location-contacts .contact-method .en {

  direction: ltr;

}



.opening-list {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 20px;

}



@media (max-width: 991px) {

  .opening-list {

    grid-template-columns: 1fr;

    margin-bottom: 40px;

  }

}



.opening-item {

  background-color: var(--mode);

  border: 1px solid #eeeeee;

  border-radius: 10px;

  padding: 15px 20px;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  position: relative;

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  transition: all 0.3s ease-in-out;

}



.darkMode .opening-item {

  border-color: #2d2f2f;

}



.opening-item:before {

  pointer-events: none;

  position: absolute;

  z-index: -1;

  content: "";

  top: 100%;

  left: 5%;

  height: 10px;

  width: 90%;

  opacity: 0;

  background: radial-gradient(

    ellipse at center,

    rgba(3, 82, 69, 0.35) 0%,

    rgba(3, 82, 69, 0) 80%

  );

  transition: all 0.3s ease-in-out;

}



.opening-item:hover {

  transform: translateY(-5px);

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

}



.opening-item:hover::before {

  opacity: 1;

  transform: translateY(5px);

}



@media (max-width: 767px) {

  .opening-item {

    padding: 15px 10px;

  }

}



.opening-item .opening-icon {

  width: 45px;

  aspect-ratio: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  fill: #74cebf;

  stroke: #74cebf;

  flex-shrink: 0;

}



.opening-item .opening-icon svg {

  max-width: 100%;

  max-height: 100%;

}



@media (max-width: 991px) {

  .opening-item .opening-icon {

    width: 40px;

  }

}



.opening-item .opening-text {

  margin-inline-start: 16px;

}



@media (max-width: 767px) {

  .opening-item .opening-text {

    margin-inline-start: 10px;

  }

}



.opening-item .title {

  font-size: 18px;

  color: var(--text2);

  font-weight: 400;

  line-height: 1.5;

  display: block;

  margin-bottom: 4px;

}



@media (max-width: 767px) {

  .opening-item .title {

    font-size: 16px;

  }

}



.opening-item .value {

  font-size: 20px;

  font-weight: 500;

  color: var(--text);

  display: block;

  text-align: right;

  line-height: 1.5;

}



html[dir="ltr"] .opening-item .value {

  text-align: left;

}



.opening-item .value a {

  color: var(--text);

  transition: all 0.3s ease-in-out;

}



.opening-item .value a:hover {

  color: #bf1e2e;

}



@media (max-width: 991px) {

  .opening-item .value {

    font-size: 18px;

  }



  .opening-item .value br {

    display: none;

  }

}



.opening-item ul {

  display: grid;

  grid-template-columns: 1fr;

  gap: 5px;

  width: 100%;

}



.opening-item ul li {

  display: flex;

  align-items: flex-start;

}



.opening-item ul li::before {

  content: "";

  display: block;

  background-color: var(--text);

  border-radius: 50%;

  width: 5px;

  aspect-ratio: 1;

  transform: translateY(13px);

  margin-inline-end: 7px;

}



@media (max-width: 991px) {

  .opening-item ul li::before {

    transform: translateY(11px);

  }

}



.opening-item:nth-of-type(n + 3) {

  grid-column: 1 / span 2;

}



@media (max-width: 991px) {

  .opening-item:nth-of-type(n + 3) {

    grid-column: unset;

  }

}



.historical-description {

  font-size: 18px;

  line-height: 1.5;

  color: var(--text2);

  background-color: var(--mode);

  padding: 25px;

  padding-inline-start: 20px;

  border-inline-start: 5px solid #ff717f;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  border-radius: 20px;

  margin: 0 0 40px;

}



.darkMode .historical-description {

  border: 1px solid #333;

  border-inline-start: 5px solid #ff717f;

}



@media (max-width: 991px) {

  .historical-description {

    font-size: 16px;

    padding: 20px 15px 15px;

    border: none;

    border-bottom: 5px solid #ff717f;

    margin: 0 0 20px;

  }



  .darkMode .historical-description {

    border: 1px solid #333;

    border-bottom: 5px solid #ff717f;

  }

}



/* time line */

.ag-timeline-block {

  margin-top: 40px;

}



@media (max-width: 767px) {

  .ag-timeline-block {

    margin-top: 20px;

  }

}



.ag-format-container {

  width: 100%;

  position: relative;

}



.ag-timeline {

  display: inline-block;

  width: 100%;

  max-width: 100%;

  margin: 0 auto;

  position: relative;

}



.ag-timeline .ag-timeline_line {

  width: 2px;

  background-color: rgba(51, 51, 51, 0.6);

  position: absolute;

  top: 2px;

  left: 50%;

  transform: translateX(-50%);

  bottom: 0;

  overflow: hidden;

}



.darkMode .ag-timeline .ag-timeline_line {

  background-color: rgba(226, 230, 238, 0.6);

}



.ag-timeline .ag-timeline_line-progress {

  width: 100%;

  height: 20%;

  background-color: #ff717f;

}



.ag-timeline_item {

  margin: 0 0 50px;

  position: relative;

}



.ag-timeline_item .ag-timeline-card_box {

  padding: 0;

  padding-bottom: 20px;

  padding-inline-start: 50%;

  display: flex;

  align-items: center;

}



.ag-timeline_item .ag-timeline-card_point-box {

  display: inline-block;

  margin-inline-start: -25px;

}



.ag-timeline_item:nth-child(2n) {

  text-align: end;

}



.ag-timeline_item:nth-child(2n) .ag-timeline-card_box {

  padding-inline-start: 0;

  padding-inline-end: 50%;

  justify-content: flex-end;

}



.ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box {

  margin: 0;

  margin-inline-end: -25px;

}



.ag-timeline-card_point {

  height: 50px;

  line-height: 50px;

  width: 50px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  background-color: var(--mode);

  text-align: center;

  font-size: 14px;

  font-weight: 600;

  color: var(--text);

  border-radius: 50%;

}



.darkMode .ag-timeline-card_point {

  border: 2px solid #333;

}



.js-ag-active .ag-timeline-card_point {

  color: #fff;

  background-color: #035245;

}



.ag-timeline-card_meta-box {

  display: inline-block;

}



.ag-timeline-card_meta {

  margin: 0;

  font-weight: 700;

  font-size: 22px;

  color: var(--text);

}



.ag-timeline-card_item {

  display: inline-block;

  width: 45%;

  margin: -77px 0 0;

  background-color: var(--mode);

  padding: 15px;

  opacity: 0;

  border-radius: 20px;

  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.0784313725);

  transition: transform 0.5s, opacity 0.5s;

  position: relative;

}



.darkMode .ag-timeline-card_item {

  border: 1px solid #333;

}



html[dir="rtl"] .ag-timeline_item:nth-child(2n + 1) .ag-timeline-card_item {

  transform: translateX(200%);

}



html[dir="ltr"] .ag-timeline_item:nth-child(2n + 1) .ag-timeline-card_item {

  transform: translateX(-200%);

}



html[dir="rtl"] .ag-timeline_item:nth-child(2n) .ag-timeline-card_item {

  transform: translateX(-200%);

}



html[dir="ltr"] .ag-timeline_item:nth-child(2n) .ag-timeline-card_item {

  transform: translateX(200%);

}



.js-ag-active.ag-timeline_item:nth-child(2n + 1) .ag-timeline-card_item,

.js-ag-active.ag-timeline_item:nth-child(2n) .ag-timeline-card_item {

  opacity: 1;

}



html[dir="rtl"]

  .js-ag-active.ag-timeline_item:nth-child(2n + 1)

  .ag-timeline-card_item,

html[dir="rtl"]

  .js-ag-active.ag-timeline_item:nth-child(2n)

  .ag-timeline-card_item {

  transform: translateX(0%);

}



html[dir="ltr"]

  .js-ag-active.ag-timeline_item:nth-child(2n + 1)

  .ag-timeline-card_item,

html[dir="ltr"]

  .js-ag-active.ag-timeline_item:nth-child(2n)

  .ag-timeline-card_item {

  transform: translateX(0%);

}



.ag-timeline-card_img-box {

  padding: 15px;

}



.ag-timeline-card_img {

  border-radius: 15px;

  max-width: 100%;

  overflow: hidden;

  background-color: var(--mode);

  margin-bottom: 30px;

}



.ag-timeline-card_info {

  padding: 0 15px;

}



.ag-timeline-card_title {

  margin: 0 0 10px;

  font-size: 22px;

  font-weight: 700;

  color: var(--text);

  text-align: start;

}



.ag-timeline-card_desc {

  line-height: 1.5;

  font-size: 18px;

  color: var(--text2);

  text-align: start;

}



.ag-timeline-card_desc p {

  margin-bottom: 15px;

}



.ag-timeline-card_desc ul {

  list-style: disc;

  margin-inline-start: 20px;

}



.ag-timeline-card_desc :last-child {

  margin-bottom: 0;

}



@media (max-width: 991px) {

  .ag-timeline .ag-timeline_line {

    left: unset;

    inset-inline-start: 20px;

  }



  .ag-timeline_item .ag-timeline-card_box {

    padding: 0 0 20px;

  }



  .ag-timeline_item:nth-child(2n) {

    text-align: start;

  }



  .ag-timeline_item:nth-child(2n) .ag-timeline-card_box {

    padding: 0 0 20px;

    justify-content: flex-start;

  }



  .ag-timeline-card_meta-box {

    display: none;

  }



  .ag-timeline_item .ag-timeline-card_point-box {

    margin: 0;

  }



  .ag-timeline_item:nth-child(2n) .ag-timeline-card_point-box {

    margin: 0;

  }



  .ag-timeline-card_point {

    height: 40px;

    line-height: 40px;

    width: 40px;

  }



  .ag-timeline-card_item {

    width: calc(100% - 125px);

    margin: -65px 0 0;

    margin-inline-start: 55px;

  }



  html[dir="rtl"] .ag-timeline_item:nth-child(2n + 1) .ag-timeline-card_item,

  html[dir="rtl"] .ag-timeline_item:nth-child(2n) .ag-timeline-card_item {

    transform: translateX(-200%);

  }



  html[dir="ltr"] .ag-timeline_item:nth-child(2n + 1) .ag-timeline-card_item,

  html[dir="ltr"] .ag-timeline_item:nth-child(2n) .ag-timeline-card_item {

    transform: translateX(200%);

  }

}



@media (max-width: 767px) {

  .ag-timeline-card_item {

    width: calc(100% - 55px);

  }



  .ag-timeline-card_img {

    margin-bottom: 15px;

  }



  .ag-timeline-card_info {

    padding: 0 0;

  }



  .ag-timeline-card_title {

    font-size: 18px;

  }



  .ag-timeline-card_desc {

    font-size: 14px;

  }



  .ag-timeline-card_desc p {

    margin-bottom: 10px;

  }



  .ag-timeline-card_desc :last-child {

    margin-bottom: 0;

  }

}



/*# sourceMappingURL=main.css.map */



/**/



table {

  /* margin-bottom: 30px; */

  border: 1px solid #3aae070d;

}



table thead td,

table thead th {

}



table thead th {

  vertical-align: bottom;

  border-bottom: 2px solid #3aae070d;

}



table td,

table th {

  padding: 0.75rem;

  vertical-align: top;

  border: 1px solid #e1e4ea;

}



table td:has(strong) {

  color: var(--text);

  font-weight: 500;

  background-color: #3aae070d;

}



.page-content:has(.modal) .bg {

  display: none;

}



.page-content:has(.modal) .bg-content {

  position: static;

}



.page-content:has(.page-404) .bg {

  align-items: center;

  bottom: 0;

}



.page-404 {

  min-height: calc(100vh - 90px);

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column;

  padding: 15px;

}



.page-404 .img-404 {

  width: 100%;

  max-width: 500px;

  margin-bottom: 40px;

}



.page-404 .title-404 {

  opacity: 0.89;

  font-size: 24px;

  font-weight: bold;

  color: var(--text);

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 15px 20px 10px;

  margin: 0 0 20px;

}



.offer-text iframe {

  display: block;

  height: 600px !important;

  width: 100% !important;

}



.gallery {

  display: flex;

  gap: 30px;

}



.gallery .gallery-item img {

  border-radius: 15px;

}



.works-filter {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  padding: 0 68px 13px;

  border-bottom: 2px solid #e2e6ee;

  gap: 40px;

  position: relative;

  margin-bottom: 25px;

}



.works-filter::after,

.works-filter::before {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  background-color: #ff717f;

  bottom: -6px;

  display: flex;

}



.works-filter::before {

  inset-inline-start: 0;

}



.works-filter::after {

  inset-inline-end: 0;

}



.works-filter button {

  font-size: 16px;

  font-weight: 500;

  line-height: 1.5;

  padding: 0;

  color: var(--text2);

  position: relative;

  transition: all 0.3s ease-in-out;

}



.works-filter button::after {

  content: "";

  position: absolute;

  width: 80px;

  height: 4px;

  background-color: #ff717f;

  bottom: -16px;

  left: 50%;

  transform: translateX(-50%) scaleX(0);

  transform-origin: center;

  transition: all 0.3s ease-in-out;

}



.works-filter button:hover {

  color: var(--text);

}



.works-filter button.mixitup-control-active {

  color: var(--text);

}



.works-filter button.mixitup-control-active::after {

  transform: translateX(-50%) scaleX(1);

}



.media-item {

  position: relative;

  aspect-ratio: 724/1024;

  width: 100%;

  overflow: hidden;

  text-align: center;

  margin-bottom: 30px;

}

.term-video-gallery .media-item {

  aspect-ratio: 480/360;

}

.media-item .media-item-img {

  width: 100%;

  height: 100%;

}

.media-item img {

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: all 0.3s ease-in-out;

}



.media-item-body {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: flex;

  align-items: center;

  justify-content: center;

  flex-direction: column-reverse;

  gap: 15px;

  color: #fff;

  fill: #fff;

  background-color: rgba(0, 0, 0, 0.6);

  opacity: 0;

  visibility: hidden;

  transition: all 0.3s ease-in-out;

}



.media-item:hover .media-item-body {

  opacity: 1;

  visibility: visible;

  color: #fff;

}



.media-item:hover img {

  transform: scale(1.1);

}



@media (max-width: 991px) {

  .works-filter {

    padding: 0 20px 13px;

    gap: 20px;

    overflow: auto;

    white-space: nowrap;

  }



  .works-filter::after,

  .works-filter::before {

    display: none;

  }



  .works-filter button::after {

    bottom: -13px;

  }



  .media-item-body {

    opacity: 1;

    visibility: visible;

  }

}



.acf-map {

  width: 100%;

  height: 100%;

}



.gallery-item img {

  /*object-fit: cover;*/

  /*width: 100% !important;*/

  height: auto;

  /*aspect-ratio: 758 / 456;*/

}

@media (max-width: 767px) {

  #gallery-1,

  #gallery-2 {

    display: grid;

    grid-template-columns: 1fr;

    gap: 15px;

  }

  #gallery-1 .gallery-item,

  #gallery-2 .gallery-item {

    width: 100% !important;

    margin: 0;

  }

}



.wp-caption {

  max-width: 100% !important;

}



/*WordPress Core Editor Style*/

.aligncenter,

div.aligncenter {

  display: block;

  margin: 5px auto 5px auto;

}



.alignright {

  float: right;

  margin: 0.5em 0 0.5em 1em;

}



.alignleft {

  float: left;

  margin: 0.5em 1em 0.5em 0;

}



@media only screen and (min-width: 768px) {

  .full-width .alignfull {

    width: calc(100vw - var(--scrollbarwidth));

    margin-left: 50%;

    transform: translateX(-50%);

  }



  .full-width .alignfull img {

    -webkit-border-radius: 0 !important;

    -moz-border-radius: 0 !important;

    border-radius: 0 !important;

  }



  .full-width .alignwide:not(.wp-block-columns):not(.wp-block-gallery) {

    margin-left: calc(25% - 21vw);

    margin-right: calc(25% - 21vw);

    width: auto;

    max-width: 1000%;

  }



  .alignwide img,

  .alignfull img {

    display: block;

    margin: 0 auto;

  }



  .wp-block-image {

    max-width: none;

  }

}



.wp-block-gallery .blocks-gallery-image figcaption,

.wp-block-gallery .blocks-gallery-item figcaption {

  border-bottom-right-radius: 8px;

  border-bottom-left-radius: 8px;

}



.wp-block-gallery.is-cropped .blocks-gallery-image a,

.wp-block-gallery.is-cropped .blocks-gallery-image img,

.wp-block-gallery.is-cropped .blocks-gallery-item a,

.wp-block-gallery.is-cropped .blocks-gallery-item img {

  height: 100% !important;

}



img.alignright {

  float: right;

  margin: 0.5em 0 0.5em 1em;

}



img.alignnone {

  /*margin: 5px 20px 20px 0;*/

}



img.alignleft {

  float: left;

  margin: 0.5em 1em 0.5em 0;

}



img.aligncenter {

  display: block;

  margin-left: auto;

  margin-right: auto;

}



.size-auto,

.size-full,

.size-large,

.size-medium,

.size-thumbnail {

  max-width: 100%;

  height: auto;

}



.wp-caption {

  max-width: 100%;

  padding: 10px;

}



.wp-caption.alignright,

.story img.alignright {

  float: right;

  max-width: 320px;

  margin: -10px 0 10px 20px;

}



.wp-caption.alignleft {

  float: left;

  max-width: 320px;

  margin: 0 20px 10px 0;

}



.wp-caption p.wp-caption-text {

  padding: 10px 5px 5px;

  margin: 0;

}



.wp-caption.alignnone {

  margin: 5px 20px 20px 0;

}



.wp-caption p.wp-caption-text {

  font-size: 11px;

  line-height: 17px;

  margin: 0;

  padding: 0 4px 5px;

}

.media-block .section-title,

.brands-content .section-title {

  flex-direction: row;

}

@media (max-width: 767px) {

  .offer-block .section-title,

  .brands-content .section-title {

    align-items: center;

    justify-content: center;

    text-align: center;

    flex-direction: column;

  }

  .media-block .section-title {

    flex-direction: column;

    align-items: center;

    justify-content: center;

    text-align: center;

  }

}

.brands-flex-block:has(.col-md-4) {

  padding: 30px 15px;

  align-items: flex-start;

}

.brands-flex-block:has(.col-md-4) .brands-tabs-content {

  padding: 20px 0 30px;

}

.brands-flex-block .col-md-4,

.brands-flex-block .col-md-8 {

  padding: 0 15px;

}

.brands-flex-block:has(.col-md-4) .brands-tabs {

  gap: 20px;

  padding-inline: 35px;

}



.brands-flex-block:has(.col-md-4) .brands-tabs button {

  width: auto;

  aspect-ratio: unset;

  height: 40px;

}

@media (max-width: 991px) {

  .brands-flex-block .col-md-4,

  .brands-flex-block .col-md-8 {

    width: 100%;

  }

  .brands-flex-block:has(.col-md-4) .brands-tabs-content {

    padding: 0;

  }

  .brands-flex-block:has(.col-md-4) .block-img {

    max-width: 100%;

  }

  .brands-flex-block:has(.col-md-4) {

    padding: 20px 0;

  }

}

@media (max-width: 767px) {

  .brands-flex-block:has(.col-md-4) .brands-tabs::after,

  .brands-flex-block:has(.col-md-4) .brands-tabs::before {

    display: none;

  }

  .brands-flex-block:has(.col-md-4) .brands-tabs {

    justify-content: flex-start;

    overflow-x: auto;

    flex-wrap: nowrap;

    white-space: nowrap;

    padding-inline: 10px;

  }

  .brands-flex-block:has(.col-md-4) .brands-tabs button::after {

    bottom: -10px;

  }

  .brands-tabs button {

    width: auto;

  }

  .brands-tabs button:has(img) {

    width: 100px;

  }

  .block-information table {

    width: 100% !important;

  }

}



.wpcf7 {

  width: 100%;

  max-width: 500px;

  margin: 0 auto;

}

.form-group,

.custom-file {

  display: flex;

  flex-direction: column;

  margin-bottom: 20px;

}



.form-group label,

.custom-file label {

  font-size: 16px;

  line-height: 30px;

  color: var(--text);

  font-weight: 400;

  padding: 0;

  margin: 0 0 4px;

}

.form-group .wpcf7-not-valid-tip,

.custom-file .wpcf7-not-valid-tip {

  font-size: 12px;

  color: #f00;

  display: block;

  margin-top: 2px;

  order: 3;

}

.form-control,

.custom-select {

  width: 100%;

  height: 48px;

  font-weight: 500;

  color: #1d1f1f;

  font-size: 14px;

  background-color: #f8f8f8;

  border: 1px solid #eeeeee;

  border-radius: 8px;

  box-shadow: none;

  padding: 0 16px;

  transition: all 0.3s ease-in-out;

}

.form-control:focus {

  background-color: #f8f8f8;

  border-color: #035245;

  box-shadow: none;

}

.custom-select:focus {

  border-color: #eeeeee;

}

.custom-select::-moz-placeholder,

.form-control::-moz-placeholder {

  font-size: 14px;

  color: #a5a5a5;

  font-weight: 400;

}

.custom-select::placeholder,

.form-control::placeholder {

  font-size: 14px;

  color: #a5a5a5;

  font-weight: 400;

}

html[dir="rtl"] .custom-select::-moz-placeholder,

html[dir="rtl"] .form-control::-moz-placeholder {

  text-align: right;

}

html[dir="rtl"] .custom-select::placeholder,

html[dir="rtl"] .form-control::placeholder {

  text-align: right;

}

html[dir="ltr"] .custom-select::-moz-placeholder,

html[dir="ltr"] .form-control::-moz-placeholder {

  text-align: left;

}

html[dir="ltr"] .custom-select::placeholder,

html[dir="ltr"] .form-control::placeholder {

  text-align: left;

}

.form-control:is(textarea) {

  height: 98px;

  resize: none;

  padding: 11px 16px;

}



.wpcf7-form-control-wrap:has(select) {

  position: relative;

}

.wpcf7-form-control-wrap:has(select)::after {

  content: "";

  position: absolute;

  top: 0;

  height: 48px;

  display: flex;

  align-items: center;

  inset-inline-end: 28px;

  font-size: 14px;

  color: #a5a5a5;

  font-family: "Font Awesome 6 Pro";

  font-weight: 900;

  content: "\f107";

}



.form-group:has(.wpcf7-not-valid-tip) .form-control,

.form-group:has(.wpcf7-not-valid-tip) .custom-select {

  border-color: #f00;

}



.file-content {

  position: relative;

  width: 100%;

}

.file-content input {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  opacity: 0;

  cursor: pointer;

  z-index: 2;

}

.file-content .file-preview {

  display: flex;

  align-items: center;

  padding: 12px 16px;

  height: auto;

  min-height: 48px;

  padding-inline-end: 125px;

}

.file-content .file-btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  inset-inline-end: 15px;

  z-index: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  background-color: var(--text2);

  width: 110px;

  height: 35px;

  border-radius: 20px;

  font-size: 14px;

  font-weight: 500;

  color: #ffffff;

  transition: all 0.3s ease-in-out;

}

.file-content:hover .file-btn {

  background-color: #eb5757;

  color: #fff;

}

form .main-btn {

  height: 48px;

  color: #fff;

  padding: 0 35px;

  font-size: 18px;

  margin: 20px auto 0;

}

@media (max-width: 767px) {

  .file-content .file-preview {

    padding-inline-end: 120px;

  }

  .file-content .file-btn {

    font-size: 12px;

    width: 100px;

    inset-inline-end: 5px;

  }

}



.inner-slide-img {

  width: 100%;

  aspect-ratio: 740/359;

}

.inner-slide-img img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.page-slider {

  position: relative;

}



.page-slider .swiper-btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  width: 56px;

  height: 56px;

  background-color: #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  fill: #035245;

  cursor: pointer;

  transition: all 0.3s ease-in-out;

  z-index: 5;

  opacity: 0;

  visibility: hidden;

}

.page-slider:hover .swiper-btn {

  opacity: 1;

  visibility: visible;

}

.page-slider .swiper-btn:hover {

  fill: #fff;

  background-color: #035245;

}



@media (max-width: 767px) {

  .page-slider .swiper-btn {

    width: 40px;

    height: 40px;

    visibility: visible;

    opacity: 1;

  }

}



html[dir="ltr"] .page-slider .swiper-btn svg {

  transform: scaleX(-1);

}



.darkMode .page-slider .swiper-btn {

  border: 2px solid #fff;

  fill: #fff;

}



.darkMode .page-slider .swiper-btn:hover {

  fill: #035245;

  background-color: #fff;

}



.page-slider .swiper-btn.swiper-btn-next {

  inset-inline-end: 35px;

}

.page-slider .swiper-btn.swiper-btn-prev {

  inset-inline-start: 35px;

}



@media (max-width: 767px) {

  .gallery {

    flex-direction: column;

  }

  .gallery .gallery-item {

    width: 100% !important;

    margin: 0 !important;

  }

  .gallery .gallery-item img {

    width: 100% !important;

  }

}

.highlight {

  color: #fff;

  background-color: #28a745;

  display: inline-block;

  padding: 0.25em 0.4em;

  font-size: 75%;

  font-weight: 700;

  line-height: 1;

  text-align: center;

  white-space: nowrap;

  vertical-align: baseline;

  border-radius: 0.25rem;

}



/**/



.news-list-wild {

  display: grid;

  grid-template-columns: repeat(2, 1fr);

  gap: 30px;

}



@media (max-width: 1199px) {

  .news-list-wild {

    grid-template-columns: repeat(3, 1fr);

    gap: 30px 15px;

  }

}



@media (max-width: 991px) {

  .news-list-wild {

    grid-template-columns: repeat(2, 1fr);

    gap: 30px;

  }

}



@media (max-width: 991px) {

  .news-list-wild {

    grid-template-columns: 1fr;

    gap: 20px;

  }

}



@media (min-width: 1200px) {

  .news-list-wild .article-item {

    flex-direction: row;

    align-items: center;

    gap: 15px;

    border: 1px solid #e2e6ee;

    padding: 15px;

    background-color: var(--mode);

    border-radius: 20px;

    margin: 0;

  }

  .news-list-wild .article-item .article-img {

    width: 120px;

    box-shadow: none;

    aspect-ratio: 120/143;

    align-items: center;

    justify-content: center;

    border: none;

  }

  .news-list-wild .article-item .article-img img {

    max-width: 100%;

    max-height: 100%;

    object-fit: contain;

  }



  .news-list-wild .article-item .article-information {

    border-radius: 0;

    box-shadow: none;

    padding: 0;

    margin: 0;

    text-align: start;

    background-color: transparent;

    border: none;

  }

  .news-list-wild .article-item .article-date {

    inset-inline-start: 15px;

    inset-inline-end: unset;

    font-size: 11px;

    height: auto;

    padding: 0;

    box-shadow: none;

    gap: 3px;

    border: none;

  }

  .news-list-wild .article-item .article-date svg {

    width: 16px;

  }

  .news-list-wild .article-item .article-head {

    margin-bottom: 5px;

  }

  .news-list-wild .article-item .article-head::before {

    display: none;

  }

  .news-list-wild .article-item .article-title {

    text-align: start;

    font-size: 16px;

    line-height: 1.5;

    -webkit-line-clamp: 3;

    height: 48px;

  }

  .news-list-wild .article-item .article-summary {

    height: auto;

    color: var(--text2);

  }

  .news-list-wild .article-item .article-btn {

    position: relative;

    inset: unset;

    transform: none;

    margin-top: 5px;

  }

}



.location-content{

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 15px;

}



.location-contacts{

  flex-direction: column;

  gap: 15px;

  align-items: start;

}

.location-contacts .location-img.alJubail{

  aspect-ratio: unset;

}



@media (max-width: 1199px) {

  .location-content{

    grid-template-columns: 1fr;

  }

}