.custom-bg-color-grey-1 {
		background-color: #f8f9fb;
}

.overlay-tertiary:before {
		background: var(--tertiary);
}

.custom-font-size-1 {
		font-size: 80px;
}

p {
		color: #999;
}

.custom-heading-1 {
		-webkit-text-fill-color: transparent;
		-webkit-text-stroke-width: 0.5px;
		-webkit-text-stroke-color: var(--grey-500);
		white-space: nowrap;
		font-size: 80px;
		font-weight: bold;
		letter-spacing: 1px;
}

@media (max-width: 991px) {
		.custom-heading-1 {
				font-size: 50px;
		}
}

.custom-stroke-text-effect-1 {
		-webkit-text-fill-color: transparent;
		-webkit-text-stroke-width: 1px;
		-webkit-text-stroke-color: var(--light);
		white-space: nowrap;
}

.custom-text-pos-1 {
		left: -80px;
}

.custom-text-pos-2 {
		right: -80px;
}

.custom-text-pos-3 {
		left: -10%;
		top: 45%;
}

.custom-el-pos-1 {
		margin-top: -160px;
}

.custom-el-pos-2 {
		margin-top: -73px;
}

.custom-el-pos-3 {
		margin-top: -73px;
}

.custom-drop-caps .custom-drop-caps-number {
		font-weight: bold;
		float: left;
		font-size: 90px;
		line-height: 90px;
		padding: 0;
		margin-right: 15px;
		margin-top: 0;
}

.custom-vr-1 {
		width: 6px;
		height: 70px;
}

@media (max-width: 991px) {
		#header .header-logo img {
				max-width: 245px;
				height: auto;
		}
}

.section-intro {
		background: url(../../img/demos/transportation-logistic/generic/generic-1.png) no-repeat 12% 100%;
		min-height: 400px;
}

.custom-carousel-1-wrapper {
		margin-top: -48px;
		margin-bottom: -100px;
		position: relative;
		z-index: 1;
		min-height: 300px;
}

@media (min-width: 992px) {
		.custom-carousel-1-wrapper {
				margin-top: -143px;
		}
}

.custom-carousel-1 .owl-stage-outer .owl-item {
		padding: 20px 2px 40px 18px;
}

.custom-carousel-1 .owl-stage-outer .owl-item .card {
		transition: all 0.1s ease-in-out;
}

.custom-carousel-1 .owl-stage-outer .owl-item.active .card {
		box-shadow: 0 0px 20px rgba(0, 0, 0, 0.05);
}

@media (max-width: 991px) {
		.custom-carousel-1 .owl-carousel.nav-bottom.nav-bottom-align-left {
				position: relative;
				top: 20px;
				width: 100% !important;
				padding-right: 20px;
		}
}

.custom-carousel-1 .owl-carousel.nav-bottom.nav-bottom-align-left .owl-nav {
		position: absolute;
		top: 73px;
		left: -78px;
}

@media (min-width: 1200px) {
		.custom-parallax-1 .parallax-background {
				background-size: 100% !important;
		}
}

* =====================================================
   CUSTOM ROTATED TEXT - Para frases largas
   ===================================================== */

/* Tamaño de fuente más pequeño para frases largas */
.custom-font-size-2 {
    font-size: 50px;
}

@media (max-width: 1199px) {
    .custom-font-size-2 {
        font-size: 40px;
    }
}

@media (max-width: 991px) {
    .custom-font-size-2 {
        font-size: 32px;
    }
}

@media (max-width: 767px) {
    .custom-font-size-2 {
        font-size: 24px;
    }
}

/* =====================================================
   TEXTO ROTADO - LADO IZQUIERDO
   ===================================================== */

/* Contenedor para texto rotado a la izquierda */
.custom-rotated-left {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

/* Posición del texto stroke (sombra) - izquierda */
.custom-text-pos-left-stroke {
    left: -60px;
}

@media (max-width: 991px) {
    .custom-text-pos-left-stroke {
        left: -40px;
    }
}

/* =====================================================
   TEXTO ROTADO - LADO DERECHO
   ===================================================== */

/* Contenedor para texto rotado a la derecha */
.custom-rotated-right {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

/* Posición del texto stroke (sombra) - derecha */
.custom-text-pos-right-stroke {
    right: -60px;
}

@media (max-width: 991px) {
    .custom-text-pos-right-stroke {
        right: -40px;
    }
}

/* =====================================================
   EFECTO STROKE PARA TEXTO LARGO
   ===================================================== */

.custom-stroke-text-effect-2 {
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: var(--light);
    white-space: nowrap;
}

/* =====================================================
   AJUSTES DE TRANSFORM-ORIGIN
   ===================================================== */

/* Para que el texto rote desde el centro-izquierda */
.rotate-origin-left {
    transform-origin: left center;
}

/* Para que el texto rote desde el centro-derecha */
.rotate-origin-right {
    transform-origin: right center;
}