/* Default overrides to ensure smooth transitions */
.slide-title,
.title-line,
.sub-title-line,
.solution-intro-map,
.global-title,
.bottom-links-title,
.product-point-wrap,
.global-info-item,
.sustainability-title .title-line,
.sustainability-title .sub-title-line {
    transition: opacity 1.5s ease-out, transform 1.5s ease-out !important;
}

/* Specific fix for slide titles to ensure they are centered and contained */
.main-slide-section {
    position: relative;
    height: 100vh !important;
    /* Force full viewport height */
    min-height: 600px;
    overflow: hidden;
    /* Prevent bleed */
    display: flex;
    /* Flexbox for centering */
    align-items: center;
    justify-content: center;
}

.slide-inner {
    width: 100%;
    height: 100%;
    position: relative;
}

.slide-title {
    top: 50%;
    /* transform is handled by JS to move from calc(-50% + 100px) to translateY(-50%) */
    position: absolute;
    /* Ensure it's absolute if not already */
    width: 100%;
    text-align: left;
    /* Or center depending on design, seemingly left based on layout */
    padding-left: 10%;
    /* Add some breathing room */
    padding-right: 10%;
    /* Prevent hitting right edge */
    z-index: 10;
    word-break: keep-all;
    /* Prevent awkward breaks in Korean */
    box-sizing: border-box;
}

/* Force videos to display if they are hidden */
video.background-item {
    opacity: 1 !important;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.solution-intro-map-dot {
    opacity: 0;
    transform: scale(0);
    transition: all 0.5s ease-out !important;
}

.solution-intro-map-dot.visible {
    opacity: 1;
    transform: scale(1);
}

/* Ensure tooltips work on hover */
.solution-intro-map-dot .tooltip {
    transition: opacity 0.3s;
    opacity: 0;
}

.solution-intro-map-dot:hover .tooltip {
    opacity: 1 !important;
}

/* Tab indicator smooth transition */
.tab-indicator {
    transition: left 0.3s ease-out;
}

/* Rolling counter text */
.rolling-counter {
    display: flex;
}