/*=========================================================
GOOGLE FONT
=========================================================*/
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Source+Sans+3:ital,wght@0,200..900;1,200..900&family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

/*=========================================================
ROOT
=========================================================*/

:root{

       --utk-red:#7e1f28;
    --utk-red-dark:#65161e;
    --utk-navy: #071426;
    --utk-text:#2d2d2d;
    --utk-border:#ececec;
    --utk-white:#ffffff;


}

body{
margin:0;
font-family:"Mulish", sans-serif;

    color:var(--text);

    background:#fff;
            font-size: 16px;
            text-align: left;
          

}

   @media(max-width:993px)
        {
          body{text-align: center;}
        }
a{text-decoration: none;}
        img { display: block;  max-width: 100%;}
h1, h2, h3, h4, h5, h6 {
  font-family:"Urbanist", sans-serif;
  font-weight:500;
 
  margin: 0;
}
ul { margin: 0; padding: 0; list-style: none; }
.container { width: 80%; max-width: 100%; }
@media (max-width: 1401px) {
   .container {
        width: 80%;
    }
}
@media (max-width: 1204px) {
   .container {
        width: 95%;
    }
}

figcaption, figure{margin: 0; padding: 0;}

.cr-only{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}





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

.utk-frame{

    position:relative;
    width:100%;
    z-index:9999;

}


/*=========================================================
CONTACT BAR
=========================================================*/

.utk-contactband{

    background:#fff;

    border-bottom:1px solid var(--utk-border);

    padding:12px 0;

}

.utk-contactitems{

    display:flex;

    align-items:center;

    gap:18px;

}

.utk-contactitems a{

    color:#444;

    font-size:14px;

    font-weight:600;

    transition:.30s;

}

.utk-contactitems a:hover{

    color:var(--utk-red);

}

.utk-contactitems i{

    color:var(--utk-red);

    margin-right:8px;

}

.utk-divider{

    width:1px;

    height:14px;

    background:#d8d8d8;

}

.utk-certify{

    display:flex;

    justify-content:flex-end;

    align-items:center;

    font-size:14px;

    font-weight:700;

    color:#333;

}

.utk-certify i{

    margin-right:8px;

    color:var(--utk-red);

}


/*=========================================================
NAVIGATION
=========================================================*/

.utk-navigationwrap{

    background:#fff;

    box-shadow:

        0 10px 30px rgba(0,0,0,.05);

}

.utk-navigationwrap .container{

    position:relative;

}


/*=========================================================
LOGO
=========================================================*/

.utk-brandmark{

    padding:12px 0;

}

.utk-brandmark img{

    height:82px;

    width:auto;

}


/*=========================================================
MENU
=========================================================*/

.utk-menugrid{

    gap:8px;

}

.utk-menugrid>.nav-item{

    position:relative;

}

.utk-menugrid>.nav-item>.nav-link{

    position:relative;

    padding:38px 14px;

    font-size:14px;

    font-weight:700;

    color:#222;

    text-transform:uppercase;

    letter-spacing:.3px;

    transition:.35s;

}


/*=========================================================
MENU UNDERLINE
=========================================================*/

/* Underline */

.utk-menugrid > .nav-item > .nav-link{
    position: relative;
}

.utk-menugrid > .nav-item > .nav-link::before{

    content:"";

    position:absolute;

    left:50%;

    bottom:18px;

    transform:translateX(-50%);

    width:0;

    height:2px;

    background:var(--utk-red);

    transition:.3s ease;

}


.utk-menugrid > .nav-item:hover > .nav-link::before,
.utk-menugrid > .nav-item > .nav-link.active::before{

    width:38px;

}

/* Dropdown menu */

/* .utk-menugrid > .dropdown:hover > .nav-link::after,
.utk-menugrid > .dropdown.show > .nav-link::after{

    width: 40px;

} */

/* .utk-menugrid > .dropdown:hover > .nav-link,
.utk-menugrid > .dropdown.show > .nav-link{

    color: var(--utk-red);

} */


/*=========================================================
DROPDOWN
=========================================================*/
.utk-menugrid .dropdown-menu{

    margin-top:0px;

    border:none;

    border-radius:18px;

    min-width:240px;

    padding:15px 0;

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

}


.utk-menugrid .dropdown-item{

    padding:13px 28px;

    font-size:14px;

    color:#333;
    border-bottom: 1px solid #efefef;

}


.utk-menugrid .dropdown-item:hover{

    background:#f8f8f8;

    color:var(--utk-red);

}


/*=========================================================
DESKTOP HOVER DROPDOWN
=========================================================*/

/*=========================================================
DESKTOP DROPDOWN - HOVER + CLICK
=========================================================*/

@media(min-width:993px){

    .utk-menugrid .dropdown > .dropdown-menu{
        display:none;
        opacity:0;
        visibility:hidden;
        transform:translateY(16px);
        transition:opacity .25s ease, transform .25s ease, visibility .25s ease;
    }

    /* OPEN STATE */
    .utk-menugrid .dropdown.utk-dropdown-open > .dropdown-menu{
        display:block;
        opacity:1;
        visibility:visible;
        transform:translateY(0);
    }

}

@keyframes utkFade{

    from{

        opacity:0;

        transform:translateY(16px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*=========================================================
REMOVE DEFAULT ARROW
=========================================================*/

/* .dropdown-toggle::after{

    display:none;

} */


/*=========================================================
CUSTOM DROPDOWN ICON
=========================================================*/

.utk-menugrid .dropdown-toggle{

    padding-right:24px;

}

/*================================
DROPDOWN ARROW
================================*/

.utk-menugrid .dropdown-toggle::after{

    display:inline-block;

    margin-left:8px;

    vertical-align:middle;

    transition:.3s ease;

}


/* Rotate arrow */

/* .utk-menugrid .dropdown:hover 
.dropdown-toggle::after{

    transform:rotate(180deg);

} */


/*================================
ACTIVE DROPDOWN MENU
================================*/

/* .utk-menugrid .dropdown:hover 
.dropdown-toggle{

    color:var(--utk-red);

} */



/*================================
MENU UNDERLINE
================================*/

.utk-menugrid > .nav-item > .nav-link{

    position:relative;

}


.utk-menugrid > .nav-item > .nav-link:before{

    content:"";

    position:absolute;

    bottom:20px;

    left:50%;

    transform:translateX(-50%);

    width:0;

    height:2px;

    background:var(--utk-red);

    transition:.3s;

}


.utk-menugrid > .nav-item:hover > .nav-link:before,
.utk-menugrid > .nav-item > .nav-link.active:before{

    width:38px;

}


/*=========================================================
QUOTE BUTTON
=========================================================*/

.utk-quotebutton{

    display:inline-flex;

    align-items:center;

    gap:12px;

    padding:16px 26px;

    background:var(--utk-red);

    color:#fff;

    border-radius:8px;

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;

    transition:.35s;

}

.utk-quotebutton:hover{

    background:var(--utk-red-dark);

    color:#fff;

    transform:translateY(-3px);

}

.utk-quotebutton i{

    transition:.35s;

}

.utk-quotebutton:hover i{

    transform:translateX(4px);

}


/*=========================================================
STICKY HEADER
=========================================================*/

/*=========================================================
STICKY HEADER
=========================================================*/

.utk-frame.utk-fixed{

    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:9999;

    animation:utkSticky .35s ease;

}

/* Hide contact strip */

.utk-frame.utk-fixed .utk-contactband{

    display:none;

}

/* Smaller navigation */

.utk-frame.utk-fixed .utk-navigationwrap{

    box-shadow:0 15px 35px rgba(0,0,0,.08);

}

/* Smaller logo */

.utk-frame.utk-fixed .utk-brandmark img{

    height:58px;

    transition:.35s;

}

/* Reduce menu height */

.utk-frame.utk-fixed .utk-menugrid>.nav-item>.nav-link{

    padding:24px 14px;

}

.utk-frame.utk-fixed .utk-quotebutton{

    padding:13px 22px;

}

@keyframes utkSticky{

    from{

        transform:translateY(-100%);

    }

    to{

        transform:translateY(0);

    }

}
@keyframes utkSticky{

    from{

        transform:translateY(-100%);

    }

    to{

        transform:translateY(0);

    }

}

/*=========================================================
MOBILE TOGGLER
=========================================================*/

.utk-navswitch{

    width:56px;
    height:56px;

    border:0;

    background:var(--utk-red);

    border-radius:16px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    gap:6px;

    cursor:pointer;

    transition:.35s;

    box-shadow:0 12px 30px rgba(126,31,40,.25);

}

.utk-navswitch span{

    width:24px;
    height:2px;

    background:#fff;

    border-radius:30px;

    transition:.35s;

}

.utk-navswitch:hover{

    background:var(--utk-red-dark);

    transform:translateY(-3px);

}


/*=========================================================
HAMBURGER ANIMATION
=========================================================*/

.utk-navswitch.utk-open span:nth-child(1){

    transform:
    translateY(8px)
    rotate(45deg);

}

.utk-navswitch.utk-open span:nth-child(2){

    opacity:0;

}

.utk-navswitch.utk-open span:nth-child(3){

    transform:
    translateY(-8px)
    rotate(-45deg);

}


/*=========================================================
TOP OFFCANVAS
=========================================================*/

.utk-slidepanel{

    min-height:100vh;

    border:0;

    background:#fff;

}

.utk-slidepanel .offcanvas-header{

    padding:24px 30px;

    border-bottom:1px solid #ececec;

}

.utk-mobilelogo{

    height:60px;

    width:auto;

}

.utk-slidepanel .btn-close{

    box-shadow:none;

    opacity:1;

}

.utk-slidepanel .offcanvas-body{

    padding:30px;

    overflow-y:auto;

}


/*=========================================================
MENU MOVED FROM DESKTOP
=========================================================*/

#mobileMenuHolder .navbar-nav{

    width:100%;

}

#mobileMenuHolder .nav-item{

    border-bottom:1px solid #efefef;

}

#mobileMenuHolder .nav-link{

    padding:18px 0;

    color:#222;

    font-size:17px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.3px;

}

#mobileMenuHolder .nav-link:hover{

    color:var(--utk-red);

}


/*=========================================================
MOBILE DROPDOWN
=========================================================*/

#mobileMenuHolder .dropdown-menu{

    position:static !important;

    transform:none !important;

    float:none;

    width:100%;

    border:0;

    box-shadow:none;

    margin:0;

    padding:8px 0 12px;

    border-radius:0;

    background:#fafafa;

}

#mobileMenuHolder .dropdown-item{

    padding:12px 18px;

    font-size:15px;

    font-weight:600;

}

#mobileMenuHolder .dropdown-item:hover{

    color:var(--utk-red);

    background:#fff;

}


/*=========================================================
REMOVE DESKTOP ARROW
=========================================================*/

#mobileMenuHolder .dropdown-toggle::before{

    right:0;

}


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

@media(max-width:993px){

    .utk-contactband{

        display:none;

    }

    /* .utk-brandmark img{

        height:58px;

    } */

    .utk-navigationwrap{

        padding:0px 0;

    }

}


@media(max-width:991.98px){

    /* .utk-brandmark img{

        height:52px;

    } */

}


@media(max-width:767.98px){

    .utk-slidepanel .offcanvas-header{

        padding:20px;

    }

    .utk-slidepanel .offcanvas-body{

        padding:20px;

    }

    .utk-brandmark img{

        height:82px;

    }

    .utk-navswitch{

        width:50px;
        height:50px;

        border-radius:14px;

    }

    .utk-navswitch span{

        width:22px;

    }

}


@media(max-width:575px){

    .utk-brandmark img{

        height:72px;

    }

    .utk-navswitch{

        width:44px;
        height:44px;

        gap:5px;

    }

    .utk-navswitch span{

        width:20px;

    }

}


/*=========================================================
SMOOTH OFFCANVAS
=========================================================*/

/* .offcanvas.offcanvas-top{

    transform:translateY(-100%);

    transition:transform .15s ease;

}

.offcanvas.offcanvas-top.show{

    transform:translateY(0);

} */


@media(max-width:993px){

#mobileMenuHolder .dropdown-menu.show{

    display:block !important;
    text-align: center;

}

#mobileMenuHolder .dropdown-toggle::after{

    /* float:right; */

    /* margin-top:8px; */

}
.utk-menugrid > .nav-item > .nav-link::before{bottom: 10px;}

}



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

.utk-hero{

    position:relative;

    width:100%;

    overflow:hidden;

    background:#fff;

}


/*=========================================================
HERO SLIDE
=========================================================*/

/*=========================================================
FIXED HERO HEIGHT - PREVENT SLIDER JUMP
=========================================================*/



.utk-hero-slide{

    position:relative;


    min-height:620px;

    width:100%;

    display:flex;

    align-items:center;

    overflow:hidden;

    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            #ffffff 31%,
            #fcfbfa 46%,
            #f8f6f3 67%,
            #f2efeb 100%
        );

}


/*=========================================================
RIGHT IMAGE
=========================================================*/

.utk-hero-visual{

    position:absolute;

    right:0;

    top:0;

    /* width:67%; */

    height:100%;

    z-index:1;

    display:flex;

    align-items:center;

    justify-content:flex-end;

}


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

.utk-hero-visual img, .utk-hero-visual figure{

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center right;

}


/*=========================================================
WHITE FADE OVER IMAGE
=========================================================*/

.utk-hero-visual::before{

    content:"";

    position:absolute;

    left:-2px;

    top:0;

    width:45%;

    height:100%;

    z-index:2;

    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            #ffffff 0%,
            rgba(255,255,255,.98) 12%,
            rgba(255,255,255,.82) 28%,
            rgba(255,255,255,.35) 55%,
            rgba(255,255,255,0) 100%
        );

}


/*=========================================================
BOTTOM IMAGE FADE
=========================================================*/

.utk-hero-visual::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    height:90px;

    z-index:2;

    pointer-events:none;

    background:
        linear-gradient(
            to top,
            rgba(255,255,255,.95),
            rgba(255,255,255,0)
        );

}


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

.utk-hero .container{

    position:relative;

    z-index:5;

}


/*=========================================================
LEFT CONTENT
=========================================================*/

.utk-hero-content{

    width:40%;

    padding:72px 0 82px;

}


/*=========================================================
EYEBROW
=========================================================*/

.utk-hero-eyebrow{

    margin-bottom:13px;

    color:var(--utk-red);

    font-family:"Mulish",sans-serif;

    font-size:13px;

    font-weight:800;

    letter-spacing:3px;

    text-transform:uppercase;

}


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

/*=========================================================
HERO TITLE
=========================================================*/

.utk-hero-title{

    margin:0;

    font-family:"Urbanist",sans-serif;

    font-size:50px;

    line-height:1.1;

    font-weight:700;

    letter-spacing:-1.6px;

    color:#111;

}


.utk-hero-title span{

    color:var(--utk-red);

}


/*=========================================================
DIVIDER
=========================================================*/

.utk-hero-divider{

    width:136px;

    height:2px;

    margin:18px 0;

    background:
        linear-gradient(
            to right,
            var(--utk-red) 0,
            var(--utk-red) 25px,
            #dedede 25px,
            #dedede 100%
        );

}


/*=========================================================
DESCRIPTION
=========================================================*/

.utk-hero-content p{

    /* width:390px; */

    margin:0 0 24px;

    color:#777;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    line-height:1.65;

    font-weight:500;

}


/*=========================================================
BUTTON WRAPPER
=========================================================*/

.utk-hero-buttons{

    display:flex;

    align-items:center;

    gap:9px;
    margin-top: 20px;

}


/*=========================================================
PRIMARY BUTTON
=========================================================*/

.utk-hero-primary{

    min-height:42px;

    padding:0 16px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:14px;

    background:var(--utk-red);

    border:1px solid var(--utk-red);

    border-radius:3px;

    color:#fff;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    font-weight:600;

    text-transform:uppercase;

    transition:.3s ease;

}


.utk-hero-primary:hover{

    color:#fff;

    background:var(--utk-red-dark);

    border-color:var(--utk-red-dark);

    transform:translateY(-2px);

}


.utk-hero-primary i{

    font-size:12px;

}


/*=========================================================
SECONDARY BUTTON
=========================================================*/

.utk-hero-secondary{

    min-height:42px;

    padding:0 15px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    background:rgba(255,255,255,.8);

    border:1px solid var(--utk-red);

    border-radius:3px;

    color:#333;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    font-weight:600;

    text-transform:uppercase;

    transition:.3s ease;

}


.utk-hero-secondary i{

    color:var(--utk-red);

    font-size:11px;

}


.utk-hero-secondary:hover{

    color:#fff;

    background:var(--utk-red);

}


.utk-hero-secondary:hover i{

    color:#fff;

}


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

.utk-hero-prev,
.utk-hero-next{

    width:45px;

    height:45px;

    top:50%;

    bottom:auto;

    transform:translateY(-50%);

    opacity:1;

    z-index:20;

}


/* LEFT ARROW */

.utk-hero-prev{

    left:24px;

}


/* RIGHT ARROW */

.utk-hero-next{

    right:24px;

}


/*=========================================================
ARROW CIRCLE
=========================================================*/

.utk-arrow{

    width:43px;

    height:43px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#fff;

    color:#111;

    box-shadow:0 5px 20px rgba(0,0,0,.10);

    transition:.3s ease;

}


.utk-arrow i{

    font-size:17px;

}


.utk-hero-prev:hover .utk-arrow,
.utk-hero-next:hover .utk-arrow{

    background:var(--utk-red);

    color:#fff;

}


/*=========================================================
INDICATORS
=========================================================*/

.utk-hero-indicators{

    position:absolute;

    left:50%;

    bottom:12px;

    transform:translateX(-50%);

    width:auto;

    margin:0;

    display:flex;

    align-items:center;

    gap:9px;

    z-index:20;

}


