body {
    background: rgb(0 0 0 / 0.05)
}

#galleryCarousel, .carousel-item {
    height: 500px !important
}

.container-fluid {
    max-width: 1350px !important
}

.column-static {
    width: 450px;
    /* Asegúrate de que no se expanda más allá de 200px */
    flex: 0 0 auto;
}


#experience {
    margin-top: -50px;
}

.share-card {
    background: #f8f9fa;
    border-radius: 16px;
    padding: 16px 10px;
    cursor: pointer;
    transition: all .25s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

    .share-card i {
        font-size: 1.8rem;
    }

    .share-card span {
        font-size: .85rem;
        font-weight: 500;
    }

    .share-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 10px 20px rgba(0,0,0,.12);
    }

.copy-success {
    background-color: #198754 !important;
    color: #fff !important;
    border-color: #198754 !important;
}


@media (max-width: 1140px) {
    .column-static {
        width: 100%;
        flex: 0 0 auto;
    }

    #experience {
        margin-top: 0;
    }
}


@media (max-width: 700px) {
    #experience {
        margin-top: -50px;
    }
}

/* ============================================
   FIX PARA TABS/ACCORDION HÍBRIDO EN TABLER
   ============================================ */

/* Asegurar que el acordeón en mobile no tenga bordes raros */
.accordion-flush .accordion-item {
    border: none !important;
}

/* En mobile, los tab-pane deben mostrarse SIEMPRE (no depender de 'active') */
@media (max-width: 991.98px) {
    .tab-content > .tab-pane {
        display: block !important;
        opacity: 1 !important;
    }

    /* Pero ocultar el contenido desktop dentro del tab-pane */
    .tab-pane > .d-none.d-lg-block {
        display: none !important;
    }
}

/* En desktop, restaurar comportamiento normal de tabs */
@media (min-width: 992px) {
    .tab-content > .tab-pane {
        display: none;
    }

        .tab-content > .tab-pane.active {
            display: block;
        }

    /* Ocultar acordeón en desktop */
    .tab-pane > .d-lg-none.accordion {
        display: none !important;
    }
}

/* Fix para que el acordeón no rompa el layout de tab-content */
.accordion-body {
    padding: 0.5rem;
}

/* ============================================
   JUSTIFICACIÓN DE TEXTOS
   ============================================ */

/* Aplicar text-align: justify a TODO el contenido dentro de tab-pane */
.tab-pane,
.accordion-body {
    text-align: justify !important;
}

    /* Forzar justificación en elementos de bloque comunes dentro del contenido */
    .tab-pane p,
    .tab-pane div,
    .tab-pane span,
    .tab-pane h1,
    .tab-pane h2,
    .tab-pane h3,
    .tab-pane h4,
    .tab-pane h5,
    .tab-pane h6,
    .tab-pane li,
    .accordion-body p,
    .accordion-body div,
    .accordion-body span {
        text-align: justify !important;
    }

    /* Si hay elementos inline que rompen la justificación, forzar block */
    .tab-pane > span,
    .accordion-body > span {
        display: block;
    }