h1, h2, h3, h4, h5, h6,
h1.font-weight-semibold, h2.font-weight-semibold, h3.font-weight-semibold,
h4.font-weight-semibold, h5.font-weight-semibold, h6.font-weight-semibold,
h1.font-weight-bold, h2.font-weight-bold, h3.font-weight-bold,
h4.font-weight-bold, h5.font-weight-bold, h6.font-weight-bold 

{
    font-family: "Yeseva One", serif !important;
    /* font-family: "Rozha One", serif !important; */
    
    
    /* 
    Yeseva One has only one real weight.
    Porto sets heavier font-weights on headings by default,
    so forcing font-weight: 400 prevents fake (synthetic) bolding
    and keeps spacing/rendering consistent across browsers.
    */
    font-weight: 400 !important; /* !important - override Porto bold/semi-bold classes */
    letter-spacing: 0.4px; /* spacing tweaked for readability on Yeseva One */
		
	color: var(--dark);
}



.font-POPPINS {
    font-family: "Poppins", "Arial", sans-serif !important;
}

.font-BALOO {
    font-family: "Baloo 2", sans-serif !important;
}


.font-QUICKSAND {
    font-family: "Quicksand", "Arial", sans-serif !important;
    font-weight: 400; /* default for Quicksand */
    letter-spacing: normal;
}

.font-YESEVAONE {
    font-family: "Yeseva One", serif !important;
    font-weight: 400; /* prevent fake bold */
    letter-spacing: 0.4px; /* optional, adjust if needed */
}

.font-ROZHAONE {
    font-family: "Rozha One", serif !important;
    font-weight: 400; /* prevents fake bold */
    letter-spacing: 0.4px; /* slightly tighter than Yeseva One */
}





.partner-logo img {
    max-height: 150px;
    max-width: 250px;
    width: auto;
    object-fit: contain;
}





.margin-BOTTOM_0 {
	margin-bottom: 0px !important;
}





/* 
.carousel-SMALL-wrapper {
    height: 320px;
    position: relative;
    overflow: hidden;
}
.carousel-SMALL {
    height: 100%;
}
.carousel-SMALL .owl-stage-outer,
.carousel-SMALL .owl-stage,
.carousel-SMALL .owl-item {
    height: 100%;
}
.carousel-SMALL img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    display: block;
} */


/* .carousel-SMALL-wrapper {
    height: 320px;
    overflow: hidden;
}
.carousel-SMALL-wrapper,
.carousel-SMALL-wrapper .thumb-info-wrapper,
.carousel-SMALL-wrapper .thumb-info-content-inner-hidden {
    transform: none !important;
    top: 0 !important;
    bottom: auto !important;
}
.carousel-SMALL,
.carousel-SMALL .owl-stage-outer,
.carousel-SMALL .owl-stage,
.carousel-SMALL .owl-item {
    height: 100%;
}
.carousel-SMALL img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
} */


.card-carousel .carousel-SMALL-wrapper,
.card-carousel .carousel-SMALL-wrapper .thumb-info-wrapper,
.card-carousel .carousel-SMALL .owl-stage-outer,
.card-carousel .carousel-SMALL .owl-stage,
.card-carousel .carousel-SMALL .owl-item,
.card-carousel .carousel-SMALL img {
    height: 300px;
    width: 100%;
}

.card-carousel .carousel-SMALL img {
    display: block;
    object-fit: cover;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08); /* light gray shadow */
}

.card-carousel .carousel-SMALL,
.card-carousel .carousel-SMALL .owl-item {
    margin: 0 !important;
    padding: 0;
}

/* 
OLD code
.carousel-SMALL-wrapper .thumb-info {
    pointer-events: auto;
}

.carousel-SMALL-wrapper .thumb-info-show-hidden-content-hover {
    transform: none !important;
    transition: none !important;
}

.carousel-SMALL-wrapper,
.carousel-SMALL-wrapper .thumb-info-wrapper,
.carousel-SMALL .owl-stage-outer,
.carousel-SMALL .owl-stage,
.carousel-SMALL .owl-item,
.carousel-SMALL img {
    height: 300px;
    width: 100%;
    object-fit: cover;
    display: block;
}

.card-carousel .carousel-SMALL {
    margin: 0;
    padding: 0;
}

.card-carousel .carousel-SMALL .owl-item {
    margin: 0 !important;
    padding: 0;
}

.card-carousel .carousel-SMALL img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    border-radius: 4px;
} */



#header .header-nav-main nav > ul > li > a {
    font-size: 15px;              /* default Porto is ~13px */
    font-weight: 700;             /* fixes thin text */
    letter-spacing: 0.3px;        /* optional, improves readability */
}




.bg-primary-SOFT {
	background-color: var(--primary-rgba-50) !important;
}


















/* 
.header-logo img {
    height: 55px !important;
    width: auto !important;
} */


/*
total height of logo's parent element was 59.66px in DevTools
here margin top and bottom are decreased from 16px to 5px
there is still ~51.66px left for logo
so I put logo to 50px
in HTML I deleted this part: width="131" height="27"
*/
#header .header-logo {
    margin: 4px 0 !important;
}
#header .header-logo img {
    height: 72px !important;
    width: auto !important;
}




/* Wrapper centers the image */
.slide-sapica-wrapper {
    position: absolute;
    top: 40%;
    left: 41%;
    transform: translate(-50%, -50%);
    z-index: 2;
    pointer-events: none; /* so it doesn’t block clicks */
}
/* Main image */
.slide-sapica {
    width: 30vw !important;      /* scales to 30% of viewport width on desktop */
    max-width: none !important;   /* ignore Bootstrap constraints */
    height: auto !important;      /* maintain aspect ratio */
    /* NOT VISIBLE WITH THIS ON: opacity: 0.08 !important;     /* transparency */
    filter: brightness(0.3) contrast(0.8) !important;
}
/* Tablets */
@media (max-width: 991px) {
    .slide-sapica {
        width: 50vw !important;
    }
}
/* Smartphones */
@media (max-width: 575px) {
    .slide-sapica {
        width: 85vw !important;
    }
}




.spacer-sm { height: 10px; }
.spacer-md { height: 25px; }
.spacer-lg { height: 50px; }


/* Utility to center a list block while keeping text and bullets aligned left */
.CENTERED-LIST-WRAPPER {
    text-align: center; /* Centers the list block itself if text-align isn't already inherited */
}

.CENTERED-LIST-WRAPPER ul, 
.CENTERED-LIST-WRAPPER ol {
    display: inline-block; /* Shrinks the list container to tightly fit the content */
    text-align: left;      /* Aligns text to the left, keeping bullets next to words */
}