.utk-hero-indicators button{

    width:32px;

    height:3px;

    margin:0;

    padding:0;

    border:0;

    border-radius:10px;

    background:#cfcfcf;

    opacity:1;

    transition:.3s ease;

}


.utk-hero-indicators button.active{

    width:40px;

    background:var(--utk-red);

}


/*=========================================================
SLIDE ANIMATION
=========================================================*/

.utk-hero .carousel-item{

    transition:opacity .8s ease-in-out;

}


.utk-hero .carousel-item.active .utk-hero-content{

    animation:utkHeroText .8s ease both;

}


@keyframes utkHeroText{

    from{

        opacity:0;

        transform:translateX(-25px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}



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


/*=========================================================
1200px - 1399px
=========================================================*/

@media (max-width: 1399.98px) {

    .utk-hero-slide {
        min-height: 580px;
    }

    .utk-hero-content {
        width: 45%;
        padding: 65px 0 75px;
    }

    .utk-hero-title {
        font-size: 46px;
    }

    .utk-hero-content p {
        font-size: 14px;
    }

    .utk-hero-visual {
        width: 68%;
    }

}
@media (max-width: 1299.98px) {
 .utk-hero-content {
        width: 55%;}
}

/*=========================================================
992px - 1199px
=========================================================*/

@media (max-width: 1199.98px) {

    .utk-hero-slide {
        min-height: 560px;
    }

    .utk-hero-content {
        width: 45%;
        padding: 60px 0 70px;
    }

    .utk-hero-title {
        font-size: 42px;
        line-height: 1.04;
        letter-spacing: -1px;
    }

    .utk-hero-eyebrow {
        font-size: 11px;
        letter-spacing: 2.5px;
    }

    .utk-hero-content p {
        font-size: 13px;
        line-height: 1.6;
    }

    .utk-hero-visual {
        width: 67%;
    }

    .utk-hero-visual::before {
        width: 48%;
    }

    .utk-hero-prev {
        left: 15px;
    }

    .utk-hero-next {
        right: 15px;
    }

}
@media (max-width: 1103.98px) {

.utk-hero-primary, .utk-hero-secondary{font-size: 11px;}
}

/*=========================================================
TABLET
768px - 991px
=========================================================*/

@media (max-width: 991.98px) {

    .utk-hero-slide {

        min-height: 700px;

        display: block;

        background:
            linear-gradient(
                to bottom,
                #ffffff 0%,
                #ffffff 46%,
                #faf9f7 65%,
                #f4f1ed 100%
            );

    }


    /*-----------------------------------------------------
    CONTENT
    -----------------------------------------------------*/

    .utk-hero-content {

        width: 100%;

        max-width: 650px;

        margin: 0 auto;

        padding: 55px 25px 20px;

        text-align: center;

    }


    .utk-hero-eyebrow {

        font-size: 10px;

        letter-spacing: 2.5px;

        margin-bottom: 12px;

    }


    .utk-hero-title {

        font-size: 42px;

        line-height: 1.05;

        letter-spacing: -1px;

    }


    .utk-hero-divider {

        margin: 18px auto;

    }


    .utk-hero-content p {

        width: 100%;

        max-width: 550px;

        margin: 0 auto 23px;

        font-size: 13px;

        line-height: 1.65;

    }


    /*-----------------------------------------------------
    BUTTONS
    -----------------------------------------------------*/

    .utk-hero-buttons {

        justify-content: center;

        flex-wrap:wrap;

    }


    /*-----------------------------------------------------
    IMAGE
    -----------------------------------------------------*/

    .utk-hero-visual {

        position: absolute;

        top: auto;

        right: 0;

        bottom: 0;

        width: 100%;

        height: 52%;

        display: flex;

        align-items: flex-end;

        justify-content: center;

    }


    .utk-hero-visual img {

        width: 100%;

        height: 100%;

        object-fit: cover;

        object-position: center bottom;

    }


    /*-----------------------------------------------------
    IMAGE TOP FADE
    -----------------------------------------------------*/

    .utk-hero-visual::before {

        left: 0;

        top: 0;

        width: 100%;

        height: 45%;

        background:
            linear-gradient(
                to bottom,
                #ffffff 0%,
                rgba(255,255,255,.95) 20%,
                rgba(255,255,255,.65) 50%,
                rgba(255,255,255,0) 100%
            );

    }


    .utk-hero-visual::after {

        height: 70px;

    }


    /*-----------------------------------------------------
    ARROWS
    -----------------------------------------------------*/

    .utk-hero-prev,
    .utk-hero-next {

        width: 40px;

        height: 40px;

    }


    .utk-arrow {

        width: 38px;

        height: 38px;

    }


    .utk-arrow i {

        font-size: 14px;

    }


    .utk-hero-prev {

        left: 12px;

    }


    .utk-hero-next {

        right: 12px;

    }


    /*-----------------------------------------------------
    INDICATORS
    -----------------------------------------------------*/

    .utk-hero-indicators {

        bottom: 10px;

    }

}


/*=========================================================
MOBILE
576px - 767px
=========================================================*/

@media (max-width: 767.98px) {

    .utk-hero-slide {

        min-height: 650px;

    }


    /*-----------------------------------------------------
    CONTENT
    -----------------------------------------------------*/

    .utk-hero-content {

        padding:

            38px

            18px

            15px;

    }


    .utk-hero-eyebrow {

        font-size: 8px;

        letter-spacing: 2px;

        line-height: 1.5;

    }


    .utk-hero-title {

        font-size: 35px;

        line-height: 1.06;

        letter-spacing: -.7px;

    }


    /* .utk-hero-divider {

        width: 110px;

        margin: 15px auto;

    } */


    .utk-hero-content p {

        max-width: 470px;

        font-size: 12px;

        line-height: 1.6;

        margin-bottom: 20px;

    }


    /*-----------------------------------------------------
    BUTTONS
    -----------------------------------------------------*/

    .utk-hero-buttons {

        gap: 7px;

    }


    .utk-hero-primary,
    .utk-hero-secondary {

        min-height: 40px;

        padding: 0 13px;

        font-size: 12px;

    }


    /*-----------------------------------------------------
    IMAGE
    -----------------------------------------------------*/

    .utk-hero-visual {

        height: 47%;

    }


    .utk-hero-visual img, .utk-hero-visual figure {

        object-position: center bottom;

    }


    /*-----------------------------------------------------
    ARROWS
    -----------------------------------------------------*/

    .utk-hero-prev,
    .utk-hero-next {

        width: 36px;

        height: 36px;

    }


    .utk-arrow {

        width: 34px;

        height: 34px;

    }


    .utk-arrow i {

        font-size: 12px;

    }


    .utk-hero-prev {

        left: 8px;

    }


    .utk-hero-next {

        right: 8px;

    }


    /*-----------------------------------------------------
    INDICATORS
    -----------------------------------------------------*/

    .utk-hero-indicators {

        bottom: 7px;

        gap: 6px;

    }


    .utk-hero-indicators button {

        width: 22px;

        height: 2px;

    }


    .utk-hero-indicators button.active {

        width: 30px;

    }

}


/*=========================================================
SMALL MOBILE
UP TO 575px
=========================================================*/

@media (max-width: 575.98px) {

    .utk-hero-slide {

        min-height: 590px;

    }


    .utk-hero-content {

        padding:

            30px

            15px

            10px;

    }


    .utk-hero-eyebrow {

        font-size: 10px;

        letter-spacing: 1.7px;

    }


    .utk-hero-title {

        font-size: 30px;

        line-height: 1.07;

        letter-spacing: -.5px;

    }


    .utk-hero-content p {

        font-size: 11px;

        max-width: 340px;

        line-height: 1.55;

    }


    /*-----------------------------------------------------
    BUTTONS STACK
    -----------------------------------------------------*/

    .utk-hero-buttons {

        flex-direction: column;

        align-items: center;

        width: 100%;

    }


    .utk-hero-primary,
    .utk-hero-secondary {

        width: 220px;

        min-height: 40px;

    }


    /*-----------------------------------------------------
    IMAGE
    -----------------------------------------------------*/

    .utk-hero-visual {

        height: 43%;

    }


    .utk-hero-visual::before {

        height: 48%;

    }


    /*-----------------------------------------------------
    ARROWS
    -----------------------------------------------------*/

    .utk-hero-prev {

        left: 5px;

    }


    .utk-hero-next {

        right: 5px;

    }


    .utk-arrow {

        width: 32px;

        height: 32px;

    }


    .utk-arrow i {

        font-size: 11px;

    }

}


/*=========================================================
WHO WE ARE SECTION
=========================================================*/

.utk-who-section{

    position:relative;

    padding:115px 0 125px;

    background:#fff;
    overflow:clip;

}


/*=========================================================
IMAGE WRAPPER
=========================================================*/

.utk-who-image-wrap{

    position:relative;

    width:100%;

    padding-right:35px;

    padding-bottom:30px;

    opacity:0;

    transform:translateX(-45px);

    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.22,.61,.36,1);

}


/*=========================================================
MAIN IMAGE
=========================================================*/

.utk-who-image{

    display:block;

    width:100%;

    height:510px;

    object-fit:cover;

    object-position:center;

    border-radius:14px;

    box-shadow:
        0 20px 50px rgba(0,0,0,.10);

}


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

.utk-who-experience{

    position:absolute;

    left:-18px;

    bottom:0;

    min-width:170px;

    padding:22px 25px;

    display:flex;

    align-items:center;

    gap:15px;

    background:#fff;

    border:1px solid #ededed;

    border-radius:9px;

    box-shadow:
        0 12px 35px rgba(0,0,0,.10);

    opacity:0;

    transform:translateY(25px) scale(.92);

    transition:
        opacity .7s ease,
        transform .7s cubic-bezier(.22,.61,.36,1);

    transition-delay:.7s;

}


.utk-who-experience strong{

    font-family:"Urbanist",sans-serif;

    font-size:52px;

    line-height:1;

    font-weight:700;

    color:var(--utk-red);

}


.utk-who-experience span{

    color:#555;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    line-height:1.5;

    font-weight:600;

}


/*=========================================================
RIGHT CONTENT
=========================================================*/

.utk-who-content{

    /* padding-left:40px; */

    opacity:0;

    transform:translateX(45px);

    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.22,.61,.36,1);

    transition-delay:.15s;

}


/*=========================================================
EYEBROW
=========================================================*/

.utk-section-eyebrow{

    margin-bottom:16px;

    color:var(--utk-red);

    font-family:"Mulish",sans-serif;

    font-size:13px;

    font-weight:800;

    letter-spacing:3px;

    line-height:1.4;

    text-transform:uppercase;

    opacity:0;

    transform:translateY(20px);

    transition:
        opacity .7s ease,
        transform .7s ease;

    transition-delay:.25s;

}


/*=========================================================
TITLE
=========================================================*/


.utk-who-title{

    margin:0;

    font-family:"Urbanist",sans-serif;

    font-size:50px;

    line-height:1.08;

    letter-spacing:-1.3px;

    font-weight:700;

    color:#111;

    opacity:0;

    transform:translateY(25px);

    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22,.61,.36,1);

    transition-delay:.35s;

}


.utk-who-title span{

    display:block;

    color:#111;

}


/*=========================================================
DIVIDER
=========================================================*/

.utk-who-divider{

    width:0;

    height:2px;

    margin:22px 0 27px;

    background:
        linear-gradient(
            to right,
            var(--utk-red) 0 35px,
            #dedede 35px 100%
        );

    transition:
        width .8s cubic-bezier(.22,.61,.36,1);

    transition-delay:.55s;

}


/*=========================================================
DESCRIPTION
=========================================================*/

.utk-who-description{

    max-width:600px;

    margin:0 0 20px;

    color:#666;

    font-family:"Mulish",sans-serif;

    font-size:16px;

    line-height:1.8;

    font-weight:500;

    opacity:0;

    transform:translateY(20px);

    transition:
        opacity .7s ease,
        transform .7s ease;

}


.utk-who-description:nth-of-type(1){

    transition-delay:.55s;

}


.utk-who-description:nth-of-type(2){

    transition-delay:.70s;

}


/*=========================================================
FEATURE GRID
=========================================================*/

.utk-who-features{

    margin-top:34px;

}


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

.utk-who-feature{

    min-height:108px;
    height: 100%;

    padding:10px;

    display:flex;

    align-items:center;

    gap:17px;

    background:#fff;

    border:1px solid #e7e7e7;

    border-radius:10px;

    opacity:0;

    transform:translateY(30px);

    transition:
        opacity .6s ease,
        transform .6s cubic-bezier(.22,.61,.36,1),
        box-shadow .3s ease,
        border-color .3s ease;

}


/*=========================================================
FEATURE HOVER
=========================================================*/

.utk-who-feature:hover{

    transform:translateY(-4px);

    border-color:#e0c6ca;

    box-shadow:
        0 12px 30px rgba(0,0,0,.07);

}


/*=========================================================
FEATURE ICON
=========================================================*/

.utk-who-feature-icon{

    flex:0 0 50px;

    width:50px;

    height:50px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid rgba(139,0,0,.22);

    border-radius:50%;

    color:var(--utk-red);

    background:#fff8f8;

    transition:
        transform .4s ease,
        background .3s ease,
        color .3s ease;

}


.utk-who-feature-icon i{

    font-size:21px;

}


/*=========================================================
FEATURE ICON HOVER
=========================================================*/

.utk-who-feature:hover .utk-who-feature-icon{

    transform:rotate(8deg) scale(1.08);

}


/*=========================================================
FEATURE TITLE
=========================================================*/

.utk-who-feature-title{

    margin-bottom:5px;

    color:#222;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    line-height:1.3;

    font-weight:800;

}


/*=========================================================
FEATURE TEXT
=========================================================*/

.utk-who-feature-text{

    color:#777;

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.55;

    font-weight:500;

}


/*=========================================================
SCROLL ACTIVE STATE
=========================================================*/

.utk-who-section.utk-scroll-active
.utk-who-image-wrap{

    opacity:1;

    transform:translateX(0);

}


.utk-who-section.utk-scroll-active
.utk-who-content{

    opacity:1;

    transform:translateX(0);

}


.utk-who-section.utk-scroll-active
.utk-who-experience{

    opacity:1;

    transform:translateY(0) scale(1);

}


.utk-who-section.utk-scroll-active
.utk-section-eyebrow{

    opacity:1;

    transform:translateY(0);

}


.utk-who-section.utk-scroll-active
.utk-who-title{

    opacity:1;

    transform:translateY(0);

}


.utk-who-section.utk-scroll-active
.utk-who-divider{

    width:150px;

}


.utk-who-section.utk-scroll-active
.utk-who-description{

    opacity:1;

    transform:translateY(0);

}


/*=========================================================
FEATURE CARD STAGGER
=========================================================*/

.utk-who-section.utk-scroll-active
.utk-who-feature:nth-child(1){

    opacity:1;

    transform:translateY(0);

    transition-delay:.65s;

}


.utk-who-section.utk-scroll-active
.utk-who-feature:nth-child(2){

    opacity:1;

    transform:translateY(0);

    transition-delay:.80s;

}


.utk-who-section.utk-scroll-active
.utk-who-feature:nth-child(3){

    opacity:1;

    transform:translateY(0);

    transition-delay:.95s;

}


.utk-who-section.utk-scroll-active
.utk-who-feature:nth-child(4){

    opacity:1;

    transform:translateY(0);

    transition-delay:1.10s;

}


/*=========================================================
1199px
=========================================================*/

@media (min-width:1200px){

    .utk-who-image-wrap{
        max-width:100%;
    }

}

@media(max-width:1199.98px){

    .utk-who-section{

        padding:95px 0 105px;

    }


    .utk-who-image{

        height:470px;

    }


    .utk-who-content{

        padding-left:20px;

    }


    .utk-who-title{

        font-size:44px;

    }


    .utk-who-description{

        font-size:15px;

        line-height:1.8;

    }


    .utk-who-feature{

        min-height:100px;

        padding:17px;

    }


    .utk-who-feature-icon{

        flex:0 0 46px;

        width:46px;

        height:46px;

    }


    .utk-who-feature-title{

        font-size:14px;

    }


    .utk-who-feature-text{

        font-size:13px;

    }

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991.98px){

    .utk-who-section{

        padding:40px 0 40px;

    }


    .utk-who-image-wrap{

        padding-right:0px;

        padding-bottom:30px;
        margin-top: 30px;

    }


    .utk-who-image{

        height:500px;
        margin-left: auto;
        margin-right: auto;

    }


    .utk-who-content{

        padding-left:0;

        padding-top:35px;

    }


    .utk-section-eyebrow{

        font-size:12px;

        letter-spacing:2.7px;

    }


    .utk-who-title{

        font-size:44px;

        line-height:1.08;

    }


    .utk-who-divider{

        margin:20px auto 25px;
        background:
        linear-gradient(
            to right,
            #dedede 0px 40%,
            var(--utk-red) 40% 60%,
            #dedede 60% 100%
        );

    }


    .utk-who-description{

        max-width:100%;

        font-size:15px;

        line-height:1.8;

    }


    .utk-who-features{

        margin-top:30px;

    }


    .utk-who-feature{

        min-height:100px;

        padding:18px;

    }


    .utk-who-feature-icon{

        flex:0 0 48px;

        width:48px;

        height:48px;

    }


    .utk-who-feature-title{

        font-size:13px;

    }


    .utk-who-feature-text{

        font-size:11.5px;

    }

}


/*=========================================================
MOBILE TABLET
=========================================================*/

