/*==================================================
PRODUCTOS DESTACADOS PREMIUM
==================================================*/

.featured-products{

    background:#07111F;

    padding:90px 0;

    position:relative;

    overflow:hidden;

}

.featured-products::before{

    content:"";

    position:absolute;

    width:800px;

    height:800px;

    border-radius:50%;

    background:radial-gradient(circle,rgba(31,94,255,.18),transparent 70%);

    top:-260px;

    left:50%;

    transform:translateX(-50%);

}

.featured-products .container{

    position:relative;

    z-index:2;

}

/*=========================================
HEADER CENTRADO
=========================================*/

.featured-header{

    text-align:center;

    max-width:760px;

    margin:0 auto 50px;

}

.featured-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 20px;

    border-radius:999px;

    background:rgba(31,94,255,.15);

    border:1px solid rgba(31,94,255,.25);

    color:#7FB2FF;

    font-size:12px;

    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.featured-header h2{

    color:#FFF;

    font-size:56px;

    line-height:1.05;

    margin:0 0 16px;

    font-weight:800;

}

.featured-header p{

    color:#A7B3C8;

    font-size:18px;

    line-height:1.7;

    margin:0;

}

/*=========================================
SLIDER
=========================================*/

.featured-slider{
    display:flex;
    gap:24px;

    /* permite ver la elevación */
    overflow-x:auto;
    overflow-y:visible;

    /* espacio arriba y abajo */
    padding:16px 0 18px;

    scroll-snap-type:x mandatory;
}
.featured-slider::-webkit-scrollbar{

    height:8px;

}

.featured-slider::-webkit-scrollbar-thumb{

    background:#1F5EFF;

    border-radius:999px;

}

/*=========================================
CARD
=========================================*/

.product-card{

    position:relative;

    width:310px;

    min-width:310px;

    background:#FFF;

    border-radius:28px;

    overflow:hidden;

    box-shadow:0 20px 45px rgba(0,0,0,.18);

    transition:.35s ease;

    scroll-snap-align:start;

    display:flex;

    flex-direction:column;

}

.product-card:hover{
    transform:translateY(-6px);

    box-shadow:
        0 32px 70px rgba(0,0,0,.28),
        0 0 28px rgba(31,94,255,.22);
}

.product-label{

    position:absolute;

    top:18px;

    left:18px;

    background:#1F5EFF;

    color:#FFF;

    font-size:12px;

    font-weight:700;

    padding:6px 12px;

    border-radius:999px;

    z-index:5;

}

/*=========================================
IMAGEN
=========================================*/



.product-circle{
    position:absolute;
    width:230px;
    height:230px;
    border-radius:50%;

    /* círculo gris suave visible */
    background:radial-gradient(
        circle,
        #F6F8FB 0%,
        #E9EEF4 60%,
        #DCE4ED 100%
    );

    box-shadow:
        inset 0 6px 14px rgba(255,255,255,.85),
        inset 0 -8px 18px rgba(140,155,175,.10);

    opacity:1;
}

/*=========================================
IMÁGENES HOVER
=========================================*/

.product-image-area{
    position:relative;
    height:250px;
    display:flex;
    align-items:center;
    justify-content:center;

    /* nuevo fondo gris claro neutro */
    background:linear-gradient(
        180deg,
        #FAFBFD 0%,
        #F2F5F9 100%
    );

    overflow:hidden;
}

.product-image-area img{
    position:absolute;
    z-index:2;
    width:82%;
    max-width:245px;
    object-fit:contain;
    transition:opacity .35s ease, transform .35s ease;
    filter:
        drop-shadow(0 20px 30px rgba(0,0,0,.18))
        drop-shadow(0 8px 12px rgba(31,94,255,.10));
}

/* Imagen principal visible */

.img-main{
    opacity:1;
    transform:translateY(-6px) scale(1);
}

/* Imagen hover oculta */

.img-hover{
    opacity:0;
    transform:translateY(-6px) scale(1.03);
}

/* Al pasar el mouse */

.product-card:hover .img-main{
    opacity:0;
    transform:translateY(-6px) scale(1.03);
}

.product-card:hover .img-hover{
    opacity:1;
    transform:translateY(-6px) scale(1.08);
}

.product-card:hover .product-image-area img{

    transform:scale(1.05);

}

.product-card{
    isolation:isolate;
}

/*=========================================
CONTENIDO
=========================================*/

.product-content{

    padding:24px 24px 18px;

    flex:1;

}

