/* =========================================================
   PRODUCTS SECTION
========================================================= */

.aar-products-section{

    position:relative;

    overflow:hidden;

    padding:
        120px 0 110px;

    background:#070707;

    color:#fff;

}


/* =========================================================
   BACKGROUND
========================================================= */

.aar-products-grid{

    position:absolute;

    inset:0;

    opacity:.035;

    background-image:
        linear-gradient(
            rgba(75,53,209,.8) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(75,53,209,.8) 1px,
            transparent 1px
        );

    background-size:80px 80px;

}


.aar-products-glow{

    position:absolute;

    border-radius:50%;

    filter:blur(120px);

    pointer-events:none;

}


.aar-products-glow-1{

    width:500px;
    height:500px;

    left:-300px;
    top:300px;

    background:
        rgba(75,53,209,.12);

}


.aar-products-glow-2{

    width:450px;
    height:450px;

    right:-250px;
    bottom:150px;

    background:
        rgba(255,91,32,.06);

}


/* =========================================================
   HEADING
========================================================= */

.aar-products-heading{

    margin-bottom:65px;

}


.aar-products-label{

    display:flex;

    align-items:center;

    gap:12px;

    color:#ff5b20;

    font-size:9px;

    font-weight:700;

    letter-spacing:4px;

    margin-bottom:20px;

}


.aar-products-label span{

    width:40px;
    height:2px;

    background:#ff5b20;

}


.aar-products-heading h2{

    margin:0;

    font-size:
        clamp(40px,5vw,65px);

    line-height:1;

    font-weight:300;

    letter-spacing:-2.5px;

}


.aar-products-heading h2 strong{

    color:#fe9c2d;

    font-weight:700;

}


.aar-products-heading p{

    max-width:470px;

    margin:0;

    color:#707070;

    font-size:11px;

    line-height:1.9;

}


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

.aar-product-card{

    position:relative;

    height:100%;

    overflow:hidden;

    background:#101010;

    border:
        1px solid rgba(255,255,255,.07);

    transition:
        transform .5s cubic-bezier(.2,.7,.2,1),
        border-color .4s,
        box-shadow .5s;

}


.aar-product-card:hover{

    transform:
        translateY(-10px);

    border-color:
        rgba(75,53,209,.5);

    box-shadow:
        0 30px 70px rgba(0,0,0,.35);

}


/* =========================================================
   PRODUCT IMAGE
========================================================= */

.aar-product-image{

    position:relative;

    height:290px;

    overflow:hidden;

    background:#151515;

}


.aar-product-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:
        transform 1s cubic-bezier(.2,.7,.2,1),
        filter .6s;

}


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

    transform:scale(1.09);

    filter:
        brightness(.65)
        saturate(1.1);

}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.aar-product-image-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(0,0,0,.8),
            transparent 55%
        );

    z-index:1;

}


.aar-product-image::after{

    content:"";

    position:absolute;

    width:150%;

    height:60px;

    left:-130%;

    top:45%;

    transform:rotate(-15deg);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.12),
            transparent
        );

    transition:
        left .9s ease;

    z-index:2;

}


.aar-product-card:hover
.aar-product-image::after{

    left:130%;

}


/* =========================================================
   PRODUCT NUMBER
========================================================= */

.aar-product-number{

    position:absolute;

    top:20px;
    left:20px;

    z-index:3;

    color:#fff;

    font-size:10px;

    font-weight:700;

    letter-spacing:2px;

}


/* =========================================================
   CATEGORY
========================================================= */

.aar-product-category{

    position:absolute;

    left:20px;
    bottom:18px;

    z-index:3;

    color:#ddd;

    font-size:7px;

    letter-spacing:2px;

}


/* =========================================================
   VIEW ICON
========================================================= */

.aar-product-view{

    position:absolute;

    right:18px;
    bottom:15px;

    z-index:3;

    width:42px;
    height:42px;

    display:flex;

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

    color:#ff5b20;

    border:
        1px solid rgba(255,91,32,.45);

    transition:
        .4s;

}


.aar-product-card:hover
.aar-product-view{

    color:#111;

    background:#ff5b20;

    transform:
        rotate(45deg);

}