@media(max-width:767.98px){

    .utk-who-section{

        padding:70px 0 80px;

    }


    .utk-who-image-wrap{

        padding-right:15px;

        padding-bottom:27px;

    }


    .utk-who-image{

        height:410px;

        border-radius:12px;

    }


    .utk-who-experience{

        left:0;

        min-width:155px;

        padding:18px 20px;

        gap:13px;

    }


    .utk-who-experience strong{

        font-size:34px;

    }


    .utk-who-experience span{

        font-size:13px;

    }


    .utk-who-content{

        padding-top:35px;

    }


    .utk-section-eyebrow{

        font-size:11px;

        letter-spacing:2.5px;

        margin-bottom:13px;

    }


    .utk-who-title{

        font-size:38px;

        line-height:1.08;

        letter-spacing:-.8px;

    }


    /* .utk-who-divider{

        width:0;

        margin:18px 0 23px;

    } */


    .utk-who-description{

        font-size:14px;

        line-height:1.8;

        margin-bottom:18px;

    }


    .utk-who-features{

        margin-top:27px;

    }


    .utk-who-feature{

        min-height:95px;

        padding:16px;

        gap:14px;

    }


    .utk-who-feature-icon{

        flex:0 0 44px;

        width:44px;

        height:44px;

    }


    .utk-who-feature-icon i{

        font-size:18px;

    }


    .utk-who-feature-title{

        font-size:15px;

    }


    .utk-who-feature-text{

        font-size:13px;

        line-height:1.5;

    }


    /* MOBILE SCROLL ANIMATION */

    .utk-who-section .utk-who-image-wrap{

        transform:translateY(35px);

    }


    .utk-who-section .utk-who-content{

        transform:translateY(35px);

    }


    .utk-who-section.utk-scroll-active
    .utk-who-image-wrap,

    .utk-who-section.utk-scroll-active
    .utk-who-content{

        transform:translateY(0);

    }

}


/*=========================================================
SMALL MOBILE
=========================================================*/

@media(max-width:575.98px){

    .utk-who-section{

        padding:55px 0 65px;

    }


    .utk-who-image-wrap{

        padding-right:8px;

        padding-bottom:25px;

    }


    .utk-who-image{

        height:330px;

        border-radius:10px;

    }


    .utk-who-experience{

        left:0;

        bottom:0;

        min-width:145px;

        padding:15px 17px;

        gap:11px;

    }


    .utk-who-experience strong{

        font-size:30px;

    }


    .utk-who-experience span{

        font-size:13px;

        line-height:1.4;

    }


    .utk-who-content{

        padding-top:30px;

    }


    .utk-section-eyebrow{

        font-size:9px;

        letter-spacing:2px;

        margin-bottom:11px;

    }


    .utk-who-title{

        font-size:32px;

        line-height:1.08;

        letter-spacing:-.6px;

    }


    .utk-who-divider{

        width:0;

        height:2px;
/* 
        margin:16px 0 21px; */

    }


    .utk-who-description{

        font-size:14px;

        line-height:1.75;

        margin-bottom:17px;

    }


    .utk-who-features{

        margin-top:24px;

    }


    .utk-who-feature{

        min-height:88px;

        padding:14px;

        gap:12px;

    }


    .utk-who-feature-icon{

        flex:0 0 42px;

        width:42px;

        height:42px;

    }


    .utk-who-feature-icon i{

        font-size:17px;

    }


    .utk-who-feature-title{

        font-size:14px;

        margin-bottom:4px;

    }


    .utk-who-feature-text{

        font-size:12px;

        line-height:1.45;

    }

}


/*=========================================================
REDUCED MOTION
=========================================================*/

@media(prefers-reduced-motion:reduce){

    .utk-who-section *{

        transition:none !important;

        animation:none !important;

        transform:none !important;

    }

    .utk-who-image-wrap,
    .utk-who-content,
    .utk-who-experience,
    .utk-section-eyebrow,
    .utk-who-title,
    .utk-who-description,
    .utk-who-feature{

        opacity:1 !important;

    }

}


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

.utk-products-section{

    position:relative;

    width:100%;

    padding:90px 0 100px;

    background:#fff;

    overflow:hidden;

}


/*=========================================================
LEFT INTRO
=========================================================*/

.utk-products-intro{

    padding-right:25px;

}


.utk-products-eyebrow{

    margin-bottom:15px;

    color:var(--utk-red);

    font-family:"Mulish",sans-serif;

    font-size:12px;

    line-height:1.4;

    font-weight:800;

    letter-spacing:2.8px;

    text-transform:uppercase;

}


.utk-products-title{

    margin:0;

    color:#111;

    font-family:"Urbanist",sans-serif;

    font-size:37px;

    line-height:1.06;

    letter-spacing:-1.1px;

    font-weight:700;

}


.utk-products-title span{

    display:block;

}


.utk-products-description{

    max-width:300px;

    margin:20px 0 0;

    color:#777;

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.75;

    font-weight:500;

}


/*=========================================================
CONTROLS
=========================================================*/

.utk-products-controls{

    display:flex;

    align-items:center;

    gap:10px;

    margin-top:28px;

}


.utk-products-arrow{

    width:43px;

    height:43px;

    padding:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid var(--utk-red);

    border-radius:50%;

    background:#fff;

    color:var(--utk-red);

    font-size:15px;

    cursor:pointer;

    transition:

        background .3s ease,

        color .3s ease,

        transform .3s ease,

        box-shadow .3s ease;

}


.utk-products-arrow:hover{

    background:var(--utk-red);

    color:#fff;

    transform:translateY(-2px);

    box-shadow:

        0 8px 20px rgba(139,0,0,.18);

}


.utk-products-arrow:active{

    transform:scale(.92);

}


/*=========================================================
OWL CAROUSEL
=========================================================*/

.utk-products-carousel{

    width:100%;

}


.utk-products-carousel .owl-stage{

    display:flex;

    align-items:stretch;

}


.utk-products-carousel .owl-item{

    display:flex;

}


.utk-products-carousel .owl-item .utk-product-card{

    width:100%;

}


/*=========================================================
REMOVE OWL DEFAULT MARGIN
=========================================================*/

.utk-products-carousel .owl-stage-outer{

    padding:7px 5px 18px;

    margin:-7px -5px -18px;

}


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

.utk-product-card{

    position:relative;

    width:100%;

    overflow:hidden;

    background:#fff;

    border:1px solid #e8e8e8;

    border-radius:10px;

    box-shadow:

        0 5px 20px rgba(0,0,0,.035);

    transition:

        transform .35s ease,

        box-shadow .35s ease,

        border-color .35s ease;

}


/*=========================================================
RED TOP LINE
=========================================================*/

.utk-product-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:0;

    height:3px;

    z-index:5;

    background:var(--utk-red);

    transition:

        width .4s ease;

}


.utk-product-card:hover::before{

    width:100%;

}


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

.utk-product-card:hover{

    transform:translateY(-7px);

    border-color:#d9bdc1;

    box-shadow:

        0 18px 38px rgba(0,0,0,.10);

}


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

.utk-product-image{

    position:relative;

    width:100%;

    /* height:175px; */

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:hidden;

    background:

        radial-gradient(

            circle at center,

            #fff 0%,

            #fafafa 55%,

            #f3f3f3 100%

        );

    border-bottom:1px solid #eeeeee;

}


.utk-product-image img{

    display:block;

    width:100%;

    height:100%;

    /* padding:12px; */

    object-fit:contain;

    transition:

        transform .5s cubic-bezier(.22,.61,.36,1);

}


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

    transform:scale(1.08);

}


/*=========================================================
IMAGE SHINE
=========================================================*/

.utk-product-image::after{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:55%;

    height:100%;

    pointer-events:none;

    background:

        linear-gradient(

            90deg,

            transparent,

            rgba(255,255,255,.55),

            transparent

        );

    transform:skewX(-20deg);

    transition:left .7s ease;

}


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

    left:140%;

}


/*=========================================================
PRODUCT BODY
=========================================================*/

.utk-product-body{

    padding:18px 15px 17px;

    background:#fff;
    position:relative;

}


.utk-product-body h3{

    margin:0;
    padding-right:45px;

    color:#202020;

    font-family:"Urbanist",sans-serif;

    font-size:16px;

    line-height:1.3;

    font-weight:700;

}


/*=========================================================
PRODUCT LINK
=========================================================*/

/*=========================================================
PRODUCT ARROW LINK
=========================================================*/

.utk-product-link{

    position:absolute;

    right:15px;

    top:50%;

    transform:translateY(-50%);

    width:34px;

    height:34px;

    margin:0;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid var(--utk-red);

    border-radius:50%;

    background:#fff;

    color:var(--utk-red);

    font-size:13px;

    line-height:1;

    text-decoration:none;

    transition:

        background .3s ease,

        color .3s ease,

        transform .3s ease,

        box-shadow .3s ease;

}


.utk-product-link i{

    font-size:13px;

}


/*=========================================================
HOVER
=========================================================*/

.utk-product-link:hover{

    background:var(--utk-red);

    color:#fff;

    transform:translateY(-50%) translateX(3px);

    box-shadow:

        0 5px 15px rgba(139,0,0,.18);

}


/*=========================================================
1199px
=========================================================*/

@media(max-width:1399.98px){

.utk-products-title span{

    display:inline;

}
}
@media(max-width:1199.98px){

    .utk-products-section{

        padding:85px 0 95px;

    }


    .utk-products-title{

        font-size:36px;

    }


    .utk-product-image{

        height:170px;

    }

}


/*=========================================================
991px
=========================================================*/

@media(max-width:991.98px){

    .utk-products-section{

        padding:75px 0 85px;

    }


    .utk-products-intro{

        padding-right:0;

        margin-bottom:15px;

    }


    .utk-products-title{

        font-size:38px;

    }


    .utk-products-description{

        max-width:80%;
        margin-left: auto; margin-right: auto;

    }


    .utk-products-controls{

        margin-top:22px;

        margin-bottom:10px;
        justify-content: center;

    }


    .utk-product-image{

        height:auto;

    }

}


/*=========================================================
767px
=========================================================*/

@media(max-width:767.98px){

    .utk-products-section{

        padding:65px 0 75px;

    }


    .utk-products-eyebrow{

        font-size:11px;

        letter-spacing:2.5px;

    }


    .utk-products-title{

        font-size:35px;

        line-height:1.08;

    }


    .utk-products-description{

        font-size:13px;

        line-height:1.7;

    }


    .utk-products-controls{

        margin-top:22px;

        margin-bottom:18px;

    }


    .utk-products-arrow{

        width:41px;

        height:41px;

    }


    /* .utk-product-image{

        height:180px;

    } */


    .utk-product-body{

        padding:17px 14px 16px;

    }


    .utk-product-body h3{

        font-size:15px;

    }


    .utk-product-link{

        font-size:9px;

    }

}


/*=========================================================
575px
=========================================================*/

@media(max-width:575.98px){

    .utk-products-section{

        padding:55px 0 65px;

    }


    .utk-products-eyebrow{

        font-size:10px;

        letter-spacing:2.2px;

    }


    .utk-products-title{

        font-size:32px;

        letter-spacing:-.7px;

    }


    .utk-products-description{

        font-size:13px;

        line-height:1.7;

    }


    .utk-products-controls{

        margin-top:20px;

        margin-bottom:18px;

    }


    .utk-products-arrow{

        width:40px;

        height:40px;

    }


    /* .utk-product-image{

        height:195px;

    } */


    .utk-product-body{

        padding:17px 14px 16px;

    }


    .utk-product-body h3{

        font-size:16px;

    }

}


/*=========================================================
EXTRA SMALL
=========================================================*/

@media(max-width:380px){

    .utk-products-title{

        font-size:29px;

    }


    .utk-product-image{

        height:180px;

    }

}


/*=========================================================
TOUCH DEVICES
=========================================================*/

@media(hover:none){

    .utk-product-card:hover{

        transform:none;

        box-shadow:

            0 5px 20px rgba(0,0,0,.035);

    }


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

        transform:none;

    }


    .utk-product-card:hover::before{

        width:0;

    }

}


/*=========================================================
REDUCED MOTION
=========================================================*/

@media(prefers-reduced-motion:reduce){

    .utk-products-section *{

        transition:none !important;

        animation:none !important;

    }

}



/*=========================================================
WHY CHOOSE US SECTION
=========================================================*/

.utk-why-section{

    position:relative;

    padding:115px 0 120px;

    background:#071426;

    overflow:hidden;

}


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

.utk-why-section::before{

    content:"";

    position:absolute;

    top:-180px;

    right:-180px;

    width:500px;

    height:500px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(139,0,0,.18) 0%,
            rgba(139,0,0,.06) 40%,
            transparent 70%
        );

    pointer-events:none;

}


.utk-why-section::after{

    content:"";

    position:absolute;

    bottom:-220px;

    left:-180px;

    width:450px;

    height:450px;

    border-radius:50%;

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

    pointer-events:none;

}


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

.utk-why-header{

    position:relative;

    z-index:2;

    margin-bottom:55px;

}


/*=========================================================
EYEBROW
=========================================================*/

.utk-why-eyebrow{

    margin-bottom:16px;

    color:#d88b91;

    font-family:"Mulish",sans-serif;

    font-size:13px;

    font-weight:800;

    letter-spacing:3px;

    text-transform:uppercase;

}


/*=========================================================
TITLE
=========================================================*/

.utk-why-title{

    margin:0;

    max-width:620px;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:52px;

    line-height:1.05;

    font-weight:700;

    letter-spacing:-1.5px;

}


.utk-why-title span{

    display:block;

    color:#fff;

}


/*=========================================================
INTRO
=========================================================*/

.utk-why-intro{

    max-width:520px;

    margin:0;

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

    font-family:"Mulish",sans-serif;

    font-size:17px;

    line-height:1.8;

    font-weight:500;

}


/*=========================================================
FEATURE GRID
=========================================================*/

.utk-why-grid{

    position:relative;

    z-index:2;

}


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

.utk-why-card{

    position:relative;

    height:100%;

    min-height:245px;

    padding:35px 34px 32px;

    display:flex;

    flex-direction:column;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.075),
            rgba(255,255,255,.035)
        );

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

    border-radius:14px;

    overflow:hidden;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        background .35s ease;

}


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

.utk-why-card:hover{

    transform:translateY(-8px);

    border-color:rgba(190,55,65,.55);

    background:
        linear-gradient(
            145deg,
            rgba(139,0,0,.18),
            rgba(255,255,255,.055)
        );

    box-shadow:
        0 25px 55px rgba(0,0,0,.25);

}


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

.utk-why-icon{

    width:58px;

    height:58px;

    margin-bottom:28px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid rgba(210,75,85,.45);

    border-radius:12px;

    background:rgba(139,0,0,.12);

    color:#df737a;

    transition:.35s ease;

}


.utk-why-icon i{

    font-size:25px;

}


.utk-why-card:hover .utk-why-icon{

    background:var(--utk-red);

    border-color:var(--utk-red);

    color:#fff;

    transform:scale(1.05);

}


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

.utk-why-card-content{

    position:relative;

    z-index:2;

}


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

.utk-why-card-title{

    margin-bottom:11px;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:22px;

    line-height:1.2;

    font-weight:700;

}


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

.utk-why-card p{

    max-width:390px;

    margin:0;

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

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.7;

    font-weight:500;

}


/*=========================================================
BOTTOM RED LINE
=========================================================*/

.utk-why-card-line{

    position:absolute;

    left:34px;

    bottom:0;

    width:45px;

    height:3px;

    background:var(--utk-red);

    transition:.35s ease;

}


.utk-why-card:hover .utk-why-card-line{

    width:100px;

}


/*=========================================================
BOTTOM HIGHLIGHT
=========================================================*/

.utk-why-bottom{

    position:relative;

    z-index:2;

    margin-top:55px;

    padding:25px 30px;

    display:flex;

    align-items:center;

    gap:20px;

    background:
        linear-gradient(
            90deg,
            rgba(139,0,0,.85),
            rgba(139,0,0,.55)
        );

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

    border-radius:12px;

}


/*=========================================================
BOTTOM ICON
=========================================================*/

.utk-why-bottom-icon{

    width:52px;

    height:52px;

    flex:0 0 52px;

    display:flex;

    align-items:center;

    justify-content:center;

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

    border-radius:50%;

    color:#fff;

}


.utk-why-bottom-icon i{

    font-size:22px;

}


/*=========================================================
BOTTOM TITLE
=========================================================*/

.utk-why-bottom-title{

    margin-bottom:3px;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:20px;

    font-weight:700;

}


/*=========================================================
BOTTOM TEXT
=========================================================*/

.utk-why-bottom-text{

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

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.5;

}


/*=========================================================
WHY CHOOSE US - VISIBILITY & ANIMATION
=========================================================*/

.utk-why-header,
.utk-why-card,
.utk-why-bottom {
    opacity: 1;
    transform: translateY(0);
    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22,1,.36,1);
}

.utk-why-header.utk-scroll-show,
.utk-why-card.utk-scroll-show,
.utk-why-bottom.utk-scroll-show,
.utk-why-header.utk-visible,
.utk-why-card.utk-visible {
    opacity: 1;
    transform: translateY(0);
}


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

.utk-why-card:nth-child(1){

    transition-delay:.05s;

}

.utk-why-card:nth-child(2){

    transition-delay:.12s;

}

.utk-why-card:nth-child(3){

    transition-delay:.19s;

}

.utk-why-card:nth-child(4){

    transition-delay:.26s;

}

.utk-why-card:nth-child(5){

    transition-delay:.33s;

}

.utk-why-card:nth-child(6){

    transition-delay:.40s;

}


/*=========================================================
ICON VISIBILITY
=========================================================*/

.utk-why-card .utk-why-icon {
    opacity: 1;
    transform: scale(1);
    transition:
        opacity .6s ease,
        transform .6s cubic-bezier(.22,1,.36,1);
}

.utk-why-card.utk-scroll-show .utk-why-icon,
.utk-why-card.utk-visible .utk-why-icon {
    opacity: 1;
    transform: scale(1);
}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:1199.98px){

    .utk-why-section{

        padding:95px 0 100px;

    }

    .utk-why-title{

        font-size:45px;

    }

    .utk-why-intro{

        font-size:15px;

    }

    .utk-why-card{

        min-height:230px;

        padding:30px;

    }

}


/*=========================================================
TABLET / SMALL LAPTOP
=========================================================*/

