/* COLORS */
:root {
	--black: #000;
    --white: #FFF;
    --text: #000;
    --text-hover: #514A91;

    --purple: #241d5e;
    --purple-light: #dfdcf7;
    --green: #b8deb4;
    --green-light: #f1f8f0;
}

.none {
    display: none;
}

/* * {
    border: 1px solid green;
} */

::selection{
    background-color: var(--purple);
    color: var(--white);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: var(--text) !important;
	background-color: var(--bg);
    accent-color: var(--purple);

	&.no-scroll {
		overflow: hidden;
	}

    p, h1, h2, h3, h4, h5, h6, ul, li, ol, span {
        font-family: 'Inter', sans-serif !important;
    }
}

.container {
    max-width: 1480px;
    width: 100%;
    margin: 0 auto;
	padding: 0 20px;
    
    &.no-padding {
        padding: 0;
    }

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

    font-size: 18px;
}

.distance {
    margin-top: 100px;
}

.title-h2 {
    font-size: 40px !important;
    font-weight: 600 !important;
    color: var(--text) !important;
    line-height: 1.3 !important;

    &.white {
        color: var(--white) !important;
    }
}

.swiper-pagination-bullet-active {
	background-color: var(--purple) !important;
}

.fancybox__backdrop {
    background-color: #0E093AB2 !important;
    backdrop-filter: blur(10px) !important;
}

.kingster-top-search-wrap {
    background-color: #0E093AB2 !important;
    backdrop-filter: blur(10px) !important;
}
.kingster-top-search-close {
    translate: 0 4px !important;
}

.adaptive-img-wrapper {
    position: relative;
    overflow: hidden;
}
.adaptive-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.global-modal-btn {
    user-select: none;
    cursor: pointer;
}

/* ADAPTIVE */
/* 960px - 1260px */
@media screen and (max-width: 1200px) {
    
}

/* 768px - 960px */
@media screen and (max-width: 960px) {
    
}

/* 480px - 768px */
@media screen and (max-width: 768px) {
    .title-h2 {
        font-size: 32px !important;
    }
    .distance {
        margin-top: 70px;
    }
}

/* 360px - 480px */
@media screen and (max-width: 480px) {
    
}