.module.video.thumb {
	width: 100%;

}
.module.video.thumb .image {
	aspect-ratio: 16/9;
	height: auto;
	border-radius: var(--br-card);
	background-color: var(--cl-bright-1);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
.module.video.thumb .description {
	font-size: var(--fs-modbody);
	color: var(--cl-shady-1);
	font-weight: 400;
	line-height: 140%;
}
.module.video.thumb .card:hover .image {
	filter: brightness(120%) contrast(80%);
}
.module.video.thumb .title {
	font-size: var(--fs-body);
	font-family: var(--fn-secondary);
	color: var(--cl-shady-4);
	font-weight: 500;
	line-height: 140%;
}
.module.video.thumb .time {
	font-size: var(--fs-modbody);
	color: var(--cl-shady-1);
	font-weight: 400;
	line-height: 140%;
}
.module.video.thumb .description {
	display: none;
}
.module.video .tag {
	width: fit-content;
	padding: var(--gl-micro-1) var(--gl-micro-3);
	background-color: var(--cl-bright-1);
	border-radius: var(--br-full);
	color: var(--cl-shady-4);
	font-size: var(--fs-modbody);
	font-weight: 500;
	line-height: 130%;
}
.module.video .tag {
	background-color: var(--cl-bright-1);
	color: var(--cl-white);
}
.module.video .tag.platform-pendidikan {
	background-color: var(--cl-emphasis-5);
	color: var(--cl-white);
}
.module.video .tag.perspektif {
	background-color: var(--cl-primary-3);
	color: var(--cl-white);
}
.module.video .tag.lainnya {
	background-color: var(--cl-shady-3);
	color: var(--cl-bright-1);
}

.module.video.first {
    grid-column: 1 / 5;
    padding-bottom: var(--gl-micro-5);
}
.module.video.first .card {
    flex-direction: row;
    gap: var(--gl-micro-5);
}
.module.video.first .image {
    min-height: 300px;
}
.module.video.first .title {
    font-size: var(--fs-subtitle);
    font-family: var(--fn-primary);
    font-weight: 600;
    line-height: 130%;
}
.module.video.first .details {
    gap: var(--gl-micro-4);
}
.module.video.first .description {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
    align-self: stretch;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--fs-body);
    word-break: break-word;
    white-space: pre-wrap;
}
.module.video.first .tag {
    font-size: var(--fs-body);
    padding: var(--gl-micro-2) var(--gl-micro-4);
}
.module.video.first .time {
    font-size: var(--fs-emphasis);
    font-weight: 500;
}

.module.video.moredetails {
    flex-direction: column;
}
.module.video.moredetails .image {
	aspect-ratio: 16/9;
	height: auto;
	border-radius: var(--br-carousel);
	background-color: var(--cl-bright-1);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	overflow: hidden;
}
.module.video.moredetails .image iframe {
	width: 100%;
	height: 100%;
}
.module.video.moredetails .title {
    font-size: var(--fs-title);
}
.module.video.moredetails .time {
    font-family: var(--fn-primary);
    font-size: var(--fs-modtitle);
    color: var(--cl-shady-1);
}
.module.video.moredetails .tag {
    font-size: var(--fs-emphasis);
    padding: var(--gl-micro-2) var(--gl-micro-4);
}
.module.video.moredetails .description {
    font-size: var(--fs-body);
    word-break: break-word;
    white-space: pre-wrap;
}
.module.video.moredetails .description p {
    margin-bottom: var(--gl-micro-4);
}
.module.video.moredetails .description p:last-child {
    margin-bottom: 0;
}
.module.video.moredetails .description a {
    color: var(--cl-primary-3);
}
.module.video.moredetails .description a:hover {
    color: var(--cl-primary-1);
}
.module.video .see-more:hover {
    color: var(--cl-emphasis-5);
}
.module.video .see-more {
    color: var(--cl-primary-3);
    cursor: pointer;
}
.module.video.related h2 {
    font-size: var(--fs-subtitle);
}

.module.video.yt-wrapper {
    border-radius: var(--br-news);
    overflow: hidden;
    box-shadow: var(--sd-links);
    display: flex;
    width: min-content;
    height: min-content;
    background-color: var(--cl-primary-5);
}
.module.video.yt-wrapper:hover {
    box-shadow: var(--sd-links-hover);
    transform: scale(1.02);
}

.module.video.video-wrapper video {
	width: 100%;
	height: 100%;
}
.module.video.video-wrapper {
    border-radius: var(--br-news);
    overflow: hidden;
    box-shadow: var(--sd-links);
    display: flex;
	width: 100%;
	height: 100%;
    background-color: var(--cl-primary-5);
}
.module.video.video-wrapper:hover {
    box-shadow: var(--sd-links-hover);
    transform: scale(1.02);
}