@media(max-width:991.98px){

    .utk-why-section{

        padding:85px 0 90px;

    }

    .utk-why-header{

        margin-bottom:40px;

    }

    .utk-why-title{

        font-size:42px;

        margin-bottom:25px;
        margin-left: auto; margin-right: auto; max-width: 100%;

    }

    .utk-why-intro{

        max-width:100%;

    }

    .utk-why-card{

        min-height:220px;

    }
    .utk-why-card.utk-scroll-show .utk-why-icon{margin-left: auto; margin-right: auto;}
    .utk-why-card-line{left: 50%; transform: translateX(-50%);}
    .utk-why-bottom{justify-content: center;}

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:767.98px){

    .utk-why-section{

        padding:70px 0 75px;

    }

    .utk-why-header{

        margin-bottom:35px;

    }

    .utk-why-eyebrow{

        font-size:11px;

        letter-spacing:2.5px;

    }

    .utk-why-title{

        font-size:36px;

        line-height:1.08;

        letter-spacing:-.8px;

    }

    .utk-why-intro{

        font-size:15px;

        line-height:1.7;

    }

    .utk-why-card{

        min-height:auto;

        padding:28px;

    }

    .utk-why-icon{

        width:52px;

        height:52px;

        margin-bottom:22px;

    }

    .utk-why-card-title{

        font-size:20px;

    }

    .utk-why-card p{

        font-size:14px;
        max-width: 100%;

    }

    .utk-why-bottom{

        margin-top:40px;

        padding:22px;

    }

}


/*=========================================================
SMALL MOBILE
=========================================================*/

@media(max-width:575.98px){

    .utk-why-section{

        padding:60px 0 65px;

    }

    .utk-why-title{

        font-size:32px;

    }

    .utk-why-intro{

        font-size:14px;

    }

    .utk-why-card{

        padding:24px;

        border-radius:11px;

    }

    .utk-why-card-title{

        font-size:19px;

    }

    .utk-why-card p{

        font-size:13px;

        line-height:1.65;

    }

    .utk-why-bottom{

        align-items:flex-start;

        gap:14px;

        padding:20px;

    }

    .utk-why-bottom-icon{

        width:45px;

        height:45px;

        flex:0 0 45px;

    }

    .utk-why-bottom-title{

        font-size:17px;

    }

    .utk-why-bottom-text{

        font-size:12px;

    }

}



/*=========================================================
INDUSTRIES WE SERVE
=========================================================*/

.utk-industries-section{

    position:relative;

    padding:115px 0 60px;

    background:#fff;

    overflow:hidden;

}


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

.utk-industries-header{

    margin-bottom:55px;

}


/*=========================================================
EYEBROW
=========================================================*/

.utk-industries-section .utk-section-eyebrow{

    margin-bottom:15px;

    color:var(--utk-red);

    font-family:"Mulish",sans-serif;

    font-size:13px;

    font-weight:800;

    letter-spacing:3px;

    text-transform:uppercase;

}


/*=========================================================
TITLE
=========================================================*/

.utk-industries-title{

    margin:0;

    color:#111;

    font-family:"Urbanist",sans-serif;

    font-size:52px;

    line-height:1.04;

    font-weight:700;

    letter-spacing:-1.5px;

}


.utk-industries-title span{

    display:block;

    color:var(--utk-red);

}


/*=========================================================
INTRO
=========================================================*/

.utk-industries-intro{

    max-width:540px;

    margin:0;

    color:#707070;

    font-family:"Mulish",sans-serif;

    font-size:16px;

    line-height:1.8;

    font-weight:500;

}


/*=========================================================
MAIN AREA
=========================================================*/

.utk-industries-main{

    position:relative;

}


/*=========================================================
LEFT IMAGE
=========================================================*/

.utk-industries-image{

    position:relative;

    height:620px;

    overflow:hidden;

    border-radius:16px;

    background:#151515;

    box-shadow:
        0 20px 50px rgba(0,0,0,.10);

}


.utk-industries-image img, 
.utk-industries-image figure{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    transition:
        transform 1s cubic-bezier(.22,1,.36,1);

}


.utk-industries-image:hover img{

    transform:scale(1.045);

}


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

.utk-industries-image-overlay{

    position:absolute;

    inset:0;

    background:
        linear-gradient(
            to top,
            rgba(5,10,18,.82) 0%,
            rgba(5,10,18,.20) 42%,
            rgba(5,10,18,.08) 100%
        );

}


/*=========================================================
IMAGE CONTENT
=========================================================*/

.utk-industries-image-content{

    position:absolute;

    left:42px;

    right:42px;

    bottom:45px;

    z-index:2;

}


.utk-industries-image-small{

    margin-bottom:13px;

    color:#e57b82;

    font-family:"Mulish",sans-serif;

    font-size:11px;

    font-weight:800;

    letter-spacing:3px;

}


.utk-industries-image-title{

    max-width:500px;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:38px;

    line-height:1.08;

    font-weight:700;

    letter-spacing:-.8px;

}


.utk-industries-image-title span{

    display:block;

    color:#fff;

}


/*=========================================================
IMAGE BADGE
=========================================================*/

.utk-industries-image-badge{

    position:absolute;

    top:30px;

    left:30px;

    z-index:3;

    padding:13px 18px;

    display:flex;

    align-items:center;

    gap:12px;

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

    border-radius:9px;

    background:rgba(0,0,0,.30);

    backdrop-filter:blur(10px);

}


.utk-industries-image-badge > i{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:var(--utk-red);

    color:#fff;

    font-size:17px;

}


.utk-industries-image-badge strong{

    display:block;

    margin-bottom:2px;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:14px;

    font-weight:700;

}


.utk-industries-image-badge span{

    display:block;

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

    font-family:"Mulish",sans-serif;

    font-size:12px;

}


/*=========================================================
INDUSTRY LIST
=========================================================*/

.utk-industries-list{

    height:620px;

    padding-left:55px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}


/*=========================================================
INDUSTRY ROW
=========================================================*/

.utk-industry-row{

    position:relative;

    min-height:96px;

    padding:18px 5px 18px 0;

    display:flex;

    align-items:center;

    gap:22px;

    border-bottom:1px solid #e8e8e8;

    color:#222;

    text-decoration:none;

    transition:

        padding-left .35s ease,

        border-color .35s ease,

        color .35s ease;

}


.utk-industry-row:first-child{

    border-top:1px solid #e8e8e8;

}


/*=========================================================
ACTIVE / HOVER
=========================================================*/

.utk-industry-row:hover,
.utk-industry-row.active{

    padding-left:14px;

    color:#111;

    border-color:#d9b8bb;

}


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

.utk-industry-number{

    width:38px;

    flex:0 0 38px;

    color:#b5b5b5;

    font-family:"Urbanist",sans-serif;

    font-size:12px;

    font-weight:700;

    transition:.35s ease;

}


.utk-industry-row:hover .utk-industry-number,
.utk-industry-row.active .utk-industry-number{

    color:var(--utk-red);

}


/*=========================================================
INDUSTRY INFO
=========================================================*/

.utk-industry-info{

    flex:1;

}


/*=========================================================
NAME
=========================================================*/

.utk-industry-name{

    margin-bottom:5px;

    color:#222;

    font-family:"Urbanist",sans-serif;

    font-size:23px;

    line-height:1.2;

    font-weight:700;

    transition:.35s ease;

}


.utk-industry-row:hover .utk-industry-name,
.utk-industry-row.active .utk-industry-name{

    color:var(--utk-red);

}


/*=========================================================
DESCRIPTION
=========================================================*/

.utk-industry-description{

    color:#888;

    font-family:"Mulish",sans-serif;

    font-size:13px;

    line-height:1.5;

    font-weight:500;

}


/*=========================================================
ARROW
=========================================================*/

.utk-industry-arrow{

    width:42px;

    height:42px;

    flex:0 0 42px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid #dedede;

    border-radius:50%;

    color:#444;

    transition:

        background .35s ease,

        border-color .35s ease,

        color .35s ease,

        transform .35s ease;

}


.utk-industry-row:hover .utk-industry-arrow,
.utk-industry-row.active .utk-industry-arrow{

    background:var(--utk-red);

    border-color:var(--utk-red);

    color:#fff;

    transform:rotate(45deg);

}


.utk-industry-arrow i{

    font-size:15px;

}


/*=========================================================
RED ACTIVE LINE
=========================================================*/

.utk-industry-row::before{

    content:"";

    position:absolute;

    left:-55px;

    top:50%;

    width:3px;

    height:0;

    transform:translateY(-50%);

    background:var(--utk-red);

    border-radius:10px;

    transition:
        height .35s ease;

}


.utk-industry-row:hover::before,
.utk-industry-row.active::before{

    height:52px;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:1199.98px){

    .utk-industries-section{

        padding:95px 0 50px;

    }

    .utk-industries-title{

        font-size:45px;

    }

    .utk-industries-image{

        height:560px;

    }

    .utk-industries-list{

        height:560px;

        padding-left:35px;

    }

    .utk-industry-row::before{

        left:-35px;

    }

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991.98px){

    .utk-industries-section{

        padding:85px 0 45px;

    }

    .utk-industries-header{

        margin-bottom:40px;

    }

    .utk-industries-title{

        margin-bottom:22px;

        font-size:42px;

    }

    .utk-industries-intro{

        font-size:15px;
        max-width: 100%;

    }

    .utk-industries-image{

        height:500px;

    }
.utk-industries-image-title{max-width: 100%;}
    .utk-industries-list{

        height:auto;

        padding:35px 0 0;

    }

    .utk-industry-row::before{

        left:0;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:767.98px){

    .utk-industries-section{

        padding:70px 0 35px;

    }

    .utk-industries-title{

        font-size:36px;

        letter-spacing:-.8px;
        line-height: 1.3;

    }

    .utk-industries-intro{

        font-size:14px;

        line-height:1.7;

    }

    .utk-industries-image{

        height:420px;

        border-radius:12px;

    }

    .utk-industries-image-content{

        left:25px;

        right:25px;

        bottom:30px;

    }

    .utk-industries-image-title{

        font-size:30px;

    }

    .utk-industries-image-badge{

        top:20px;

        left:20px;

    }

    .utk-industries-list{

        padding-top:25px;

    }

    .utk-industry-row{

        min-height:88px;

        gap:14px;

    }

    .utk-industry-name{

        font-size:20px;

    }

    .utk-industry-description{

        font-size:12px;

    }

}


/*=========================================================
SMALL MOBILE
=========================================================*/

@media(max-width:575.98px){

    .utk-industries-section{

        padding:60px 0 30px;

    }

    .utk-industries-title{

        font-size:32px;

    }

    .utk-industries-image{

        height:360px;

    }

    .utk-industries-image-small{

        font-size:12px;

        letter-spacing:2px;

    }

    .utk-industries-image-title{

        font-size:27px;

    }

    .utk-industries-image-badge{

        padding:10px 12px;

    }

    .utk-industries-image-badge > i{

        width:32px;

        height:32px;

        font-size:14px;

    }

    .utk-industries-image-badge strong{

        font-size:14px;

    }

    .utk-industries-image-badge span{

        font-size:12px;

    }

    .utk-industry-number{

        width:30px;

        flex:0 0 30px;

    }

    .utk-industry-name{

        font-size:18px;

    }

    .utk-industry-description{

        font-size:11px;

    }

    .utk-industry-arrow{

        width:36px;

        height:36px;

        flex:0 0 36px;

    }

}


/*=========================================================
COMPANY HIGHLIGHTS
=========================================================*/

.utk-stats-section{

    position:relative;

    padding:35px 0 40px;

    background:#fff;

    overflow:hidden;

}


/*=========================================================
MAIN BOX
=========================================================*/

.utk-stats-box{

    position:relative;

    overflow:hidden;

    border-radius:12px;

    background:
        linear-gradient(
            110deg,
            #780d16 0%,
            #8e111c 48%,
            #6f0b14 100%
        );

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

}


/*=========================================================
SUBTLE BACKGROUND EFFECT
=========================================================*/

.utk-stats-box::before{

    content:"";

    position:absolute;

    width:450px;

    height:450px;

    top:-260px;

    right:-80px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.10),
            rgba(255,255,255,0) 68%
        );

    pointer-events:none;

}


.utk-stats-box::after{

    content:"";

    position:absolute;

    width:350px;

    height:350px;

    bottom:-260px;

    left:25%;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.06),
            rgba(255,255,255,0) 70%
        );

    pointer-events:none;

}


/*=========================================================
STAT ITEM
=========================================================*/

.utk-stat-item{

    position:relative;

    min-height:135px;

    padding:25px 30px;

    display:flex;

    align-items:center;

    justify-content:center;

    gap:17px;

}


/*=========================================================
VERTICAL SEPARATOR
=========================================================*/

.utk-stat-item::after{

    content:"";

    position:absolute;

    top:25px;

    right:0;

    width:1px;

    height:85px;

    background:rgba(255,255,255,.25);

}


.utk-stat-item:last-child::after{

    display:none;

}


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

.utk-stat-icon{

    width:52px;

    height:52px;

    flex:0 0 52px;

    display:flex;

    align-items:center;

    justify-content:center;

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

    border-radius:50%;

    color:#fff;

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

    transition:

        transform .35s ease,

        background .35s ease,

        border-color .35s ease;

}


.utk-stat-icon i{

    font-size:21px;

}


.utk-stat-item:hover .utk-stat-icon{

    transform:translateY(-4px) rotate(5deg);

    background:rgba(255,255,255,.14);

    border-color:rgba(255,255,255,.75);

}


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

.utk-stat-number{

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:38px;

    line-height:1;

    font-weight:700;

    letter-spacing:-1px;

}


/*=========================================================
LABEL
=========================================================*/

.utk-stat-label{

    margin-top:7px;

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

    font-family:"Mulish",sans-serif;

    font-size:15px;

    line-height:1.3;

    font-weight:600;

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991.98px){

    .utk-stats-section{

        padding:30px 0 35px;

    }

    .utk-stat-item{

        min-height:120px;

    }

    .utk-stat-item:nth-child(2)::after{

        display:none;

    }

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:767.98px){

    .utk-stats-section{

        padding:25px 0 30px;

    }

    .utk-stats-box{

        border-radius:10px;

    }

    .utk-stat-item{

        min-height:105px;

        justify-content:flex-start;

        padding:20px 25px;

    }

    .utk-stat-item::after{

        top:auto;

        right:25px;

        bottom:0;

        width:calc(100% - 50px);

        height:1px;

    }

    .utk-stat-item:nth-child(2)::after{

        display:block;

    }

    .utk-stat-item:last-child::after{

        display:none;

    }

    .utk-stat-icon{

        width:46px;

        height:46px;

        flex:0 0 46px;

    }

    .utk-stat-number{

        font-size:32px;

    }

    .utk-stat-label{

        font-size:13px;

    }

}


/*=========================================================
SMALL MOBILE
=========================================================*/

@media(max-width:575.98px){

    .utk-stat-item{

        padding:18px 20px;

        gap:14px;

    }

    .utk-stat-number{

        font-size:29px;

    }

    .utk-stat-icon{

        width:43px;

        height:43px;

        flex:0 0 43px;

    }

}


/*=========================================================
PRODUCT CATALOGUE CTA
=========================================================*/
/*=========================================================
CREATIVE CATALOGUE SECTION
=========================================================*/

.utk-catalogue-creative{

    position:relative;

    padding:60px 0 130px;

    background:#fff;

    overflow:hidden;

}


/*=========================================================
VISUAL
=========================================================*/

.utk-creative-visual{

    position:relative;

    min-height:570px;

    display:flex;

    align-items:center;

    justify-content:center;

}


/*=========================================================
ARCHITECTURAL FRAME
=========================================================*/

.utk-creative-frame{

    position:absolute;

    left:35px;

    top:55px;

    width:450px;

    height:455px;

    border:1px solid #e8e8e8;

    border-left:8px solid #101c2c;

    border-bottom:8px solid #101c2c;

}


/* RED ACCENT */

.utk-creative-frame-line{

    position:absolute;

    width:100px;

    height:5px;

    left:-8px;

    top:55px;

    background:var(--utk-red);

}


/* FRAME LABEL */

.utk-creative-label{

    position:absolute;

    left:25px;

    bottom:20px;

    color:#cfcfcf;

    font-family:"Urbanist",sans-serif;

    font-size:10px;

    font-weight:700;

    letter-spacing:3px;

    writing-mode:vertical-rl;

    transform:rotate(180deg);

}


/*=========================================================
GLOW
=========================================================*/

.utk-creative-glow{

    position:absolute;

    width:460px;

    height:460px;

    border-radius:50%;

    background:

        radial-gradient(

            circle,

            rgba(139,0,0,.10),

            rgba(139,0,0,.035) 45%,

            transparent 72%

        );

}


/*=========================================================
CATALOGUE
=========================================================*/

.utk-creative-book{

    position:relative;

    z-index:3;

    width:390px;

    max-width:67%;

    transform:

        rotate(-7deg)

        translateX(25px);

    filter:

        drop-shadow(

            20px 30px 24px rgba(0,0,0,.22)

        );

    transition:

        transform .8s
        cubic-bezier(.22,1,.36,1);

}


.utk-creative-book img{

    display:block;

    width:100%;

    height:auto;

}


/* HOVER */

.utk-creative-visual:hover
.utk-creative-book{

    transform:

        rotate(-2deg)

        translateX(35px)

        translateY(-12px);

}


/*=========================================================
PRODUCT TAG
=========================================================*/

.utk-creative-product-tag{

    position:absolute;

    z-index:5;

    right:45px;

    bottom:85px;

    display:flex;

    align-items:center;

    gap:10px;

    padding:10px 15px;

    background:#101c2c;

    border-radius:4px;

    box-shadow:

        0 12px 30px rgba(0,0,0,.18);

}


.utk-creative-product-tag i{

    color:#e6a3a7;

    font-size:15px;

}


