html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px; /* Adjust based on your header height */
}

body {
  margin: 0;
  padding: 0;
  font-family: 'Satoshi-Medium';
  line-height: 1.8;
}

@font-face {
  font-family: 'Satoshi-Light';
  src: url('../fonts/Satoshi-Light.woff2') format('woff2'),
    url('../fonts/Satoshi-Light.woff') format('woff'),
    url('../fonts/Satoshi-Light.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Satoshi-LightItalic';
  src: url('../fonts/Satoshi-LightItalic.woff2') format('woff2'),
    url('../fonts/Satoshi-LightItalic.woff') format('woff'),
    url('../fonts/Satoshi-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Satoshi-Regular';
  src: url('../fonts/Satoshi-Regular.woff2') format('woff2'),
    url('../fonts/Satoshi-Regular.woff') format('woff'),
    url('../fonts/Satoshi-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Satoshi-Italic';
  src: url('../fonts/Satoshi-Italic.woff2') format('woff2'),
    url('../fonts/Satoshi-Italic.woff') format('woff'),
    url('../fonts/Satoshi-Italic.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Satoshi-Medium';
  src: url('../fonts/Satoshi-Medium.woff2') format('woff2'),
    url('../fonts/Satoshi-Medium.woff') format('woff'),
    url('../fonts/Satoshi-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Satoshi-MediumItalic';
  src: url('../fonts/Satoshi-MediumItalic.woff2') format('woff2'),
    url('../fonts/Satoshi-MediumItalic.woff') format('woff'),
    url('../fonts/Satoshi-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Satoshi-Bold';
  src: url('../fonts/Satoshi-Bold.woff2') format('woff2'),
    url('../fonts/Satoshi-Bold.woff') format('woff'),
    url('../fonts/Satoshi-Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Satoshi-BoldItalic';
  src: url('../fonts/Satoshi-BoldItalic.woff2') format('woff2'),
    url('../fonts/Satoshi-BoldItalic.woff') format('woff'),
    url('../fonts/Satoshi-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: 'Satoshi-Black';
  src: url('../fonts/Satoshi-Black.woff2') format('woff2'),
    url('../fonts/Satoshi-Black.woff') format('woff'),
    url('../fonts/Satoshi-Black.ttf') format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: 'Satoshi-BlackItalic';
  src: url('../fonts/Satoshi-BlackItalic.woff2') format('woff2'),
    url('../fonts/Satoshi-BlackItalic.woff') format('woff'),
    url('../fonts/Satoshi-BlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-display: swap;
  font-style: italic;
}

.satoshi-medium {
  font-family: 'Satoshi-Medium';
}

.satoshi-bold {
  font-family: 'Satoshi-Bold';
}

.satoshi-black {
  font-family: 'Satoshi-Black';
}

.section {
  width: 100%;
  padding: 0px 20px;
}

.container-review {
  width: 85%;
  margin: 0 auto;
  max-width: 1200px;
}

#map {
  height: 860px;
  width: 100%;
}

.splide__slide img {
  border-radius: 12px;
}
.splide {
  position: relative;
}
.splide__list {
  height: auto;
}
.splide .custom-arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  right:-35px;
  cursor: pointer;
}
.splide .custom-arrow.left {
  left:-35px;
}
.testi-slider {
  background-color: #F6F2EB;
  border-radius: 12px;
  padding: 28px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.testi-slider .testi-text {
  max-width: 250px;
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  height: 13em;
}
footer a {
  max-width: 56px;
  width: 11%;
}
footer img {
  width: 100%;
}
#review-modal {
  z-index: 999;
  padding: 20px;
}
#review-modal > div {
  width: 100%;
  max-width: 950px;
  max-height: 95vh;
  overflow-y: auto;
}
.footer-pattern.bg-pattern {
  position: absolute;
  bottom: -290px;
}
.review-banner {
  background-image: url(review-banner-bg.png);
  background-position: top right;
  background-repeat: no-repeat;
  background-size: auto 100%;
}
.review-banner .bg-pattern {
  position: absolute;
  left: -10%;
  top: -30%;
}
.service-bg .bg-pattern {
  position: absolute;
  right: 0;
  bottom: -268px;
  height: 590px;
  width: 530px;
  background-image: url(bg-pattern.svg);
}