.product-brand{
    font-family:'Poppins',sans-serif;

    font-size:11px;
    font-weight:700;

    letter-spacing:1.2px;

    color:#1F5EFF;

    text-transform:uppercase;
}

.product-content h3{
    font-family:'Poppins',sans-serif;

    font-size:21px;
    line-height:1.15;

    color:#071427;

    margin:0 0 12px;

    font-weight:700;
    letter-spacing:-0.4px;
}

.product-specs{
    list-style:none;
    padding:0;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:8px;
}

.product-specs i{
    width:16px;
    color:#1F5EFF;
    font-size:14px;
    text-align:center;
    flex-shrink:0;
}

.product-specs li{
    display:flex;
    align-items:center;

    gap:14px;              /* ← más separación entre icono y texto */

    font-size:13px;
    font-weight:400;

    color:#334155;

    line-height:1.4;

    margin:0;
    padding:2px 0;         /* ← pequeño aire vertical entre líneas */
}

/*=========================================
FOOTER PREMIUM COMPACTO
=========================================*/

.product-footer{
    display:flex;
    align-items:center;
    justify-content:space-between;

    background:#F5F7FB;

    border-top:1px solid #E6ECF5;

    padding:12px 18px;

    min-height:58px;

    border-bottom-left-radius:30px;
    border-bottom-right-radius:30px;
}

/* Precio elegante */

.product-price{
    font-family:'Poppins',sans-serif;

    font-size:22px;      /* tamaño elegante */
    font-weight:600;     /* menos pesado */

    letter-spacing:-0.3px;

    color:#0B1220;

    line-height:1;
    margin:0;

    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

/* Botones pequeños */

.product-actions{
    display:flex;
    align-items:center;
    gap:6px;
}

.product-btn{
    width:30px;
    height:30px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    text-decoration:none;

    color:#FFF;

    transition:.2s ease;

    padding:0;
    margin:0;
}

.product-btn.whatsapp{
    background:#25D366;
}

.product-btn.messenger{
    background:#1877F2;
}

/* FORZAR icono pequeño */

.product-btn i{
    font-size:12px !important;
    line-height:1 !important;
    margin:0 !important;
    padding:0 !important;
    width:auto !important;
    height:auto !important;
    display:block !important;
}

.product-btn:hover{
    transform:translateY(-1px);
    opacity:.92;
}

/*==================================================
SWIPER DESTACADOS FINAL
==================================================*/

/* Contenedor principal */

/*==================================================
CONTENEDOR Y SWIPER FINAL
==================================================*/

.featured-products{
    background:#020B1F;
    padding:80px 0;
    overflow:hidden;
}

.featured-products .container{
    position:relative;
    max-width:1500px;
    margin:0 auto;

    /* espacio lateral para flechas */
    padding:0 72px;
}

/* área visible del carrusel */

/*==================================================
WRAP DEL SLIDER
==================================================*/

.featured-slider-wrap{
    position:relative;
}

/*==================================================
SWIPER
==================================================*/

.featuredSwiper{
    position:relative;
    overflow:hidden; /* mantiene oculta la quinta tarjeta */
    padding:12px 0 48px;
}

/*==================================================
FLECHAS FUERA DEL SWIPER
==================================================*/

.featured-prev,
.featured-next{
    position:absolute;
    top:42%;
    transform:translateY(-50%);

    width:56px;
    height:56px;

    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;
    z-index:9999;

    background:rgba(5,18,44,.95);
    border:1px solid rgba(31,94,255,.55);

    color:#FFFFFF;

    box-shadow:
        0 0 18px rgba(31,94,255,.28),
        0 12px 28px rgba(0,0,0,.42);

    transition:.25s ease;
}

.featured-prev i,
.featured-next i{
    font-size:18px;
    line-height:1;
}

/* AHORA SÍ QUEDAN FUERA DEL CARRUSEL */

.featured-prev{
    left:-72px;
}

.featured-next{
    right:-72px;
}

.featured-prev:hover,
.featured-next:hover{
    background:#1F5EFF;
    transform:translateY(-50%) scale(1.06);
}

@media (max-width:767px){

    .featured-products .container{
        padding:0 16px;
    }

    .featuredSwiper{
        padding:8px 0 40px;
        overflow:hidden;
    }

    .featuredSwiper .swiper-slide{
        width:100% !important;
        margin-right:0 !important;
    }

    .product-card{
        width:100%;
    }

}