/* =========================================================
   PRODUCT CONTENT
========================================================= */

.aar-product-content{

    position:relative;

    padding:
        27px 25px 25px;

}


.aar-product-content h3{

    margin:0;

    font-size:22px;

    font-weight:400;

    letter-spacing:-.5px;

}


.aar-product-content p{

    min-height:65px;

    margin:
        12px 0 18px;

    color:#666;

    font-size:10px;

    line-height:1.8;

}


/* =========================================================
   TAGS
========================================================= */

.aar-product-tags{

    display:flex;

    flex-wrap:wrap;

    gap:7px;

    margin-bottom:22px;

}


.aar-product-tags span{

    padding:
        5px 8px;

    color:#777;

    font-size:6px;

    letter-spacing:1.5px;

    border:
        1px solid rgba(255,255,255,.08);

}


/* =========================================================
   INQUIRE BUTTON
========================================================= */

.aar-product-btn{

    display:flex;

    align-items:center;

    justify-content:space-between;

    width:100%;

    padding:
        13px 14px 13px 18px;

    color:#fff;

    text-decoration:none;

    font-size:8px;

    font-weight:700;

    letter-spacing:2px;

    background:#191919;

    border:
        1px solid rgba(255,255,255,.07);

    transition:
        .4s;

}


.aar-product-btn i{

    width:28px;
    height:28px;

    display:flex;

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

    color:#ff5b20;

    background:#111;

    transition:.4s;

}


.aar-product-btn:hover{

    color:#111;

    background:#ff5b20;

}


.aar-product-btn:hover i{

    color:#ff5b20;

    background:#111;

    transform:
        translateX(3px);

}


/* =========================================================
   FEATURED PRODUCT
========================================================= */

.aar-product-featured{

    background:
        linear-gradient(
            145deg,
            #15114a,
            #101010 65%
        );

}


.aar-product-featured::before{

    content:"FEATURED";

    position:absolute;

    right:0;
    top:0;

    z-index:5;

    padding:
        7px 12px;

    color:#111;

    background:#ff5b20;

    font-size:6px;

    font-weight:800;

    letter-spacing:2px;

}


/* =========================================================
   BOTTOM CTA
========================================================= */

.aar-products-bottom{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

    margin-top:70px;

    padding:
        35px 40px;

    background:#101010;

    border:
        1px solid rgba(255,255,255,.07);

}


.aar-products-bottom small{

    color:#555;

    font-size:7px;

    letter-spacing:3px;

}


.aar-products-bottom h3{

    margin:8px 0 0;

    font-size:22px;

    font-weight:300;

}


.aar-products-bottom h3 strong{

    color:#fe9c2d;

    font-weight:700;

}


.aar-products-main-btn{

    flex-shrink:0;

    display:flex;

    align-items:center;

    gap:20px;

    padding:
        14px 14px 14px 20px;

    color:#fff;

    text-decoration:none;

    background:#fe9c2d;

    font-size:8px;

    font-weight:700;

    letter-spacing:2px;

    transition:.4s;

}


.aar-products-main-btn i{

    width:32px;
    height:32px;

    display:flex;

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

    color:#111;

    background:#ff5b20;

}


.aar-products-main-btn:hover{

    color:#111;

    background:#ff5b20;

}


.aar-products-main-btn:hover i{

    color:#ff5b20;

    background:#111;

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:991px){

    .aar-products-section{

        padding:
            90px 0;

    }


    .aar-products-heading p{

        margin-top:25px;

    }


    .aar-product-image{

        height:260px;

    }

}


@media(max-width:767px){

    .aar-products-section{

        padding:
            75px 0;

    }


    .aar-products-heading{

        margin-bottom:45px;

    }


    .aar-products-heading h2{

        font-size:42px;

    }


    .aar-product-image{

        height:250px;

    }


    .aar-product-content{

        padding:
            23px 20px 20px;

    }


    .aar-product-content h3{

        font-size:20px;

    }


    .aar-product-content p{

        min-height:auto;

    }


    .aar-products-bottom{

        display:block;

        padding:25px;

    }


    .aar-products-main-btn{

        width:100%;

        justify-content:space-between;

        margin-top:25px;

    }

}