:root {

            --jachin-dorado: #C28436;
            --jachin-dorado-claro: #EBB567;
            --jachin-dorado-oscuro: #96560D;
            --jachin-oscuro: #0E0704;
            --jachin-crema: #F6F2E4;
            --jachin-gris: #5B5753;
            --jachin-blanco: #FFFFFF;

        }


        body {

            background:
                var(--jachin-crema);

            color:
                var(--jachin-oscuro);

        }


        /*
        |--------------------------------------------------------------------------
        | NAVBAR
        |--------------------------------------------------------------------------
        */

        .navbar-jachin {

            background:
                rgba(14,7,4,.97);

        }


        .navbar-brand-jachin {

            color:
                var(--jachin-dorado) !important;

            font-weight:
                800;

            letter-spacing:
                3px;

        }


        .navbar-jachin .nav-link {

            color:
                rgba(255,255,255,.82);

        }


        .navbar-jachin .nav-link:hover {

            color:
                var(--jachin-dorado-claro);

        }


        /*
        |--------------------------------------------------------------------------
        | MIGAS
        |--------------------------------------------------------------------------
        */

        .producto-breadcrumb {

            padding:
                35px 0 20px;

        }


        .producto-breadcrumb a {

            color:
                var(--jachin-dorado);

            text-decoration:
                none;

            font-weight:
                700;

        }


        .producto-breadcrumb span {

            color:
                #999;

            margin:
                0 8px;

        }


        /*
        |--------------------------------------------------------------------------
        | PRODUCTO
        |--------------------------------------------------------------------------
        */

        .producto-section {

            padding:
                20px 0 90px;

        }


        /*
        |--------------------------------------------------------------------------
        | GALERÍA
        |--------------------------------------------------------------------------
        */

        .producto-galeria {

            position:
                sticky;

            top:
                25px;

        }


        .producto-principal {

            position:
                relative;

            width:
                100%;

            aspect-ratio:
                4 / 3;

            overflow:
                hidden;

            border-radius:
                20px;

            background:
                #e8e4dc;

        }


        .producto-principal img {

            width:
                100%;

            height:
                100%;

            object-fit:
                cover;

        }


        .producto-sin-imagen {

            width:
                100%;

            height:
                100%;

            display:
                flex;

            align-items:
                center;

            justify-content:
                center;

            color:
                #999;

        }


        .producto-badge {

            position:
                absolute;

            top:
                18px;

            left:
                18px;

            z-index:
                2;

            background:
                var(--jachin-dorado);

            color:
                #fff;

            padding:
                8px 13px;

            font-size:
                11px;

            font-weight:
                800;

            letter-spacing:
                1px;

            border-radius:
                5px;

        }


        .producto-thumbs {

            display:
                grid;

            grid-template-columns:
                repeat(4, 1fr);

            gap:
                10px;

            margin-top:
                12px;

        }


        .producto-thumb {

            border:
                2px solid transparent;

            border-radius:
                10px;

            padding:
                0;

            overflow:
                hidden;

            background:
                #fff;

            cursor:
                pointer;

            aspect-ratio:
                1 / 1;

        }


        .producto-thumb.activo {

            border-color:
                var(--jachin-dorado);

        }


        .producto-thumb img {

            width:
                100%;

            height:
                100%;

            object-fit:
                cover;

        }


        /*
        |--------------------------------------------------------------------------
        | INFORMACIÓN
        |--------------------------------------------------------------------------
        */

        .producto-info {

            padding:
                15px 0 0 25px;

        }


        .producto-categoria {

            color:
                var(--jachin-dorado);

            text-transform:
                uppercase;

            letter-spacing:
                2px;

            font-size:
                12px;

            font-weight:
                800;

            margin-bottom:
                12px;

        }


        .producto-titulo {

            font-size:
                clamp(38px, 5vw, 62px);

            line-height:
                1;

            font-weight:
                800;

            margin-bottom:
                20px;

        }


        .producto-descripcion-corta {

            color:
                var(--jachin-gris);

            font-size:
                17px;

            line-height:
                1.8;

            margin-bottom:
                25px;

        }


        .producto-precio {

            font-size:
                28px;

            font-weight:
                800;

            margin-bottom:
                5px;

        }


        .producto-precio small {

            display:
                block;

            color:
                var(--jachin-gris);

            font-size:
                12px;

            font-weight:
                500;

            margin-top:
                3px;

        }


        .producto-cotizar {

            font-size:
                18px;

            font-weight:
                800;

            color:
                var(--jachin-dorado);

            margin-bottom:
                20px;

        }


        /*
        |--------------------------------------------------------------------------
        | PERSONALIZACIÓN
        |--------------------------------------------------------------------------
        */

        .personalizable-box {

            display:
                flex;

            align-items:
                center;

            gap:
                12px;

            background:
                #fff;

            border-left:
                4px solid var(--jachin-dorado);

            padding:
                17px 18px;

            margin:
                25px 0;

            box-shadow:
                0 8px 25px rgba(14,7,4,.06);

        }


        .personalizable-icon {

            width:
                38px;

            height:
                38px;

            border-radius:
                50%;

            background:
                var(--jachin-oscuro);

            color:
                #fff;

            display:
                flex;

            align-items:
                center;

            justify-content:
                center;

            font-weight:
                800;

        }


        .personalizable-box strong {

            display:
                block;

            font-size:
                14px;

        }


        .personalizable-box span {

            color:
                var(--jachin-gris);

            font-size:
                13px;

        }


        /*
        |--------------------------------------------------------------------------
        | BOTONES
        |--------------------------------------------------------------------------
        */

        .producto-botones {

            display:
                flex;

            flex-wrap:
                wrap;

            gap:
                10px;

            margin-top:
                25px;

        }


        .btn-jachin {

            display:
                inline-flex;

            align-items:
                center;

            justify-content:
                center;

            padding:
                14px 22px;

            border:
                1px solid var(--jachin-dorado);

            background:
                var(--jachin-dorado);

            color:
                #fff;

            text-decoration:
                none;

            font-size:
                12px;

            font-weight:
                800;

            transition:
                .2s ease;

        }


        .btn-jachin:hover {

            background:
                var(--jachin-dorado-oscuro);

            border-color:
                var(--jachin-dorado-oscuro);

            color:
                #fff;

        }


        .btn-jachin-dark {

            background:
                var(--jachin-oscuro);

            border-color:
                var(--jachin-oscuro);

        }


        .btn-jachin-dark:hover {

            background:
                #24150e;

            border-color:
                #24150e;

        }


        /*
        |--------------------------------------------------------------------------
        | DETALLES
        |--------------------------------------------------------------------------
        */

        .detalles-section {

            padding:
                90px 0;

            background:
                #fff;

        }


        .detalle-card {

            height:
                100%;

            padding:
                30px;

            border:
                1px solid #eee;

            border-radius:
                15px;

            background:
                #fff;

        }


        .detalle-card h3 {

            font-size:
                20px;

            font-weight:
                800;

            margin-bottom:
                15px;

        }


        .detalle-card p {

            color:
                var(--jachin-gris);

            line-height:
                1.8;

            margin:
                0;

            white-space:
                pre-line;

        }


        /*
        |--------------------------------------------------------------------------
        | DESCRIPCIÓN
        |--------------------------------------------------------------------------
        */

        .descripcion-section {

            padding:
                90px 0;

            background:
                var(--jachin-crema);

        }


        .descripcion-contenido {

            max-width:
                850px;

        }


        .descripcion-contenido .eyebrow {

            color:
                var(--jachin-dorado);

            text-transform:
                uppercase;

            letter-spacing:
                3px;

            font-size:
                12px;

            font-weight:
                800;

            margin-bottom:
                12px;

        }


        .descripcion-contenido h2 {

            font-size:
                clamp(32px, 4vw, 48px);

            font-weight:
                800;

            margin-bottom:
                25px;

        }


        .descripcion-contenido p {

            color:
                var(--jachin-gris);

            line-height:
                1.9;

            font-size:
                16px;

            white-space:
                pre-line;

        }


        /*
        |--------------------------------------------------------------------------
        | CTA
        |--------------------------------------------------------------------------
        */

        .producto-cta {

            padding:
                90px 0;

            background:
                var(--jachin-oscuro);

            color:
                #fff;

            text-align:
                center;

        }


        .producto-cta h2 {

            font-size:
                clamp(32px, 5vw, 52px);

            font-weight:
                800;

            margin-bottom:
                15px;

        }


        .producto-cta p {

            max-width:
                680px;

            margin:
                0 auto 30px;

            color:
                rgba(255,255,255,.7);

            line-height:
                1.8;

        }


        /*
        |--------------------------------------------------------------------------
        | RESPONSIVE
        |--------------------------------------------------------------------------
        */

        @media (max-width: 991px) {

            .producto-galeria {

                position:
                    static;

            }


            .producto-info {

                padding:
                    35px 0 0;

            }

        }


        @media (max-width: 575px) {

            .producto-thumbs {

                grid-template-columns:
                    repeat(3, 1fr);

            }


            .producto-titulo {

                font-size:
                    40px;

            }

        }