.utk-creative-product-tag span{

    color:#fff;

    font-family:"Mulish",sans-serif;

    font-size:12px;

    font-weight:800;

    letter-spacing:1.5px;

}


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

.utk-creative-content{

    position:relative;

    z-index:5;

    padding:20px 20px 20px 30px;

}


/*=========================================================
EYEBROW
=========================================================*/

.utk-creative-eyebrow{

    margin-bottom:18px;

    color:var(--utk-red);

    font-family:"Mulish",sans-serif;

    font-size:11px;

    font-weight:800;

    letter-spacing:3px;

}


/*=========================================================
TITLE
=========================================================*/

.utk-creative-title{

    margin:0;

    color:#101010;

    font-family:"Urbanist",sans-serif;

    font-size:53px;

    line-height:1.02;

    letter-spacing:-1.8px;

    font-weight:700;

}


.utk-creative-title span{

    display:block;

    color:var(--utk-red);

}


/*=========================================================
DESCRIPTION
=========================================================*/

.utk-creative-text{

    margin:25px 0 27px;

    max-width:490px;

    color:#6d6d6d;

    font-family:"Mulish",sans-serif;

    font-size:15px;

    line-height:1.8;

}


/*=========================================================
PILLS
=========================================================*/

.utk-creative-pills{

    display:flex;

    flex-wrap:wrap;

    gap:8px;

    margin-bottom:30px;

}


.utk-creative-pills span{

    padding:8px 12px;

    border:1px solid #e7e7e7;

    border-radius:30px;

    color:#555;

    background:#fff;

    font-family:"Mulish",sans-serif;

    font-size:10px;

    font-weight:700;

    transition:

        color .25s ease,

        background .25s ease,

        border-color .25s ease;

}


.utk-creative-pills span:hover{

    color:#fff;

    background:var(--utk-red);

    border-color:var(--utk-red);

}


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

.utk-creative-button{

    min-height:50px;

    padding:0 20px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:25px;

    color:#fff;

    background:var(--utk-red);

    border:1px solid var(--utk-red);

    border-radius:4px;

    text-decoration:none;

    font-family:"Mulish",sans-serif;

    font-size:13px;

    font-weight:800;

    letter-spacing:.7px;

    transition:

        transform .3s ease,

        box-shadow .3s ease;

}


.utk-creative-button:hover{

    color:#fff;

    transform:translateY(-3px);

    box-shadow:

        0 12px 30px rgba(139,0,0,.22);

}


.utk-creative-button i{

    font-size:16px;

}


/*=========================================================
META
=========================================================*/

.utk-creative-meta{

    margin-top:17px;

    display:flex;

    align-items:center;

    gap:8px;

    color:#888;

    font-family:"Mulish",sans-serif;

    font-size:10px;

    font-weight:600;

}


.utk-creative-meta i{

    color:var(--utk-red);

    font-size:14px;

}


/*=========================================================
LARGE DESKTOP
=========================================================*/

@media(min-width:1400px){

    .utk-creative-visual{

        min-height:620px;

    }

    .utk-creative-frame{

        width:500px;

        height:500px;

    }

    .utk-creative-book{

        width:420px;

    }

    .utk-creative-title{

        font-size:58px;

    }

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:1199.98px){

    .utk-catalogue-creative{

        padding:40px 0 40px;

    }

    .utk-creative-frame{

        left:10px;

        width:420px;

        height:430px;

    }

    .utk-creative-book{

        width:350px;

    }

    .utk-creative-title{

        font-size:44px;
       

    }

}


/*=========================================================
TABLET
=========================================================*/

@media(max-width:991.98px){

    .utk-creative-visual{

        min-height:510px;

    }

    .utk-creative-frame{

        left:50%;

        transform:translateX(-50%);

        width:430px;

        height:430px;

    }

    .utk-creative-book{

        width:360px;

    }

    .utk-creative-product-tag{

        right:80px;

        bottom:55px;

    }

    .utk-creative-content{

        padding:30px 25px 0;

    }
    .utk-creative-text{max-width: 100%;}
    .utk-creative-pills,.utk-creative-meta {justify-content: center;}

}


/*=========================================================
MOBILE
=========================================================*/

@media(max-width:767.98px){

    .utk-catalogue-creative{

        padding:35px 0 75px;

    }

    .utk-creative-visual{

        min-height:440px;

    }

    .utk-creative-frame{

        width:330px;

        height:350px;

        top:35px;

    }

    .utk-creative-book{

        width:310px;

        max-width:72%;

    }

    .utk-creative-product-tag{

        right:20px;

        bottom:35px;

    }

    .utk-creative-content{

        padding:20px 10px 0;

    }

    .utk-creative-title{

        font-size:37px;
         line-height: 1.3;

    }

    .utk-creative-text{

        font-size:14px;

    }

}


/*=========================================================
SMALL MOBILE
=========================================================*/

@media(max-width:575.98px){

    .utk-creative-visual{

        min-height:390px;

    }

    .utk-creative-frame{

        width:285px;

        height:310px;

    }

    .utk-creative-book{

        width:275px;

    }

    .utk-creative-product-tag{

        right:5px;

        bottom:25px;

        padding:8px 10px;

    }

    .utk-creative-product-tag span{

        font-size:8px;

    }

    .utk-creative-title{

        font-size:31px;

    }

    .utk-creative-pills span{

        font-size:9px;

        padding:7px 10px;

    }

}


/* =========================================================
   UTKAL INNOVATIONS
   IMAGE FOOTER
========================================================= */

.utk-footer-new{

    position:relative;

    color:#fff;

    background:#061426;

    overflow:hidden;

}


/* =========================================================
   FOOTER BACKGROUND IMAGE
========================================================= */

.utk-footer-background{

    position:absolute;

    inset:0;

    z-index:0;

}


.utk-footer-background img, 
.utk-footer-background figure{

    width:100%;

    height:100%;

    display:block;

    object-fit:cover;

    object-position:center;

}


/* =========================================================
   DARK OVERLAY
========================================================= */

.utk-footer-overlay{

    position:absolute;

    inset:0;

    z-index:1;

    background:

        linear-gradient(
            90deg,
            rgba(4,16,30,.96) 0%,
            rgba(5,20,37,.91) 42%,
            rgba(5,20,37,.82) 70%,
            rgba(5,20,37,.90) 100%
        );

}


/* =========================================================
   TOP CTA
========================================================= */

.utk-footer-top{

    position:relative;

    z-index:3;

    min-height:125px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:35px;

    border-bottom:1px solid
        rgba(255,255,255,.16);

}


/* =========================================================
   CTA KICKER
========================================================= */

.utk-footer-kicker{

    display:block;

    margin-bottom:8px;

    color:#e05b66;

    font-family:"Mulish",sans-serif;

    font-size:11px;

    font-weight:800;

    letter-spacing:2.5px;

}


/* =========================================================
   CTA TITLE
========================================================= */

.utk-footer-top .home-cta-title{

    margin:0;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:32px;

    line-height:1.15;

    font-weight:600;

}


/* =========================================================
   QUOTE BUTTON
========================================================= */

.utk-footer-quote{

    min-width:165px;

    min-height:52px;

    padding:0 22px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:22px;

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

    border-radius:5px;

    background:#900916;

    color:#fff;

    font-family:"Mulish",sans-serif;

    font-size:11px;

    font-weight:800;

    letter-spacing:1px;

    text-decoration:none;

    transition:

        transform .3s ease,

        background .3s ease,

        box-shadow .3s ease;

}


.utk-footer-quote:hover{

    color:#900916;

    background:#fff;

    border-color:#fff;

    transform:translateY(-3px);

    box-shadow:
        0 12px 30px rgba(0,0,0,.25);

}


.utk-footer-quote i{

    font-size:16px;

}


/* =========================================================
   MAIN CONTENT
========================================================= */

.utk-footer-content{

    position:relative;

    z-index:3;

    padding:48px 0 38px;

}


/* =========================================================
   BRAND
========================================================= */

.utk-footer-logo-new{

    width:145px;

    height:auto;

    display:block;

    margin-bottom:20px;

}


.utk-footer-brand-new p{

    max-width:360px;

    margin:0 0 23px;

    color:#c0c9d4;

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.8;

}


/* =========================================================
   SOCIAL
========================================================= */

.utk-footer-social-new{

    display:flex;

    gap:10px;

}


.utk-footer-social-new a{

    width:40px;

    height:40px;

    display:flex;

    align-items:center;

    justify-content:center;

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

    border-radius:50%;

    background:rgba(255,255,255,.04);

    color:#c3ccd6;

    font-size:16px;

    text-decoration:none;

    transition:.3s ease;

}


.utk-footer-social-new a:hover{

    color:#fff;

    background:#900916;

    border-color:#900916;

    transform:translateY(-3px);

}


/* =========================================================
   FOOTER COLUMN
========================================================= */

.utk-footer-links-new .footer-title,
.utk-footer-contact-new .footer-title{

    margin:0;

    color:#fff;

    font-family:"Urbanist",sans-serif;

    font-size:20px;

    line-height:1.2;

    font-weight:700;

}


/* =========================================================
   RED LINE
========================================================= */

.utk-footer-accent,
.utk-footer-contact-line{

    display:block;

    width:42px;

    height:2px;

    margin:12px 0 21px;

    background:#a80b18;

}


/* =========================================================
   FOOTER LINKS
========================================================= */

.utk-footer-links-new a{

    display:flex;

    align-items:center;

    gap:10px;

    width:max-content;

    margin-bottom:13px;

    color:#b7c1cd;

    font-family:"Mulish",sans-serif;

    font-size:14px;

    line-height:1.4;

    font-weight:500;

    text-decoration:none;

    transition:

        color .25s ease,

        transform .25s ease;

}


.utk-footer-links-new a i{

    width:16px;

    color:#d94d59;

    font-size:11px;

    text-align:center;

    transition:.25s ease;

}


.utk-footer-links-new a:hover{

    color:#fff;

    transform:translateX(4px);

}


.utk-footer-links-new a:hover i{

    color:#fff;

}


/* =========================================================
   CONTACT ROW
========================================================= */

.utk-contact-row{

    display:flex;

    align-items:flex-start;

    gap:13px;

    margin-bottom:19px;

}


.utk-contact-row > i{

    width:38px;

    height:38px;

    flex:0 0 38px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid
        rgba(217,77,89,.35);

    border-radius:5px;

    background:rgba(144,9,22,.10);

    color:#e35a65;

    font-size:15px;

}


.utk-contact-row p{

    margin:0;

    color:#b7c1cd;

    font-family:"Mulish",sans-serif;

    font-size:13px;

    line-height:1.65;

}


.utk-contact-row a{

    color:#b7c1cd;

    text-decoration:none;

    transition:.25s ease;

}


.utk-contact-row a:hover{

    color:#fff;

}


/* =========================================================
   BOTTOM BAR
========================================================= */

.utk-footer-bottom-new{

    position:relative;

    z-index:3;

    min-height:55px;

    background:rgba(2,12,24,.92);

    border-top:1px solid
        rgba(255,255,255,.10);

}


.utk-footer-bottom-inner-new{

    min-height:55px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:20px;

}


.utk-footer-bottom-inner-new p{

    margin:0;

    color:#9ba7b6;

    font-family:"Mulish",sans-serif;

    font-size:11px;

}


.utk-footer-bottom-inner-new p a{

    color:#f1aab0;

    font-weight:700;

    text-decoration:none;

    transition:.25s ease;

}


.utk-footer-bottom-inner-new p a:hover{

    color:#fff;

   

}


/* =========================================================
   POWERED BY
========================================================= */

.utk-powered{

    display:flex;

    align-items:center;

    gap:5px;

}


.utk-powered a{

    color:#f1aab0;

    font-weight:700;

    text-decoration:none;

    transition:.25s ease;

}


.utk-powered a:hover{

    color:#fff;

   

}


/* =========================================================
   BACK TO TOP
========================================================= */

.utk-back-top{

    width:38px;

    height:38px;

    display:flex;

    align-items:center;

    justify-content:center;

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

    border-radius:5px;

    color:#c4ccd6;

    background:rgba(255,255,255,.03);

    text-decoration:none;

    transition:.3s ease;

}


.utk-back-top:hover{

    color:#fff;

    background:#900916;

    border-color:#900916;

    transform:translateY(-3px);

}


.utk-back-top i{

    font-size:15px;

}

/* =========================================================
   FINAL FOOTER ADJUSTMENTS
========================================================= */

.utk-footer-logo-new {
    width: 125px;
    margin-bottom: 17px;
}

.utk-footer-brand-new p {
    max-width: 380px;
    font-size: 14px;
    line-height: 1.75;
}

.utk-footer-content {
    padding: 45px 0 35px;
}

.utk-footer-overlay {
    background:
        linear-gradient(
            90deg,
            rgba(4,16,30,.97) 0%,
            rgba(5,20,37,.94) 45%,
            rgba(5,20,37,.88) 75%,
            rgba(5,20,37,.94) 100%
        );
}

.utk-footer-links-new a {
    font-size: 14px;
    margin-bottom: 12px;
}

.utk-footer-contact-new {
    padding-left: 10px;
}

.utk-contact-row {
    margin-bottom: 17px;
}

.utk-contact-row p {
    font-size: 13px;
}

.utk-footer-top .home-cta-title {
    font-size: 32px;
}

