.video-section-2 .bar_title {
    display: flex;
    align-items: center;
    text-align: center;
    margin: 20px 0;
    justify-content: space-between;
}

.video-section-2 .bar_title_img {
    width: 400px
}

.video-section-2 .bar_title_custom {
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1)
}

.video-section-2 .bar_title .game-title {
	position: relative;
	margin: auto;
	padding: 0
}

.video-section-2 .bar_title .game-title .bar.left {
	position: absolute;
	top: 50%;
	left: -26rem;
	transform: translateY(50%)
}

.video-section-2 .bar_title .game-title .bar.right {
	position: absolute;
	top: 50%;
	right: -26rem;
	transform: translateY(50%) scaleX(-1)
}

.video-section-2 .bar_title .game-title .bar img {
	width: 65%
}

.video-section-2 .text_game_title {
    font-size: var(--SECTION_HEADER_LARGE_FONT_SIZE);
    line-height: 1.1;
    font-weight: var(--REG_FONT_WEIGHT);
    letter-spacing: 1px;
}

.video-section-2 .bar_title .game-title .title-wrap p {
	font-weight: var(--LIGHT_FONT_WEIGHT);
	font-size: var(--SUBBODY_TXT_FONT_SIZE) !important;
	letter-spacing: 1px;
	margin-top: 10px;
}

.video-frame .col-4 {
	display: flex;
    flex-direction: column;
    gap: 10px 0
}

.viframe-wrap {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%
}

.viframe-wrap.wrap1 {
	min-height: 470px
}

.viframe-wrap.wrap2 {
    min-height: 400px
}

.viframe-wrap.wrap3 {
	max-height: calc(100%/2)
}

.viframe-wrap iframe {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%)
}

.video-section-2.container {
    max-width: 1140px !important; 
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 2. Force the row to group items left-to-right, killing any 'space-between' */
.video-section-2 .video-frame .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important; 
    margin-left: -10px !important;
    margin-right: -10px !important;
    width: auto !important;
}

/* 3. Hard-code standard column widths using padding instead of gap for absolute stability */
.video-section-2 .video-frame .col-12 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.video-section-2 .video-frame .col-8 {
    flex: 0 0 66.666667% !important;
    max-width: 66.666667% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.video-section-2 .video-frame .col-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* 4. Fix the stacked right-side column */
.video-section-2 .video-frame .col-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    gap: 20px 0 !important; 
}

/* 5. Fix the height logic so the stacked videos don't collapse */
.video-section-2 .viframe-wrap.wrap3 {
    height: 100% !important; 
    max-height: calc(50% - 10px) !important; /* Exactly half of the container minus the gap */
    min-height: 190px !important;
}