.ueb-life-section {
    position: relative;
    isolation: isolate;
    background: var(--color-primary-600);
    padding: 100px 0 40px;
    margin-top: 50px;
    color: #ffffff;
    overflow-x: hidden;
    clip-path: polygon(70% 0, 100% 0, 100% 100%, 0 100%, 0 6%);
    /* previene scroll horizontal en móvil */
}

.ueb-life-inner {
    max-width: 1180px;
    margin: 0 auto;
}

.ueb-life-left {
    display: flex;
    flex-direction: column;
}

.ueb-life-left h1 {
    text-shadow: 0 2px 16px rgba(10, 31, 31, 0.32);
}

/* Hacker text effect (decorativo para #FET) */
.hacker-text { position: relative; display: inline-block; }
.hacker-text.is-animating { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; letter-spacing: 0.5px; }
.hacker-text.is-animating::after {
    content: "";
    position: absolute; left: 0; right: 0; bottom: -2px; height: 2px;
    background: rgba(255,255,255,.35);
    animation: hacker-underline 0.9s ease-in-out infinite alternate;
}
@keyframes hacker-underline { from { opacity:.2; } to { opacity:.6; } }

.ueb-life-left p {
    color: rgba(255, 255, 255, 0.86);
    line-height: 1.6;
    font-size: clamp(1rem, 2vw, 1.075rem);
}

.ueb-life-stats-card {
    border-radius: 50px;
    padding: 20px;
    box-shadow: 0 28px 60px -30px rgba(10, 31, 31, 0.75);
    overflow: hidden;
    /* Viewport del slider */
    width: 100%;
    margin-inline: auto;
}

:root {
    --ueb-stat-gap: clamp(1rem, 3vw, 2rem);
}

.ueb-life-stats-grid {
    display: flex;
    /* Track del slider */
    align-items: stretch;
    gap: var(--ueb-stat-gap);
    text-align: center;
    will-change: transform;
    transition: transform 420ms cubic-bezier(.22, .61, .36, 1);
}

.ueb-life-stat {
    flex: 0 0 calc((100% - 3 * var(--ueb-stat-gap)) / 4);
}

@media (max-width: 1100px) {
    .ueb-life-stat {
        flex-basis: calc((100% - 1 * var(--ueb-stat-gap)) / 2);
    }
}

@media (max-width: 600px) {
    .ueb-life-stat {
        flex-basis: 100%;
    }
}

.ueb-life-stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: rgba(121, 163, 61, .16);
    color: #BDC338;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto .75rem;
    font-size: 1.35rem;
}

.ueb-life-stat-value {
    font-size: clamp(1.4rem, 2.4vw, 1.8rem);
    color: #fff;
    font-weight: 700;
    display: block;
}

.ueb-life-stat-label {
    font-size: .875rem;
    color: rgba(255, 255, 255, .7);
    display: block;
}

.ueb-life-nav {
    display: flex;
    gap: .75rem;
    margin-top: clamp(1.25rem, 3vw, 2rem);
    justify-content: center;
    align-self: center;
}

.ueb-life-nav button {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 2px solid #79A33D;
    background: #fff;
    color: #0A1F1F;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    cursor: pointer;
    transition: background-color .2s, color .2s, transform .15s;
}

.ueb-life-nav button:hover {
    background: #79A33D;
    color: #fff;
    transform: translateY(-2px);
}

.ueb-life-nav button:disabled,
.ueb-life-nav button[aria-disabled="true"] {
    opacity: .4;
    cursor: not-allowed;
    transform: none;
}

.ueb-life-right {
    position: relative;
}

.ueb-life-video-wrapper {
    position: relative;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 35px 80px -40px rgba(10, 31, 31, .75);
    background: #000;
    width: 100%;
    max-width: 360px;
    aspect-ratio: 9/16;
    margin-left: auto;
    margin-right: auto;
}

.ueb-life-video-wrapper iframe {
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: inherit;
}

.ueb-life-video-wrapper::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12);
}

@media (max-width: 768px) {
    .ueb-life-section {
        padding: 100px 0 40px;
    }

    .ueb-life-inner {
        text-align: center;
    }

    .ueb-life-left {
        align-items: center;
    }

    .ueb-life-left p {
        max-width: none;
    }

    .ueb-life-stats-card {
        border-radius: 28px;
        padding: 16px;
        --ueb-stat-gap: 14px;
    }

    .ueb-life-stat-icon {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }

    .ueb-life-stat-value {
        font-size: 1.375rem;
    }

    .ueb-life-stat-label {
        font-size: .8125rem;
        word-break: break-word;
        hyphens: auto;
    }

    .ueb-life-right {
        margin-top: 2.5rem;
    }
}

/* Slider de videos */
.ueb-life-video-slider { position: relative; max-width: 360px; margin-inline: auto; overflow: visible; /* permitir que los botones salgan del contenedor */
    --nav-offset: 45px; /* cuánto sobresalen los botones hacia afuera */
}
.ueb-life-video-viewport { overflow: hidden; border-radius: 24px; }
.ueb-life-video-track { display: flex; will-change: transform; transition: transform 260ms cubic-bezier(.22,.61,.36,1); }
.ueb-life-video-slide { flex: 0 0 100%; }
/* Colocar los botones a la mitad de altura y por fuera del contenedor */
.ueb-life-video-nav { position: absolute; top: 50%; left: calc(-1 * var(--nav-offset)); right: calc(-1 * var(--nav-offset)); transform: translateY(-50%); display: flex; align-items: center; justify-content: space-between; pointer-events: none; z-index: 2; }
.ueb-life-video-btn { width: 44px; height: 44px; border-radius: 999px; border: 2px solid #79A33D; background: #fff; color: #0A1F1F; display: inline-flex; align-items: center; justify-content: center; pointer-events: auto; box-shadow: 0 10px 24px -8px rgba(10, 31, 31, .55); }
.ueb-life-video-btn:hover { background: #79A33D; color: #fff; }

/* En pantallas pequeñas, mantener los botones dentro del contenedor para no cortar contenido */
@media (max-width: 480px) {
    .ueb-life-video-slider { overflow: hidden; --nav-offset: 0px; }
    .ueb-life-video-nav { left: 0; right: 0; }
}