/* common css */
::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: #d6d6d6; }
::-webkit-scrollbar-thumb { background: #888; }
::-webkit-scrollbar-thumb:hover { background: #555; }

.rr-pos-rel { position: relative; }
.rr-pos-abs { position: absolute; }
.rr-ov-hidden { overflow: hidden; }
.rr-container-1350 { max-width: 1350px; }
.rr-container-1410 { max-width: 1410px; }

.rr-bg-primary { background-color: var(--primary); }
.rr-bg-white { background-color: var(--white); }
.rr-bg-black { background-color: var(--black); }
.dark .rr-bg-black { background-color: #171717; }
.rr-bg-light-gray { background-color: #F0F0F0; }
.dark .rr-bg-light-gray { background-color: #212121; }
.rr-bg-light { background-color: #F8F2EF; }
.dark .rr-bg-light { background-color: #111111; --primary: #F8F2EF; }
.rr-text-white { color: var(--white); }
.rr-text-primary { color: var(--primary); }
.text-gray { color: #555555; }
.dark .text-gray { color: #999999; }
.rr-light { color: #F8F2EF; }

.agency-body-border {
  border-right: 1px solid rgba(17, 17, 17, 0.2);
  border-left: 1px solid rgba(17, 17, 17, 0.2);
}
.dark .agency-body-border { border-color: rgba(255, 255, 255, 0.2); }
@media only screen and (max-width: 767px) {
  .agency-body-border { border: none; }
}

.rr-bg-full {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.rr-bg-full img { width: 100%; height: 100%; object-fit: cover; }
.p-relative { position: relative; }
.pos-center {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1;
}
.parallax-view { overflow: hidden; }

.section-subtitle {
  font-size: 14px; font-weight: 500; line-height: 1; padding: 8px 20px; position: relative;
  border-radius: 50px; color: var(--theme); display: inline-flex; border: 1px solid var(--border);
  text-transform: uppercase; background-color: var(--white); letter-spacing: 0.05em;
}
.section-subtitle .start-shape { display: inline-flex; align-items: center; }
.section-subtitle .start-shape:before { content: ""; width: 3px; height: 3px; background-color: var(--theme); display: inline-block; border-radius: 50%; }
.section-subtitle .start-shape:after { content: ""; width: 8px; height: 8px; background-color: var(--theme); display: inline-block; border-radius: 50%; margin: 0 7px; }
.section-subtitle .end-shape { display: inline-flex; align-items: center; }
.section-subtitle .end-shape:before { content: ""; width: 8px; height: 8px; background-color: var(--theme); display: inline-block; border-radius: 50%; margin: 0 7px; }
.section-subtitle .end-shape:after { content: ""; width: 3px; height: 3px; background-color: var(--theme); display: inline-block; border-radius: 50%; }
.section-subtitle.subtitle-white { color: var(--white); border-color: var(--white); font-weight: 400; }
.section-subtitle.subtitle-white::before { background-color: var(--white); }

.section-subtitle-2 { font-family: var(--font_bdogrotesk); font-weight: 400; font-size: 16px; line-height: 30px; letter-spacing: -0.02em; color: var(--primary); display: inline-block; }
.section-subtitle-2.rr-text-white { color: var(--white); }
.section-subtitle-3 { font-weight: 400; font-size: 18px; line-height: 38px; letter-spacing: -0.02em; display: inline-block; color: var(--primary); }
.section-subtitle-4 { font-family: var(--font_bdogrotesk); font-weight: 500; font-size: 15px; line-height: 16px; letter-spacing: -0.05em; text-transform: uppercase; color: var(--primary); display: inline-block; }
.section-subtitle-5 { font-weight: 500; font-size: 16px; line-height: 24px; text-transform: uppercase; color: var(--primary); display: inline-block; }

.go-down {
  width: 28px; height: 28px; background-color: var(--primary); color: var(--white);
  display: flex; align-items: center; justify-content: center; font-size: 12px; border-radius: 50%;
}
.dark .go-down { color: var(--black); }

.section-title { font-size: 44px; }
@media only screen and (max-width: 1919px) { .section-title { font-size: 42px; } }
@media only screen and (max-width: 1399px) { .section-title { font-size: 40px; } }
@media only screen and (max-width: 1199px) { .section-title { font-size: 36px; } }
@media only screen and (max-width: 991px) { .section-title { font-size: 34px; } }
@media only screen and (max-width: 767px) { .section-title { font-size: 32px; } }
@media (max-width: 575px) { .section-title { font-size: 28px; } }