.preview-slider-v2-1-across-fullwidth {
	background-color: var(--sw-secondary-color);
	padding: 70px 0 var(--space-5);
    clip-path: polygon(-0.07% 2.5%, 100% 0%, 100% 100%, -0.07% 100%, -0.07% 10.27%);
	
	&::after {
		content: '';
		position: absolute;
		top: 0;
		right: 0;
		width: 339px;
		height: 592px;
		background: url(../svg/energy_rightside_mobile.svg) no-repeat top 32px right var(--sw-secondary-color);
		z-index: -1;
	}

	.widget-inner {
		gap: var(--space-5);
	}

	.widget-header {
		width: 100%;
		margin-left: calc((100% - var(--width-base)) / 2);
		max-width: calc(100% - ((100% - var(--width-base)) / 2));
		padding-right: var(--space-20);
		flex-wrap: nowrap;
	}
	
	.title-col {
		max-width: 884px;
	}

	.view-all-col {
		justify-content: center;
	}

	.widget-title {
		font-family: var(--font-bold);
		font-size: var(--text-4xl);
		line-height: 1;

		.widget-title-text {
			color: var(--white);
		}
	}

	.widget-view-all,
	.slide-footer .read-more {
		color: var(--white);
		display: grid;
		grid-template-columns: auto auto;
		justify-content: center;
		align-items: center;
		gap: 10px;
		padding: var(--space-3) var(--space-5);
		background-color: var(--sw-collections-read-more-bg);
		clip-path: polygon(100% 92.66%, 4.10% 100%, 0% 0%, 96.99% 4.59%, 100% 92.66%);
	}

	.widget-desc {
		color: var(--white);
		font-family: var(--font-reg);
	}

	.content-section {
		background: var(--white);
		padding: var(--space-4) var(--space-5);
	}

	.overlap-image-desktop {
		height: auto;

		.inner {
			height: 100%;
    		grid-template-rows: auto 1fr;
		}

		.slide-title {
			color: var(--text-color);
			font-family: var(--font-header);
			font-size: clamp(1.5rem, -4.0385rem + 8.6538vw, 3.75rem);
		}

		.details {
			color: var(--text-color);
			display: none;
		}

		.slide-desc {
			color: var(--sw-collections-minor-text-color);
			font-size: 16px;
			line-height: 1.3;
		}
	}

	.glide__bullets {
		display: flex;
		justify-content: center;
		gap: 12px;
		margin: var(--space-6) 0;

		.glide_bullet {
			height: 13px;
			width: 13px;
			background-color: #F5F5F5;
			border-radius: var(--rounded-full);

			&.glide__bullet--active {
				background-color: #3EAF94;
			}
		}
	}

	.glide__arrows {
		position: relative;
		transform: translateY(0px);
		top: 0 !important;
		justify-content: center;
		gap: var(--space-10);

		.glide__arrow {
			margin: 0 0 var(--space-1);
		}
	}
}

@media (hover: hover) {
	.preview-slider-v2-1-across-fullwidth .widget-view-all:hover,
	.preview-slider-v2-1-across-fullwidth .slide-footer .read-more:hover {
		background: var(--dark-pink);
		color: var(--white);
	}
}

@container (min-width: 64em) {
    .preview-slider-v2-1-across-fullwidth {
		padding: 140px 0 100px;
		clip-path: polygon(-0.07% 10.27%,100% 0%,100% 100%, -0.07% 100%, -0.07% 10.27%);

		&::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: url(../svg/energy_leftside_full.svg) no-repeat top 108px left var(--sw-secondary-color);
			z-index: -1;
		}

		&::after {
			content: '';
			position: absolute;
			top: 0;
			right: 0;
			width: 472px;
			height: 100%;
			background: url(../svg/energy_rightside_full.svg) no-repeat top 18px right var(--sw-secondary-color);
			background-size: 100%;
			z-index: -1;
		}

		.widget-view-all {
			padding: var(--space-5);
		}

		.view-all-col {
			justify-content: flex-end;
		}

		.widget-title {
			font-size: 4.375rem;
			line-height: 1.05;
		}

		.overlap-image-desktop {

			.content-section {
				max-width: 488px;
				padding: 30px 50px 30px 30px;
				clip-path: polygon(89.74% 0.07%, 100% 99.73%, 0% 99.73%, 0% 0.07%, 89.74% 0.07%);
				bottom: 0;
				top: 0;
				margin: auto;
				/*max-height: 330px;*/
				opacity: 0;
				transition: opacity 0.7s;
				height: fit-content;
				.glide__slide--active & {
					opacity: 1;
				}

				.info-item .icon {
					color: var(--sw-collections-minor-text-color);
				}
			}

			.slide-desc {
				padding-right: var(--space-8);
				display: -webkit-box;
				-webkit-line-clamp: 6;
				-webkit-box-orient: vertical;  
				overflow: hidden;
			}

			.content-upper {
				gap: var(--space-4);
			}
		}

		.glide__bullets {
			display: none;
		}

		.glide__arrows {
			position: absolute;
			top: unset !important;
			bottom: 14% !important;
			right: 220px;
			left: unset;
			gap: 10px;
		}
	} 
}