.utk-footer-bottom-inner-new p {
    font-size: 14px;
}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media(min-width:1400px){

    .utk-footer-top{

        min-height:135px;

    }


    .utk-footer-content{

        padding:55px 0 42px;

    }


    .utk-footer-top .home-cta-title{

        font-size:35px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media(max-width:991.98px){

    .utk-footer-content{

        padding:45px 0 30px;

    }


    .utk-footer-brand-new, .utk-footer-links-new{

        margin-bottom:30px;

    }
    .utk-footer-logo-new{margin-left: auto; margin-right: auto;}
    .utk-footer-brand-new p {
  max-width: 100%;}
  .utk-footer-social-new{justify-content: center;}
.utk-footer-accent, .utk-footer-contact-line{margin-left: auto; margin-right: auto;}
.utk-footer-links-new a{display: inline-flex; gap: 0; margin-right: 10px; margin-bottom: 2px;}
.utk-contact-row{justify-content: center;}
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:767.98px){
    

    .utk-footer-top{

        min-height:160px;

        padding:30px 0;

        flex-direction:column;

        align-items:flex-start;

        justify-content:center;

    }


    .utk-footer-top .home-cta-title{

        font-size:27px;

    }


    .utk-footer-content{

        padding:42px 0 25px;

    }
    .utk-footer-top-content{width: 100%;}
    .utk-footer-quote{margin-left: auto; margin-right: auto;}


    .utk-footer-background img, .utk-footer-background figure{

        object-position:center;

    }


    .utk-footer-bottom-inner-new{

        padding:12px 0;

        flex-wrap:wrap;

        justify-content:center;

        text-align:center;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media(max-width:575.98px){

    .utk-footer-top .home-cta-title{

        font-size:23px;

    }


    .utk-footer-kicker{

        font-size:9px;

        letter-spacing:2px;

    }


    .utk-footer-quote{

        min-height:46px;

        min-width:145px;

    }


    .utk-footer-logo-new{

        width:130px;

    }


    .utk-footer-brand-new p{

        font-size:13px;

    }


    .utk-footer-links-new .footer-title,
    .utk-footer-contact-new .footer-title{

        font-size:19px;

    }


    .utk-footer-links-new a{

        font-size:13px;

    }


    .utk-footer-bottom-inner-new{

        gap:10px;

    }

}


@media (max-width: 1366.98px) {
    /* Prevent navbar content from creating horizontal overflow */
    .utk-navigationwrap .container{
        width:100%;
        max-width:100%;
        padding-left:20px;
        padding-right:20px;
    }

    .utk-navigationwrap .navbar{
        width:100%;
        min-width:0;
    }

    /* Keep logo from forcing navbar wider */
    .utk-brandmark{
        flex-shrink:0;
    }

    .utk-brandmark img{
        height:62px;
    }
}



/* =========================================================
   FIX HORIZONTAL SCROLL AT 992px - 1199px
   ========================================================= */

@media (min-width: 992px) and (max-width: 1300.98px) {

    /* Prevent navbar content from creating horizontal overflow */
    .utk-navigationwrap .container{
        width:100%;
        max-width:100%;
        padding-left:20px;
        padding-right:20px;
    }

    .utk-navigationwrap .navbar{
        width:100%;
        min-width:0;
    }

    /* Keep logo from forcing navbar wider */
    .utk-brandmark{
        flex-shrink:0;
    }

    .utk-brandmark img{
        height:62px;
    }

    /* Allow menu area to shrink */
    /* #desktopMenuHolder{
        min-width:0;
        overflow:hidden;
    } */

    /* Reduce menu spacing */
    .utk-menugrid{
        gap:0;
        flex-wrap:nowrap;
        white-space:nowrap;
    }

    .utk-menugrid > .nav-item > .nav-link{
        padding:30px 14px;
        font-size:12px;
        white-space:nowrap;
    }

    /* Dropdown arrow needs less space */
    .utk-menugrid .dropdown-toggle{
        padding-right:15px;
    }

    .utk-menugrid .dropdown-toggle::after{
        margin-left:4px;
    }

}




/* =========================================================
   UTKAL ABOUT HERO
========================================================= */

:root {

    --utk-red: #7e1f28;
    --utk-red-dark: #65161e;
    --utk-navy: #071426;

}


/* =========================================================
   MAIN HERO
========================================================= */

.utk-about-hero {

    position: relative;

    background: #ffffff;

    overflow: hidden;

}


/* =========================================================
   LEFT CONTENT
========================================================= */

.utk-about-hero-content {

    position: relative;

    padding: 85px 50px 80px 0;

    z-index: 5;

}


/* =========================================================
   LABEL
========================================================= */

.utk-about-label {

    display: flex;

    align-items: center;

    gap: 12px;

    color: var(--utk-red);

    font-family: "Mulish", sans-serif;

    font-size: 14px;

    font-weight: 800;

    letter-spacing: 1.5px;

    margin-bottom: 22px;

}


.utk-about-label span {

    width: 38px;

    height: 2px;

    display: block;

    background: var(--utk-red);

}


/* =========================================================
   MAIN TITLE
========================================================= */

.utk-about-hero h1 {

    margin: 0;

    max-width: 650px;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

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

    font-weight: 800;

    line-height: .98;

    letter-spacing: -2.5px;

}


.utk-about-hero h1 strong {

    display: block;

    color: var(--utk-red);

    font-weight: 800;

}


/* =========================================================
   DIVIDER
========================================================= */

.utk-about-divider {

    width: 60px;

    height: 4px;

    background: var(--utk-red);

    margin: 30px 0 25px;

}


/* =========================================================
   DESCRIPTION
========================================================= */

.utk-about-description {

    max-width: 620px;

}


.utk-about-description p {

    margin-bottom: 16px;

    color: #5f6874;

    font-family: "Mulish", sans-serif;

    font-size: 15px;

    line-height: 1.8;

    font-weight: 500;

}


/* =========================================================
   BUTTONS
========================================================= */

.utk-about-buttons {

    display: flex;

    align-items: center;

    gap: 15px;

    margin-top: 30px;

}


.utk-about-btn {

    min-height: 52px;

    padding: 0 24px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 20px;

    font-family: "Mulish", sans-serif;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: .5px;

    text-decoration: none;

    border-radius: 5px;

    transition:
        .3s ease;

}


.utk-about-btn i {

    font-size: 16px;

    transition: .3s ease;

}


.utk-about-btn:hover i {

    transform: translateX(4px);

}


/* PRIMARY */

.utk-about-btn-primary {

    color: #ffffff;

    background: var(--utk-red);

    border: 1px solid var(--utk-red);

}


.utk-about-btn-primary:hover {

    color: #ffffff;

    background: var(--utk-red-dark);

    transform: translateY(-2px);

    box-shadow:
        0 10px 25px rgba(126,31,40,.18);

}


/* OUTLINE */

.utk-about-btn-outline {

    color: var(--utk-navy);

    background: #ffffff;

    border: 1px solid var(--utk-navy);

}


.utk-about-btn-outline:hover {

    color: #ffffff;

    background: var(--utk-navy);

    transform: translateY(-2px);

}


/* =========================================================
   RIGHT VISUAL
========================================================= */

.utk-about-visual {

    position: relative;

    min-height: 650px;

    padding: 45px 30px 45px 35px;

}


/* =========================================================
   MAIN IMAGE
========================================================= */

.utk-about-image {

    position: relative;

    width: 100%;

    height: auto;

    overflow: hidden;

    border-radius: 28px;

    box-shadow:
        0 25px 60px rgba(7,20,38,.12);

}


.utk-about-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            transparent 65%,
            rgba(7,20,38,.15)
        );

    pointer-events: none;

}


.utk-about-image img {

    width: 100%;

    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transition:
        transform .8s ease;

}


.utk-about-visual:hover
.utk-about-image img {

    transform: scale(1.025);

}


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

.utk-about-oem-card {
    display: none;

    position: absolute;

    right: -5px;

    top: 20%;

    width: 220px;

    padding: 28px;

    background: #ffffff;

    border-radius: 22px;

    box-shadow:
        0 20px 50px rgba(7,20,38,.16);

    z-index: 5;

}


.utk-about-oem-icon {

    width: 54px;

    height: 54px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 18px;

    border-radius: 50%;

    color: #ffffff;

    background: var(--utk-navy);

    font-size: 23px;

}


.utk-about-oem-card h3 {

    margin: 0;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: 18px;

    line-height: 1.15;

    font-weight: 800;

}


.utk-card-line {

    width: 38px;

    height: 2px;

    margin: 13px 0;

    background: var(--utk-red);

}


.utk-about-oem-card p {

    margin: 0;

    color: #69727d;

    font-family: "Mulish", sans-serif;

    font-size: 13px;

    line-height: 1.7;

}


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

.utk-about-experience-card {

    position: absolute;

    right: -5px;

    bottom: 65px;

    width: 250px;

    min-height: 125px;

    display: flex;

    align-items: center;

    padding: 22px 25px;

    color: #ffffff;

    background: var(--utk-navy);

    border-radius: 20px;

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

    z-index: 6;

}


.utk-india-icon {

    width: 58px;

    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #ffffff;

    font-size: 28px;

}


.utk-india-divider {

    width: 1px;

    height: 55px;

    margin: 0 18px;

    background: rgba(255,255,255,.35);

}


.utk-about-experience-card strong {

    display: block;

    color: var(--utk-red);

    font-family: "Urbanist", sans-serif;

    font-size: 31px;

    line-height: 1;

}


.utk-about-experience-card span {

    display: block;

    margin-top: 5px;

    color: #ffffff;

    font-family: "Mulish", sans-serif;

    font-size: 10px;

    line-height: 1.3;

    font-weight: 700;

    letter-spacing: .8px;

}


/* =========================================================
   DECORATIVE DOTS
========================================================= */

.utk-about-dots {

    position: absolute;

    right: -25px;

    top: 55px;

    width: 70px;

    display: grid;

    grid-template-columns:
        repeat(3, 5px);

    gap: 8px;

}


.utk-about-dots span {

    width: 4px;

    height: 4px;

    border-radius: 50%;

    background: var(--utk-red);

    opacity: .45;

}


/* =========================================================
   FEATURE STRIP
========================================================= */

.utk-about-features {

    position: relative;

    border-top: 1px solid #eeeeee;

    border-bottom: 1px solid #eeeeee;

    background: #ffffff;

}


.utk-about-feature {

    min-height: 125px;

    height: 100%;

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 22px 25px;

    border-right: 1px solid #e6e6e6;

}


.utk-about-feature:last-child {

    border-right: 0;

}


/* =========================================================
   FEATURE ICON
========================================================= */

.utk-feature-icon {

    flex: 0 0 55px;

    width: 55px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #fafafa;

    border: 1px solid #eeeeee;

    color: var(--utk-red);

    font-size: 22px;

}


.utk-about-feature h4 {

    margin: 0 0 6px;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: 14px;

    line-height: 1.2;

    font-weight: 800;

}


.utk-about-feature p {

    max-width: 170px;

    margin: 0;

    color: #747d88;

    font-family: "Mulish", sans-serif;

    font-size: 13px;

    line-height: 1.5;

}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .utk-about-hero-content {

        padding-right: 25px;

    }

    .utk-about-hero h1 {

        font-size: 58px;

    }

    .utk-about-visual {

        padding-left: 20px;

        padding-right: 20px;

    }

    .utk-about-oem-card {

        right: -5px;

    }

    .utk-about-experience-card {

        right: -5px;

    }

    .utk-about-feature {

        padding: 20px 15px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .utk-about-hero-content {

        padding:
            70px 20px 50px;

    }

    .utk-about-hero h1 {

        font-size: 58px;

    }

    .utk-about-visual {

        min-height: 600px;

        padding:
            0 20px 60px;

    }

    /* .utk-about-image {

        height: 500px;

    } */

    .utk-about-oem-card {

        right: 5px;

        top: 190px;

    }

    .utk-about-experience-card {

        right: 5px;

        bottom: 35px;

    }

    .utk-about-dots {

        right: 0;

    }

    .utk-about-feature {

        border-bottom: 1px solid #e6e6e6;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .utk-about-hero-content {

        padding:
            55px 20px 45px;

    }

    .utk-about-hero h1 {

        font-size: 48px;

        letter-spacing: -1.5px;

    }

    .utk-about-description p {

        font-size: 14px;

    }

    .utk-about-buttons {

        flex-direction: column;

        align-items: stretch;

    }

    .utk-about-btn {

        width: 100%;

    }

    .utk-about-visual {

        min-height: 530px;

        padding:
            0 15px 50px;

    }

    .utk-about-image {

        /* height: 430px; */

        border-radius: 20px;

    }

    .utk-about-oem-card {

        right: 0;

        top: 155px;

        width: 190px;

        padding: 22px;

    }

    .utk-about-experience-card {

        right: 0;

        bottom: 15px;

        width: 220px;

    }

    .utk-about-dots {

        display: none;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .utk-about-hero h1 {

        font-size: 42px;

    }

    .utk-about-label {

        font-size: 12px;

    }

    /* .utk-about-image {

        height: 370px;

    } */

    .utk-about-oem-card {

        width: 165px;

        padding: 18px;

    }

    .utk-about-oem-icon {

        width: 45px;

        height: 45px;

        font-size: 19px;

    }

    .utk-about-oem-card h3 {

        font-size: 15px;

    }

    .utk-about-oem-card p {

        font-size: 11px;

    }

    .utk-about-experience-card {

        width: 200px;

        min-height: 105px;

        padding: 18px;

    }

    .utk-india-icon {

        width: 45px;

        height: 45px;

    }

}



/* =========================================================
   WHO WE ARE SECTION
========================================================= */

/* =========================================================
   MAIN SECTION
========================================================= */

.utk-about-who {

    position: relative;

    width: 100%;

    padding: 110px 0 120px;

    background: #ffffff;

    overflow: hidden;

}


/* =========================================================
   LEFT IMAGE AREA
========================================================= */

.utk-about-story-visual {

    position: relative;

    min-height: 570px;

    padding: 0 45px 45px 35px;

}


/* =========================================================
   MAIN IMAGE
========================================================= */

.utk-about-main-image {

    position: relative;

    width: 88%;

    height: 510px;

    margin-right: auto;

    overflow: hidden;

    border-radius: 16px;

    background: #f3f3f3;

    box-shadow:
        0 25px 60px rgba(7,20,38,.12);

}


/* IMAGE */

.utk-about-main-image img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

    object-position: center;

    transition:
        transform .8s cubic-bezier(.22,1,.36,1);

}


/* IMAGE HOVER */

.utk-about-story-visual:hover
.utk-about-main-image img {

    transform: scale(1.04);

}


/* =========================================================
   SMALL IMAGE
========================================================= */

.utk-about-small-image {

    position: absolute;

    right: 0;

    bottom: 0;

    width: 245px;

    height: 180px;

    padding: 7px;

    background: #ffffff;

    border-radius: 4px;

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

    z-index: 3;

}


.utk-about-small-image img {

    display: block;

    width: 100%;

    height: 100%;

    object-fit: cover;

}


/* =========================================================
   OEM BADGE
========================================================= */

.utk-about-oem-badge {

    position: absolute;

    left: 0;

    top: 90px;

    width: 200px;

    min-height: 92px;

    display: flex;

    align-items: center;

    gap: 14px;

    padding: 18px;

    background: var(--utk-navy);

    color: #ffffff;

    border-radius: 5px;

    box-shadow:
        0 18px 40px rgba(7,20,38,.20);

    z-index: 5;

}


/* OEM ICON */

.utk-about-oem-icon {

    flex: 0 0 48px;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

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

    border-radius: 50%;

    color: #ffffff;

    font-size: 20px;

}


/* OEM TITLE */

.utk-about-oem-badge strong {

    display: block;

    margin: 0;

    color: #ffffff;

    font-family: "Urbanist", sans-serif;

    font-size: 22px;

    line-height: 1;

    font-weight: 800;

}


/* OEM SUBTITLE */

.utk-about-oem-badge span {

    display: block;

    margin-top: 6px;

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

    font-family: "Mulish", sans-serif;

    font-size: 9px;

    line-height: 1;

    font-weight: 800;

    letter-spacing: 1.2px;

}


/* =========================================================
   RED CORNER
========================================================= */

.utk-about-corner {

    position: absolute;

    left: 5px;

    bottom: 12px;

    width: 95px;

    height: 95px;

    border-left: 3px solid var(--utk-red);

    border-bottom: 3px solid var(--utk-red);

    pointer-events: none;

}


/* =========================================================
   RIGHT CONTENT
========================================================= */

.utk-about-story-content {

    position: relative;

    padding-left: 20px;

}


/* =========================================================
   SECTION LABEL
========================================================= */

.utk-about-label {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

    color: var(--utk-red);

    font-family: "Mulish", sans-serif;

    font-size: 13px;

    line-height: 1.3;

    font-weight: 800;

    letter-spacing: 2.5px;

}


.utk-about-label span {

    display: block;

    width: 38px;

    height: 2px;

    background: var(--utk-red);

}


/* =========================================================
   TITLE
========================================================= */

.utk-about-title {

    max-width: 620px;

    margin: 0;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: clamp(43px, 4vw, 62px);

    line-height: 1.04;

    letter-spacing: -2px;

    font-weight: 800;

}


.utk-about-title strong {

    color: var(--utk-red);

    font-weight: 800;

}


/* =========================================================
   DIVIDER
========================================================= */

.utk-about-divider {

    width: 85px;

    height: 3px;

    margin: 27px 0 28px;

    background:
        linear-gradient(
            to right,
            var(--utk-red) 0 35px,
            #e4e4e4 35px 100%
        );

}


/* =========================================================
   LEAD TEXT
========================================================= */

.utk-about-lead {

    max-width: 620px;

    margin: 0 0 20px;

    color: var(--utk-navy);

    font-family: "Mulish", sans-serif;

    font-size: 17px;

    line-height: 1.8;

    font-weight: 600;

}


/* =========================================================
   NORMAL TEXT
========================================================= */

.utk-about-text {

    max-width: 620px;

    margin: 0 0 18px;

    color: #68717d;

    font-family: "Mulish", sans-serif;

    font-size: 15px;

    line-height: 1.85;

    font-weight: 500;

}


/* =========================================================
   HIGHLIGHT BOX
========================================================= */

.utk-about-highlight {

    max-width: 620px;

    min-height: 85px;

    display: flex;

    align-items: center;

    gap: 18px;

    margin-top: 30px;

    padding: 18px 22px;

    background: #faf7f7;

    border-left: 4px solid var(--utk-red);

    border-radius: 4px;

}


/* HIGHLIGHT ICON */

.utk-about-highlight-icon {

    flex: 0 0 48px;

    width: 48px;

    height: 48px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: var(--utk-red);

    color: #ffffff;

}


.utk-about-highlight-icon i {

    font-size: 20px;

}


/* HIGHLIGHT CONTENT */

.utk-about-highlight-content {

    min-width: 0;

}


/* HIGHLIGHT TITLE */

.utk-about-highlight-content strong {

    display: block;

    margin-bottom: 5px;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: 15px;

    line-height: 1.4;

    font-weight: 800;

}


/* HIGHLIGHT SUBTEXT */

.utk-about-highlight-content span {

    display: block;

    color: #8a9098;

    font-family: "Mulish", sans-serif;

    font-size: 11px;

    line-height: 1.4;

    font-weight: 700;

    letter-spacing: .5px;

}


.utk-about-highlight-content b {

    color: var(--utk-red);

}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .utk-about-who {

        padding:
            90px 0 100px;

    }


    .utk-about-story-visual {

        padding:
            0 30px 40px 25px;

    }


    .utk-about-main-image {

        width: 90%;

        height: 470px;

    }


    .utk-about-small-image {

        width: 210px;

        height: 160px;

    }


    .utk-about-oem-badge {

        left: -5px;

    }


    .utk-about-story-content {

        padding-left: 10px;

    }


    .utk-about-title {

        font-size: 48px;

    }


    .utk-about-lead {

        font-size: 16px;

    }


    .utk-about-text {

        font-size: 14px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991.98px) {

    .utk-about-who {

        padding:
            80px 0 90px;

    }


    .utk-about-story-visual {

        min-height: 550px;

        padding:
            0 35px 45px;

    }


    .utk-about-main-image {

        width: 90%;

        height: 480px;

        margin-left: auto;

        margin-right: auto;

    }


    .utk-about-oem-badge {

        left: 15px;

        top: 80px;

    }


    .utk-about-small-image {

        right: 15px;

    }


    .utk-about-corner {

        left: 20px;

    }


    .utk-about-story-content {

        padding-left: 0;

    }


    .utk-about-title {

        font-size: 48px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767.98px) {

    .utk-about-who {

        padding:
            65px 0 75px;

    }


    .utk-about-story-visual {

        min-height: 470px;

        padding:
            0 20px 45px;

    }


    .utk-about-main-image {

        width: 92%;

        height: 390px;

    }


    .utk-about-small-image {

        right: 0;

        width: 180px;

        height: 135px;

    }


    .utk-about-oem-badge {

        left: 0;

        top: 65px;

        width: 170px;

        padding: 14px;

    }


    .utk-about-oem-icon {

        flex-basis: 42px;

        width: 42px;

        height: 42px;

        font-size: 18px;

    }


    .utk-about-oem-badge strong {

        font-size: 19px;

    }


    .utk-about-corner {

        left: 5px;

        width: 65px;

        height: 65px;

    }


    .utk-about-label {

        font-size: 11px;

        letter-spacing: 2px;

    }


    .utk-about-title {

        font-size: 40px;

        letter-spacing: -1.2px;

    }


    .utk-about-lead {

        font-size: 15px;

        line-height: 1.8;

    }


    .utk-about-text {

        font-size: 14px;

        line-height: 1.8;

    }


    .utk-about-highlight {

        align-items: flex-start;

        padding: 17px;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .utk-about-who {

        padding:
            55px 0 65px;

    }


    .utk-about-story-visual {

        min-height: 410px;

        padding:
            0 10px 35px;

    }


    .utk-about-main-image {

        width: 94%;

        height: 340px;

        border-radius: 10px;

    }


    .utk-about-small-image {

        width: 145px;

        height: 110px;

    }


    .utk-about-oem-badge {

        width: 145px;

        top: 55px;

        left: -5px;

        padding: 11px;

    }


    .utk-about-oem-icon {

        flex-basis: 38px;

        width: 38px;

        height: 38px;

        font-size: 16px;

    }


    .utk-about-oem-badge strong {

        font-size: 17px;

    }


    .utk-about-oem-badge span {

        font-size: 7px;

        letter-spacing: .8px;

    }


    .utk-about-title {

        font-size: 35px;

        letter-spacing: -.8px;

    }


    .utk-about-divider {

        margin:
            20px 0 22px;

    }


    .utk-about-lead {

        font-size: 14px;

    }


    .utk-about-text {

        font-size: 13.5px;

    }


    .utk-about-highlight {

        gap: 12px;

        padding: 14px;

    }


    .utk-about-highlight-icon {

        flex-basis: 40px;

        width: 40px;

        height: 40px;

    }


    .utk-about-highlight-content strong {

        font-size: 13px;

    }


    .utk-about-highlight-content span {

        font-size: 9px;

    }

}




/* =========================================================
   VISION & MISSION SECTION
========================================================= */

.utk-vm-section {

   

    position: relative;

    padding: 105px 0 95px;

    background: #f8f9fa;

    overflow: hidden;

}


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

.utk-vm-bg {

    position: absolute;

    inset: 0;
/* 
    background-image:
        linear-gradient(
            rgba(255,255,255,.91),
            rgba(255,255,255,.91)
        ),
        url("../images/utkal-innovations-bg.jpg"); */


          background-image:
       
        url("../images/utkal-innovations-bg.jpg");

    background-size: cover;

    background-position: center;

    opacity: .55;

    pointer-events: none;

}


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

.utk-vm-heading {

    position: relative;

    max-width: 800px;

    margin: 0 auto 65px;

}


.utk-vm-label {

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    margin-bottom: 17px;

    color: var(--utk-red);

    font-family: "Mulish", sans-serif;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2.5px;

}


.utk-vm-label span {

    width: 35px;

    height: 2px;

    background: var(--utk-red);

}


.utk-vm-heading h2 {

    margin: 0;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: clamp(38px, 4vw, 56px);

    line-height: 1.08;

    letter-spacing: -1.5px;

    font-weight: 800;

}


.utk-vm-heading h2 strong {

    color: var(--utk-red);

    font-weight: 800;

}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.utk-vm-layout {

    position: relative;

    display: grid;

    grid-template-columns: 1fr 220px 1fr;

    align-items: center;

    gap: 35px;

}


/* =========================================================
   VISION / MISSION BOX
========================================================= */

.utk-vm-box {

    position: relative;

    min-height: 300px;

    display: flex;

    align-items: flex-start;

    gap: 22px;

    padding: 38px 35px;

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

    border: 1px solid rgba(126,31,40,.12);

    border-radius: 15px;

    box-shadow:
        0 15px 45px rgba(7,20,38,.07);

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}


.utk-vm-box:hover {

    transform: translateY(-6px);

    box-shadow:
        0 25px 55px rgba(7,20,38,.11);

}


/* =========================================================
   LEFT RED ACCENT
========================================================= */

.utk-vm-left {

    border-top: 4px solid var(--utk-red);

}


.utk-vm-right {

    border-top: 4px solid var(--utk-red);

}


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

.utk-vm-box-icon {

    flex: 0 0 58px;

    width: 58px;

    height: 58px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--utk-red);

    background: #fff;

    border: 1px solid rgba(126,31,40,.25);

    border-radius: 50%;

    font-size: 25px;

}


.utk-vm-box:hover .utk-vm-box-icon {

    color: #ffffff;

    background: var(--utk-red);

}


/* =========================================================
   BOX CONTENT
========================================================= */

.utk-vm-box-content {

    flex: 1;

}


.utk-vm-box-label {

    margin-bottom: 12px;

    color: var(--utk-red);

    font-family: "Mulish", sans-serif;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;

}


.utk-vm-box h3 {

    margin: 0 0 18px;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: 27px;

    line-height: 1.25;

    font-weight: 800;

}


.utk-vm-box h3 span {

    color: var(--utk-red);

}


.utk-vm-box p {

    margin: 0;

    color: #69717b;

    font-family: "Mulish", sans-serif;

    font-size: 14px;

    line-height: 1.8;

}


/* =========================================================
   CENTER AREA
========================================================= */

/* =========================================================
   CENTER BRAND MARK
========================================================= */

.utk-vm-center {

    position: relative;

    width: 220px;

    height: 220px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: auto;

}


/* =========================================================
   OUTER RING
========================================================= */

.utk-vm-center-ring {

    position: absolute;

    inset: 10px;

    border: 1px solid rgba(126, 31, 40, .35);

    border-radius: 50%;

}


/* =========================================================
   SECOND RING
========================================================= */

.utk-vm-center-ring::before {

    content: "";

    position: absolute;

    inset: 9px;

    border: 1px solid rgba(126, 31, 40, .12);

    border-radius: 50%;

}


/* =========================================================
   LOGO CIRCLE
========================================================= */

.utk-vm-logo-circle {

    position: relative;

    z-index: 5;

    width: 145px;

    height: 145px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 20px;

    background: #ffffff;

    border: 2px solid var(--utk-red);

    border-radius: 50%;

    box-shadow:
        0 12px 35px rgba(7, 20, 38, .13);

}


/* =========================================================
   LOGO
========================================================= */

.utk-vm-logo-circle img {

    width: 100%;

    height: 100%;

    object-fit: contain;

    display: block;

}


/* =========================================================
   RING DOTS
========================================================= */

.utk-vm-ring-dot {

    position: absolute;

    width: 7px;

    height: 7px;

    background: var(--utk-red);

    border: 2px solid #ffffff;

    border-radius: 50%;

    z-index: 6;

}


/* TOP */

.utk-vm-dot-top {

    top: -3px;

    left: 50%;

    transform: translateX(-50%);

}


/* RIGHT */

.utk-vm-dot-right {

    right: -3px;

    top: 50%;

    transform: translateY(-50%);

}


/* BOTTOM */

.utk-vm-dot-bottom {

    bottom: -3px;

    left: 50%;

    transform: translateX(-50%);

}


/* LEFT */

.utk-vm-dot-left {

    left: -3px;

    top: 50%;

    transform: translateY(-50%);

}


/* =========================================================
   BOTTOM STATEMENT
========================================================= */

.utk-vm-bottom {

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 20px;

    margin-top: 55px;

}


.utk-vm-bottom > span {

    width: 80px;

    height: 1px;

    background: #d8d8d8;

}


.utk-vm-bottom p {

    display: flex;

    align-items: center;

    gap: 12px;

    margin: 0;

}


.utk-vm-bottom p strong {

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: 16px;

    font-weight: 800;

}


.utk-vm-bottom p b {

    color: var(--utk-red);

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .utk-vm-layout {

        grid-template-columns:
            1fr 180px 1fr;

        gap: 20px;

    }


    .utk-vm-center {

        width: 180px;

        height: 180px;

    }


    .utk-vm-logo-circle {

        width: 125px;

        height: 125px;

    }


    .orbit-one {

        width: 160px;

        height: 160px;

    }


    .orbit-two {

        width: 175px;

        height: 125px;

    }


    .utk-vm-box {

        padding: 30px 25px;

    }


    .utk-vm-box h3 {

        font-size: 24px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991.98px) {

    .utk-vm-section {

        padding: 80px 0;

    }


    .utk-vm-layout {

        display: flex;

        flex-direction: column;

        gap: 25px;

    }


    .utk-vm-box {

        width: 100%;

        min-height: auto;

    }


    .utk-vm-center {

        order: -1;

        width: 190px;

        height: 190px;

        margin-bottom: 10px;

    }


    .utk-vm-logo-circle {

        width: 125px;

        height: 125px;

    }


    .orbit-one {

        width: 165px;

        height: 165px;

    }


    .orbit-two {

        width: 180px;

        height: 125px;

    }


    .utk-vm-heading {

        margin-bottom: 45px;

    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .utk-vm-section {

        padding: 65px 0;

    }


    .utk-vm-heading h2 {

        font-size: 34px;

    }


    .utk-vm-label {

        font-size: 10px;

    }


    .utk-vm-box {

        display: block;

        padding: 28px 22px;

    }


    .utk-vm-box-icon {

        margin-bottom: 20px;

    }


    .utk-vm-box h3 {

        font-size: 23px;

    }


    .utk-vm-box p {

        font-size: 13px;

    }


    .utk-vm-bottom {

        gap: 10px;

    }


    .utk-vm-bottom > span {

        width: 25px;

    }


    .utk-vm-bottom p {

        gap: 7px;

        flex-wrap: wrap;

        justify-content: center;

    }


    .utk-vm-bottom p strong {

        font-size: 14px;

    }

}





/* =========================================================
   CONSUMER LIGHTING HERO
========================================================= */

.utk-consumer-hero {

    --utk-red: #7e1f28;
    --utk-red-dark: #65161e;
    --utk-navy: #071426;

    position: relative;

    padding: 45px 0;

    min-height: 540px;

    display: flex;

    align-items: center;

    background: #ffffff;

    overflow: hidden;

}


/* =========================================================
   RED CORNER
========================================================= */

.utk-consumer-hero-corner {

    position: absolute;

    top: -120px;

    right: -100px;

    width: 270px;

    height: 270px;

    background: var(--utk-red);

    border-radius: 0 0 0 100%;

    z-index: 1;

}


/* =========================================================
   CONTAINER
========================================================= */

.utk-consumer-hero .container {

    position: relative;

    z-index: 3;

}


/* =========================================================
   LEFT CONTENT
========================================================= */

.utk-consumer-hero-content {

    padding: 50px 0 45px;

}


/* =========================================================
   LABEL
========================================================= */

.utk-consumer-label {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-bottom: 20px;

    color: var(--utk-red);

    font-family: "Mulish", sans-serif;

    font-size: 13px;

    font-weight: 800;

    letter-spacing: 1.8px;

}


.utk-consumer-label span {

    width: 32px;

    height: 2px;

    background: var(--utk-red);

}


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

.utk-consumer-hero h1 {

    max-width: 600px;

    margin: 0;

    color: var(--utk-navy);

    font-family: "Urbanist", sans-serif;

    font-size: clamp(48px, 5vw, 70px);

    line-height: .98;

    letter-spacing: -2px;

    font-weight: 800;

    text-transform: uppercase;

}


.utk-consumer-hero h1 strong {

    display: block;

    margin-top: 5px;

    color: var(--utk-red);

    font-weight: 800;

}


/* =========================================================
   DESCRIPTION
========================================================= */

.utk-consumer-description {

    max-width: 540px;

    margin: 28px 0 30px;

    color: #505966;

    font-family: "Mulish", sans-serif;

    font-size: 14px;

    line-height: 1.75;

}


/* =========================================================
   FEATURES
========================================================= */

.utk-consumer-features {

    display: grid;

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

    max-width: 590px;

    border-top: 1px solid #e4e5e7;

    border-bottom: 1px solid #e4e5e7;

}


.utk-consumer-feature {

    position: relative;

    min-height: 105px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 12px 8px;

    text-align: center;

}


.utk-consumer-feature:not(:last-child)::after {

    content: "";

    position: absolute;

    top: 20px;

    right: 0;

    width: 1px;

    height: 65px;

    background: #dddddd;

}


/* =========================================================
   FEATURE ICON
========================================================= */

.utk-consumer-feature-icon {

    width: 63px;

    height: 63px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 8px;

    color: var(--utk-red);

    border: 1.5px solid rgba(126,31,40,.35);

    border-radius: 50%;

    font-size: 20px;

}


.utk-consumer-feature h6 {

    margin: 0;

    color: var(--utk-navy);

    font-family: "Mulish", sans-serif;

    font-size: 15px;

    line-height: 1.25;

    font-weight: 800;

}


.utk-consumer-feature span {

    margin-top: 3px;

    color: #72777e;

    font-family: "Mulish", sans-serif;

    font-size: 13px;

    line-height: 1.3;

}


/* =========================================================
   RIGHT VISUAL
========================================================= */

.utk-consumer-hero-visual {

    position: relative;

    min-height: 540px;

    display: flex;

    align-items: center;

    justify-content: center;

}


/* =========================================================
   SUBTLE CIRCLE
========================================================= */

.utk-consumer-product-bg {

    position: absolute;

    width: 520px;

    height: 520px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            #f5f6f7 0%,
            #f5f6f7 58%,
            transparent 59%
        );

}


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

.utk-consumer-product-image {

    position: relative;

    z-index: 3;

    width: 100%;

    max-width: 700px;

    height: auto;

    object-fit: contain;

    display: block;

    filter:
        drop-shadow(
            0 22px 25px
            rgba(7,20,38,.13)
        );

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .utk-consumer-hero {

        min-height: 550px;

    }

    .utk-consumer-hero h1 {

        font-size: 55px;

    }

    .utk-consumer-product-bg {

        width: 450px;

        height: 450px;

    }

}


/* =========================================================
   MOBILE / TABLET
========================================================= */

@media (max-width: 991.98px) {

    .utk-consumer-hero {

        padding: 70px 0 30px;

    }

    .utk-consumer-hero-content {

        padding: 20px 0 0;

    }

    .utk-consumer-hero h1 {

        font-size: clamp(
            42px,
            8vw,
            58px
        );

    }

    .utk-consumer-description {

        max-width: 650px;

    }

    .utk-consumer-hero-visual {

        min-height: 400px;

        margin-top: 20px;

    }

    .utk-consumer-product-bg {

        width: 400px;

        height: 400px;

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .utk-consumer-hero {

        padding: 55px 0 20px;

    }

    .utk-consumer-label {

        font-size: 11px;

    }

    .utk-consumer-hero h1 {

        font-size: 40px;

        letter-spacing: -1px;

    }

    .utk-consumer-description {

        font-size: 13px;

        line-height: 1.7;

    }

    .utk-consumer-features {

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

    }

    .utk-consumer-feature {

        min-height: 100px;

    }

    .utk-consumer-feature:nth-child(2)::after {

        display: none;

    }

    .utk-consumer-feature:nth-child(1),
    .utk-consumer-feature:nth-child(2) {

        border-bottom: 1px solid #e4e5e7;

    }

    .utk-consumer-feature:nth-child(3)::after {

        display: block;

    }

    .utk-consumer-hero-visual {

        min-height: 300px;

    }

    .utk-consumer-product-bg {

        width: 300px;

        height: 300px;

    }

    .utk-consumer-product-image {

        width: 105%;

    }

    .utk-consumer-hero-corner {

        width: 160px;

        height: 160px;

        top: -70px;

        right: -70px;

    }

}



/* =========================================================
   MAIN WRAPPER
========================================================= */

.utk-consumer-products {

    width: 100%;

    background: #ffffff;

    color: var(--utk-navy);

    overflow: hidden;
}


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

.utk-product-category-section {

    padding: 45px 0;

    border-top: 1px solid #e3e3e3;
}


.utk-product-category-section .container {

    max-width: 1450px;

}


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

.utk-product-category-title {

    display: inline-flex;

    align-items: stretch;

    margin-bottom: 45px;

    position: relative;

}


/* NUMBER */

.utk-product-category-number {

    width: 72px;

    height: 55px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

    background: var(--utk-red);

    color: #ffffff;

    font-size: 22px;

    font-weight: 800;

    line-height: 1;

}


/* TITLE */

.utk-product-category-name {

    height: 55px;

    display: flex;

    align-items: center;

    padding: 0 55px 0 24px;

    background: var(--utk-navy);

    color: #ffffff;

    font-size: 18px;

    font-weight: 800;

    letter-spacing: .5px;

    white-space: nowrap;

    position: relative;

}


/*
    ANGLED END
    Only the right end is angled.
    Number + title remain continuous.
*/

.utk-product-category-name::after {

    content: "";

    position: absolute;

    top: 0;

    right: -24px;

    width: 48px;

    height: 55px;

    background: var(--utk-navy);

    clip-path: polygon(
        48% 0,
        100% 0,
        72% 100%,
        0 100%
    );

}


/* =========================================================
   PRODUCT ROW
========================================================= */

.utk-product-row {

    padding: 38px 0;

    border-bottom: 1px dotted #c7c7c7;

}


.utk-product-row:last-child {

    border-bottom: none;

}


/* =========================================================
   PRODUCT NAME
========================================================= */

.utk-product-name {

    margin: 0 0 24px;

    color: var(--utk-navy);

    font-size: 21px;

    font-weight: 800;

    line-height: 1.3;

}


/* Small red line */

.utk-product-name::after {

    content: "";

    display: block;

    width: 45px;

    height: 3px;

    margin-top: 9px;

    background: var(--utk-red);

}


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

.utk-product-content {

    display: grid;

    grid-template-columns: 38% 62%;

    gap: 50px;

    align-items: center;

}


/* =========================================================
   IMAGE AREA
========================================================= */

.utk-product-image {

    width: 100%;

    height: 315px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 15px;

    background: #fafafa;

    border: 1px solid #eeeeee;

}


.utk-product-image img {

    width: 100%;

    height: 285px;

    max-width: 420px;

    object-fit: contain;

    display: block;

}


/* =========================================================
   PRODUCT DETAILS
========================================================= */

.utk-product-details {

    width: 100%;

}


/* =========================================================
   TABLE
========================================================= */

.utk-product-table {

    width: 100%;

    margin: 0 0 25px;

    border-collapse: collapse;

    table-layout: fixed;

}


.utk-product-table thead th {

    padding: 12px 8px;

    background: var(--utk-red);

    color: #ffffff;

    border: 1px solid #ffffff;

    text-align: center;

    font-size: 13px;

    font-weight: 700;

    line-height: 1.35;

}


.utk-product-table tbody td {

    padding: 11px 8px;

    background: #ffffff;

    color: #25292e;

    border: 1px solid #c8c8c8;

    text-align: center;

    font-size: 14px;

    font-weight: 500;

    line-height: 1.4;

}


.utk-product-table tbody tr:nth-child(even) td {

    background: #fafafa;

}


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

.utk-product-spec-title {

    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 13px;

    color: var(--utk-red);

    font-size: 17px;

    font-weight: 800;

}


.utk-product-spec-title::before {

    content: "";

    width: 4px;

    height: 20px;

    background: var(--utk-red);

}


/* =========================================================
   SPECIFICATIONS
========================================================= */

.utk-product-specs {

    margin: 0;

    padding: 0;

    list-style: none;

    display: grid;

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

    column-gap: 30px;

    row-gap: 9px;

}


.utk-product-specs li {

    position: relative;

    padding-left: 18px;

    color: #30343a;

    font-size: 14px;

    line-height: 1.55;

}


.utk-product-specs li::before {

    content: "•";

    position: absolute;

    left: 0;

    top: 0;

    color: var(--utk-red);

    font-size: 19px;

    font-weight: 900;

}


/* =========================================================
   PRODUCT NOTE
========================================================= */

.utk-product-note {

    margin-top: 18px;

    padding: 12px 15px;

    background: #fafafa;

    border-left: 3px solid var(--utk-red);

    color: #555b62;

    font-size: 13px;

    line-height: 1.5;

}


/* =========================================================
   PANEL LIGHTS
========================================================= */

.utk-panel-product-image {

    width: 100%;

    height: 315px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 15px;

    background: #fafafa;

    border: 1px solid #eeeeee;

}


.utk-panel-product-image img {

    width: 100%;

    height: 285px;

    max-width: 420px;

    object-fit: contain;

}


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

.utk-category-intro {

    max-width: 850px;

    margin: -15px 0 35px;

    color: #62666b;

    font-size: 14px;

    line-height: 1.7;

}


/* =========================================================
   DESKTOP LARGE
========================================================= */

@media (min-width: 1400px) {

    .utk-product-content {

        grid-template-columns: 36% 64%;

        gap: 65px;

    }


    .utk-product-image,
    .utk-panel-product-image {

        height: 335px;

    }


    .utk-product-image img,
    .utk-panel-product-image img {

        height: 305px;

        max-width: 450px;

    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1199.98px) {

    .utk-product-content {

        grid-template-columns: 40% 60%;

        gap: 30px;

    }


    .utk-product-image,
    .utk-panel-product-image {

        height: 280px;

    }


    .utk-product-image img,
    .utk-panel-product-image img {

        height: 250px;

    }


    .utk-product-specs {

        grid-template-columns: 1fr;

    }

}


/* =========================================================
   SMALL TABLET
========================================================= */

@media (max-width: 991.98px) {

    .utk-product-category-section {

        padding: 55px 0;

    }


    .utk-product-content {

        grid-template-columns: 1fr;

        gap: 30px;

    }


    .utk-product-image,
    .utk-panel-product-image {

        height: 320px;

    }


    .utk-product-image img,
    .utk-panel-product-image img {

        height: 290px;

        max-width: 450px;

    }


    .utk-product-specs {

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

    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575.98px) {

    .utk-product-category-section {

        padding: 42px 15px;

    }


    .utk-product-category-title {

        max-width: calc(100% - 25px);

        margin-bottom: 32px;

    }


    .utk-product-category-number {

        width: 55px;

        height: 45px;

        font-size: 18px;

    }


    .utk-product-category-name {

        height: 45px;

        padding: 0 30px 0 15px;

        font-size: 14px;

    }


    .utk-product-category-name::after {

        right: -22px;

        height: 45px;

    }


    .utk-product-row {

        padding: 30px 0;

    }


    .utk-product-name {

        font-size: 18px;

        margin-bottom: 18px;

    }


    .utk-product-content {

        gap: 22px;

    }


    .utk-product-image,
    .utk-panel-product-image {

        height: 245px;

    }


    .utk-product-image img,
    .utk-panel-product-image img {

        height: 220px;

    }


    .utk-product-table {

        margin-bottom: 20px;

    }


    .utk-product-table thead th {

        padding: 9px 4px;

        font-size: 10px;

    }


    .utk-product-table tbody td {

        padding: 9px 4px;

        font-size: 11px;

    }


    .utk-product-spec-title {

        font-size: 15px;

    }


    .utk-product-specs {

        grid-template-columns: 1fr;

        row-gap: 8px;

    }


    .utk-product-specs li {

        font-size: 13px;

    }


    .utk-product-note {

        font-size: 12px;

    }

}


/* =========================================================
   INDUSTRIES PAGE CUSTOM STYLES
========================================================= */

.utk-ind-hero {
    position: relative;
    padding: 70px 0 60px;
    background: linear-gradient(135deg, #fcf8f8 0%, #ffffff 100%);
    border-bottom: 1px solid var(--utk-border);
    overflow: hidden;
}

.utk-ind-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    background: rgba(126, 31, 40, 0.08);
    color: var(--utk-red);
    font-family: "Urbanist", sans-serif;
    font-size: 13px;
    font-weight: 700;
    border-radius: 30px;
    letter-spacing: 1px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.utk-ind-hero h1 {
    font-family: "Urbanist", sans-serif;
    font-size: clamp(36px, 4.5vw, 56px);
    font-weight: 800;
    color: var(--utk-navy);
    line-height: 1.15;
    margin-bottom: 20px;
}

.utk-ind-hero h1 span {
    color: var(--utk-red);
}

.utk-ind-hero p {
    font-family: "Mulish", sans-serif;
    font-size: 16px;
    color: #555555;
    line-height: 1.8;
    max-width: 650px;
    margin-bottom: 30px;
}

.utk-ind-stats-row {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    margin-top: 20px;
}

.utk-ind-stat-item {
    display: flex;
    align-items: center;
    gap: 12px;
}

.utk-ind-stat-icon {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: var(--utk-red);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.utk-ind-stat-text strong {
    display: block;
    font-family: "Urbanist", sans-serif;
    font-size: 18px;
    color: var(--utk-navy);
    font-weight: 800;
    line-height: 1.2;
}

.utk-ind-stat-text span {
    font-family: "Mulish", sans-serif;
    font-size: 13px;
    color: #777;
}

/* --- SECTOR GRID CARDS --- */
.utk-ind-grid-section {
    padding: 85px 0 70px;
    background: #fdfdfd;
}

.utk-ind-section-header {
    text-align: center;
    max-width: 750px;
    margin: 0 auto 55px;
}

.utk-ind-section-tag {
    display: inline-block;
    color: var(--utk-red);
    font-family: "Urbanist", sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.utk-ind-section-title {
    font-family: "Urbanist", sans-serif;
    font-size: clamp(28px, 3.5vw, 42px);
    font-weight: 800;
    color: var(--utk-navy);
    line-height: 1.2;
    margin-bottom: 15px;
}

.utk-ind-section-desc {
    font-family: "Mulish", sans-serif;
    font-size: 15px;
    color: #666;
    line-height: 1.7;
}

.utk-ind-card {
    position: relative;
    background: #ffffff;
    border: 1px solid #eef0f3;
    border-radius: 16px;
    padding: 35px 30px;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    overflow: hidden;
}

.utk-ind-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: transparent;
    transition: background 0.3s ease;
}

.utk-ind-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(126, 31, 40, 0.12);
    border-color: rgba(126, 31, 40, 0.2);
}

.utk-ind-card:hover::before {
    background: linear-gradient(90deg, var(--utk-red) 0%, #b8323f 100%);
}

.utk-ind-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}

.utk-ind-card-num {
    font-family: "Urbanist", sans-serif;
    font-size: 15px;
    font-weight: 800;
    color: var(--utk-red);
    background: rgba(126, 31, 40, 0.08);
    padding: 5px 14px;
    border-radius: 20px;
}

.utk-ind-card-icon {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    background: #f8f9fa;
    color: var(--utk-navy);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    transition: all 0.3s ease;
}

.utk-ind-card:hover .utk-ind-card-icon {
    background: var(--utk-red);
    color: #ffffff;
    transform: scale(1.08);
}

.utk-ind-card-title {
    font-family: "Urbanist", sans-serif;
    font-size: 24px;
    font-weight: 800;
    color: var(--utk-navy);
    margin-bottom: 8px;
}

.utk-ind-card-subtitle {
    font-family: "Mulish", sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: var(--utk-red);
    margin-bottom: 15px;
}

.utk-ind-card-desc {
    font-family: "Mulish", sans-serif;
    font-size: 14px;
    color: #666;
    line-height: 1.75;
    margin-bottom: 22px;
    flex-grow: 1;
}

.utk-ind-apps-title {
    font-family: "Urbanist", sans-serif;
    font-size: 13px;
    font-weight: 800;
    color: var(--utk-navy);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 10px;
}

.utk-ind-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 22px;
}

.utk-ind-pill {
    font-family: "Mulish", sans-serif;
    font-size: 12px;
    font-weight: 600;
    color: #444;
    background: #f1f3f6;
    padding: 4px 12px;
    border-radius: 6px;
    transition: background 0.2s ease;
}

.utk-ind-card:hover .utk-ind-pill {
    background: #eaf0f8;
    color: var(--utk-navy);
}

.utk-ind-specs-list {
    list-style: none;
    padding: 0;
    margin: 0 0 25px 0;
    border-top: 1px dashed #e5e7eb;
    padding-top: 15px;
}

.utk-ind-specs-list li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: "Mulish", sans-serif;
    font-size: 13px;
    color: #555;
    margin-bottom: 6px;
}

.utk-ind-specs-list li i {
    color: #28a745;
    font-size: 14px;
}

.utk-ind-card-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 12px;
    background: #f8f9fa;
    color: var(--utk-navy);
    font-family: "Urbanist", sans-serif;
    font-size: 14px;
    font-weight: 700;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid #e0e0e0;
}

.utk-ind-card-btn:hover {
    background: var(--utk-red);
    color: #ffffff;
    border-color: var(--utk-red);
}

/* --- NEW FRESH & UNIQUE VALUE PROPOSITION SHOWCASE --- */
.utk-vp-section {
    position: relative;
    padding: 100px 0;
    background: #06111e;
    background-image: 
        radial-gradient(circle at 15% 20%, rgba(126, 31, 40, 0.18) 0%, transparent 45%),
        radial-gradient(circle at 85% 80%, rgba(7, 20, 38, 0.9) 0%, transparent 50%);
    color: #ffffff;
    overflow: hidden;
}

.utk-vp-header {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 65px;
}

.utk-vp-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 20px;
    background: rgba(126, 31, 40, 0.18);
    border: 1px solid rgba(220, 53, 69, 0.35);
    border-radius: 30px;
    color: #ff4d5a;
    font-family: "Urbanist", sans-serif;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.utk-vp-title {
    font-family: "Urbanist", sans-serif;
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 800;
    color: #ffffff;
    line-height: 1.18;
    margin-bottom: 18px;
}

.utk-vp-title span {
    background: linear-gradient(135deg, #ffffff 0%, #d9b8bb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.utk-vp-desc {
    font-family: "Mulish", sans-serif;
    font-size: 16px;
    color: #94a3b8;
    line-height: 1.75;
    margin: 0;
}

/* VP CARDS */
.utk-vp-card {
    position: relative;
    background: linear-gradient(145deg, #0e1a2b 0%, #0a1322 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    padding: 38px 32px 34px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.utk-vp-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: transparent;
    transition: background 0.4s ease;
}

.utk-vp-card:hover {
    transform: translateY(-8px);
    border-color: rgba(220, 53, 69, 0.45);
    box-shadow: 0 25px 50px rgba(126, 31, 40, 0.22);
}

.utk-vp-card:hover::before,
.utk-vp-card.active::before {
    background: linear-gradient(90deg, #7e1f28 0%, #ff4d5a 100%);
}

.utk-vp-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 25px;
}

.utk-vp-icon-box {
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: linear-gradient(135deg, #7e1f28 0%, #9e2331 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    box-shadow: 0 10px 25px rgba(126, 31, 40, 0.35);
    transition: all 0.35s ease;
}

.utk-vp-card:hover .utk-vp-icon-box {
    transform: scale(1.08) rotate(-3deg);
    box-shadow: 0 12px 30px rgba(220, 53, 69, 0.5);
}

.utk-vp-tag {
    font-family: "Urbanist", sans-serif;
    font-size: 12px;
    font-weight: 800;
    color: #8f9cae;
    background: rgba(255, 255, 255, 0.05);
    padding: 5px 14px;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.utk-vp-card h4 {
    font-family: "Urbanist", sans-serif;
    font-size: 24px;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 12px;
    transition: color 0.3s ease;
}

.utk-vp-card:hover h4 {
    color: #ffffff;
}

.utk-vp-card-text {
    font-family: "Mulish", sans-serif;
    font-size: 14.5px;
    color: #94a3b8;
    line-height: 1.75;
    margin-bottom: 20px;
}

.utk-vp-bullets {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
    padding-top: 18px;
}

.utk-vp-bullets li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: "Mulish", sans-serif;
    font-size: 13.5px;
    color: #cbd5e1;
    margin-bottom: 8px;
    font-weight: 600;
}

.utk-vp-bullets li i {
    color: #ff4d5a;
    font-size: 14px;
}

/* BOTTOM METRIC BANNER */
.utk-vp-banner {
    margin-top: 60px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    padding: 28px 35px;
}

.utk-vp-stat-num {
    font-family: "Urbanist", sans-serif;
    font-size: 32px;
    font-weight: 800;
    color: #ff4d5a;
    line-height: 1;
    margin-bottom: 4px;
}

.utk-vp-stat-label {
    font-family: "Mulish", sans-serif;
    font-size: 13px;
    color: #94a3b8;
    font-weight: 600;
}

/* --- CTA BANNER --- */
.utk-ind-cta-banner {
    position: relative;
    padding: 45px 0;
    background: linear-gradient(135deg, var(--utk-red) 0%, var(--utk-red-dark) 100%);
    color: #ffffff;
    overflow: hidden;
}

.utk-ind-cta-content h2 {
    font-family: "Urbanist", sans-serif;
    font-size: clamp(28px, 3.5vw, 42px);
    font-weight: 800;
    margin-bottom: 15px;
    color: #ffffff;
}

.utk-ind-cta-content p {
    font-family: "Mulish", sans-serif;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.9);
    max-width: 650px;
    margin-bottom: 0;
    line-height: 1.7;
}

.utk-ind-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: #ffffff;
    color: var(--utk-red);
    font-family: "Urbanist", sans-serif;
    font-size: 15px;
    font-weight: 800;
    border-radius: 8px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}

.utk-ind-cta-btn:hover {
    background: var(--utk-navy);
    color: #ffffff;
    transform: translateY(-2px);
}

/* --- FLOATING BLUEPRINT OVERLAY --- */
.utk-blueprint-overlay {
    position: absolute;
    bottom: 8px;
    right: 8px;
    z-index: 10;
    width: 105px;
    background: rgba(255, 255, 255, 0.94);
    /* border: 1px solid rgba(220, 38, 38, 0.25); */
    border-radius: 8px;
    /* padding: 6px; */
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease, border-color 0.3s ease;
    cursor: pointer;
}

.utk-blueprint-overlay:hover {
    transform: scale(1.18) translateY(-4px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
    /* border-color: var(--utk-red, #d32f2f); */
    background: #ffffff;
}

.utk-blueprint-badge-header {
    font-family: "Urbanist", sans-serif;
    font-size: 9px;
    font-weight: 700;
    color: #1e293b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.utk-blueprint-badge-header i {
    font-size: 10px;
    color: var(--utk-red, #d32f2f);
}

.utk-blueprint-overlay img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 4px;
    object-fit: contain;
    background: #ffffff;
    border: 1px solid #f1f5f9;
}





        /* ===== Fixed WhatsApp Float Button ===== */
        .vk-whatsapp-float {
            position: fixed;
            bottom: 28px;
            right: 28px;
            width: 60px;
            height: 60px;
            background: linear-gradient(135deg, #25d366, #128c7e);
            color: #ffffff !important;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 32px;
            box-shadow: 0 8px 24px rgba(37, 211, 102, 0.4), 0 4px 12px rgba(0, 0, 0, 0.15);
            z-index: 9999;
            text-decoration: none;
            transition: all 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
            animation: vkWaPulse 2.5s infinite;
        }

        .vk-whatsapp-float:hover {
            transform: scale(1.12) translateY(-4px);
            box-shadow: 0 14px 30px rgba(37, 211, 102, 0.55), 0 6px 16px rgba(0, 0, 0, 0.2);
            color: #ffffff !important;
        }

        .vk-whatsapp-tooltip {
            position: absolute;
            right: 70px;
            background: #111827;
            color: #ffffff;
            font-size: 13px;
            font-weight: 600;
            padding: 6px 14px;
            border-radius: 20px;
            white-space: nowrap;
            opacity: 0;
            visibility: hidden;
            transform: translateX(10px);
            transition: all 0.3s ease;
            pointer-events: none;
            box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
        }

        .vk-whatsapp-tooltip::after {
            content: "";
            position: absolute;
            top: 50%;
            right: -6px;
            transform: translateY(-50%);
            border-width: 6px 0 6px 6px;
            border-style: solid;
            border-color: transparent transparent transparent #111827;
        }

        .vk-whatsapp-float:hover .vk-whatsapp-tooltip {
            opacity: 1;
            visibility: visible;
            transform: translateX(0);
        }

        @keyframes vkWaPulse {
            0% {
                box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.6), 0 8px 24px rgba(37, 211, 102, 0.3);
            }
            70% {
                box-shadow: 0 0 0 16px rgba(37, 211, 102, 0), 0 8px 24px rgba(37, 211, 102, 0.3);
            }
            100% {
                box-shadow: 0 0 0 0 rgba(37, 211, 102, 0), 0 8px 24px rgba(37, 211, 102, 0.3);
            }
        }

        @media (max-width: 576px) {
            .vk-whatsapp-float {
                bottom: 20px;
                right: 20px;
                width: 52px;
                height: 52px;
                font-size: 28px;
            }
            .vk-whatsapp-tooltip {
                display: none;
            }
        }