/*!
* PT. IMAJIKU CIPTA MEDIA
* Copyright 2019-2024 IMAJIKU.
*/

/* = GENERAL
-------------------------------------------------------------*/
.bg-gray-light {
    background-color: #F4F5F6;
}

.hc-article-note h1,
.hc-article-note h2,
.hc-article-note h3,
.hc-article-note h4,
.hc-article-note h5 {
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--hc-color-text-head);
}

[data-aspect-ratio] {
    background-color: transparent;
}

.hc-heading-white .hc-heading-title {
    background: linear-gradient(90deg, rgb(255 255 255) 0%, rgb(149 151 155) 75%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hc-heading-white .hc-heading-desc {
    color: var(--hc-color-gray-300);
}

/* = HERO
-------------------------------------------------------------*/
.hero-intro-box .hero-caption-box {
    justify-content: flex-end;
}

.hero-intro-box .hero-caption {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: 15px;
    max-width: unset;
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border-radius: 20px;
    border: 1px solid rgb(255 255 255 / 30%);
    padding: 25px 25px 50px;
    backdrop-filter: blur(3px);
    margin-bottom: 30px;
}

.home-hero-slider.swslider-box .swiper-button-next,
.home-hero-slider.swslider-box .swiper-button-prev {
    display: none;
}

.swslider-box .swiper-pagination-bullet-active {
    background-color: var(--hc-color-secondary);
}

.swiper-pagination-bullet {
    background-color: var(--hc-color-white);
    border: 1px solid var(--hc-color-secondary);
    opacity: 1;
}

.home-hero-slider .swiper-slide,
.home-hero-slider .swiper-wrapper {
    margin-bottom: 0;
}

.home-hero-slider .swiper-pagination {
    display: block;
    padding: 0px 20px;
    text-align: left;
    left: 20px;
    bottom: 70px;
    position: relative;
}

.home-hero-slider .lightbox-images img,
.home-hero-slider .lightbox-video img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.home-hero-slider .lightbox-images:hover img,
.home-hero-slider .lightbox-video:hover img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    transform: scale(1.03);
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
}

/* = ABOUT
------------------------------------------------------------ */
.hc-card-feature-img {
    position: relative;
}

.hc-card-feature-img.variant-br img {
    border-radius: 20px;
    border: 1px solid var(--hc-color-gray-300);
    padding: 10px;
}

.hc-card-feature-desc {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    width: 100%;
    z-index: 1;
}

.hc-card-feature-desc h3 {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.3;
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-text-1);
    background: linear-gradient(90deg, rgba(231, 0, 11, 1) 0%, rgba(106, 114, 130, 1) 75%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hc-card-feature-desc p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.4;
    font-family: var(--hc-font-family-2);
    color: var(--hc-color-text-1);
    margin-bottom: 5px;
}

.hc-card-feature-desc.variant-big h3 {
    font-size: 36px;
    font-weight: 500;
    color: var(--hc-color-text-body);
    background: unset;
    -webkit-background-clip: unset;
    background-clip: unset;
    -webkit-text-fill-color: unset;
}

/* card icon */
.hc-card-box.hc-card-icon .hc-card {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    width: 100%;
    z-index: 1;
    gap: 10px;
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border-radius: 20px;
    border: 1px solid rgb(255 255 255 / 30%);
    padding: 20px;
    backdrop-filter: blur(4px);
}

.hc-card-box.hc-card-icon .hc-card-img img {
    width: 50px;
    height: 50px;
    object-fit: cover;
}

.hc-card-box.hc-card-icon .hc-card-content {
    padding: 10px 0;
}

.hc-card-box.hc-card-icon .hc-card-title h3 {
    color: var(--hc-color-white);
    font-size: 22px;
}

.hc-card-box.hc-card-icon .hc-card-desc p {
    font-size: 18px;
    font-weight: 300;
    font-family: var(--hc-font-family-2);
    color: var(--hc-color-white);
    margin-bottom: 0;
}

/* accordion */
.collapse-mjk-item.variant-history .hc-card-feature-desc h3 {
    margin-bottom: 20px;
}

.history-link-head h3 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1.4;
    font-family: var(--hc-font-family-2);
    color: var(--hc-color-text-1);
}

.hc-card-feature-desc h4 {
    font-size: 22px;
    font-weight: 600;
    font-family: var(--hc-font-family-2);
    color: var(--hc-color-secondary);
}

.collapse-mjk-item.variant-history .collapse-mjk-head {
    min-height: unset;
}

.collapse-mjk-item.variant-history .collapse-mjk-link {
    border-top: 1px solid var(--hc-color-gray-300);
}

.collapse-mjk-item.variant-history .collapse-mjk-link[aria-expanded="false"] {
    border-bottom: none;
}

.collapse-mjk-item.variant-history .collapse-mjk-link[aria-expanded="false"] .history-link-head {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.collapse-mjk-item.variant-history .collapse-mjk-link[aria-expanded="true"] {
    opacity: 0;
    transform: translateY(-10px);
    max-height: 0;
}

.collapse-mjk-item.variant-history .collapse-mjk-link[aria-expanded="true"] .history-link-head {
    opacity: 0;
    transform: translateY(-10px);
    max-height: 0;
}

.collapse-mjk-item.variant-history .collapse-mjk-link[aria-expanded="true"] .history-link-head h3 {
    opacity: 0;
    transform: translateY(-10px);
    max-height: 0;
}

.collapse-mjk-item.variant-history .collapse-mjk-body.collapse.show {
    padding-top: 15px;
    margin-top: -30px;
    border-top: 1px solid var(--hc-color-gray-300);
}

/* = SERVICE
------------------------------------------------------------ */
.hc-heading-media {
    position: relative;
    margin-bottom: 20px;
}

.hc-heading-media img {
    max-height: 100px;
}

.hc-card-icon.variant-2 .hc-card {
    flex-direction: row;
    gap: 20px;
    padding: 10px 20px;
}

.hc-card-icon.variant-2 .hc-card-content {
    flex: 1;
}

.hc-card-icon.variant-2 .hc-card-desc p {
    color: var(--hc-color-text-1);
    font-weight: 400;
}

.hc-card-icon.variant-2 .hc-card-title h3 {
    color: var(--hc-color-text-head);
}

/* card services */
.hc-card-services .hc-card {
    position: relative;
    width: 100%;
    z-index: 1;
    gap: 10px;
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border-radius: 20px;
    border: 1px solid rgb(255 255 255 / 30%);
    padding: 20px;
    backdrop-filter: blur(4px);
}

.hc-card-services .hc-card-img img {
    --r: 22px;
    --s: 28px;
    --x: 16px;
    --y: 14px;

    width: 100%;
    aspect-ratio: 1;
    background: transparent;
    border-radius: var(--r);
    --_m: /calc(2*var(--r)) calc(2*var(--r)) radial-gradient(#000 70%, #0000 72%);
    --_g: conic-gradient(at calc(100% - var(--r)) var(--r), #0000 25%, #000 0);
    --_d: (var(--s) + var(--r));
    mask:
        calc(100% - var(--_d) - var(--x)) 0 var(--_m),
        100% calc(var(--_d) + var(--y)) var(--_m),
        radial-gradient(var(--s) at 100% 0, #0000 99%, #000 calc(100% + 1px)) calc(-1*var(--r) - var(--x)) calc(var(--r) + var(--y)),
        var(--_g) calc(-1*var(--_d) - var(--x)) 0,
        var(--_g) 0 calc(var(--_d) + var(--y));
    mask-repeat: no-repeat;
}

.hc-card-services .hc-card-action {
    position: absolute;
    top: 0;
    right: 0;
}

.hc-card-services .hc-btn {
    width: 50px;
    height: 50px;
    min-width: unset;
    background-color: transparent;
    border-radius: 14px;
}

.hc-card-services .hc-btn-icn {
    width: 30px;
    height: 30px;
}

.hc-card-services .hc-btn-icn span {
    width: 40px;
    height: 40px;
    background-color: var(--hc-color-white);
}

.hc-card-services .hc-card:hover .hc-btn {
    background: radial-gradient(circle at 50% 60%, rgb(255 137 137) 40%, rgb(255 122 0 / 55%) 100%, rgb(255 169 106 / 90%) 100%);
    box-shadow: 1px 1px 0px 0px rgb(255 169 106 / 60%), 0 10px 20px rgb(255 255 255 / 30%);
}

.hc-card-services .hc-card-content {
    padding: 15px 0 0;
}

.hc-card-title h3 {
    color: var(--hc-color-white);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hc-card-desc p {
    color: var(--hc-color-white);
    font-size: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0;
    padding-top: 10px;
}

/* = CARD
------------------------------------------------------------ */
/* card basic */
.hc-card-box {
    position: relative;
}

.hc-card-box .hc-card.hc-card-animation {
    transition: 0.6s;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.hc-card-box .hc-card.hc-card-animation:hover {
    transform: translateY(-8px);
    transition: 0.6s;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.hc-card-box .hc-card.hc-card-animation.hc-shadow:hover {
    box-shadow: 5px 10px 20px 0px rgb(0 0 0 / 10%);
}

.hc-shadow {
    backdrop-filter: blur(15px);
    box-shadow: 0px 10px 15px -3px rgb(0 0 0 / 10%);
}

.hc-card {
    background-color: var(--hc-color-white);
}

.hc-card-img {
    position: relative;
}

.hc-card-img img {
    display: block;
    width: 100%;
    height: 100%;
    transition: 0.6s;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.hc-card-content {
    position: relative;
    padding: 20px;
}

.hc-card-title h3 {
    font-family: var(--hc-font-family-2);
    font-weight: 600;
    font-size: 20px;
    line-height: 1.4;
}

.hc-card-desc p {
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.6;
}

.hc-card-desc ul li {
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.8;
}

.hc-card-tag-list li {
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.6;
}

.hc-card-tag-list {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 5px;
    flex-wrap: wrap;
    list-style: none;
    padding-left: 0px;
}

.hc-card-meta {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 10px;
    justify-content: space-between;
}

.hc-card-action {
    position: relative;
}

/* card news */
.hc-card-news {
    padding: 15px;
}

.hc-card-news .hc-card-img img {
    border-radius: 24px;
}

.hc-card-news .hc-card-content {
    padding: 20px 0;
}

.hc-card-news .hc-card-category h5 {
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-secondary);
    font-weight: 600;
    font-size: 16px;
    margin: 0;
}

.hc-card-news .hc-card-date {
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-text-1);
    font-weight: 400;
    font-size: 16px;
    margin: 0;
}

.hc-card-news .hc-card-meta {
    justify-content: flex-start;
    gap: 15px;
    align-items: center;
    margin-bottom: 10px;
}

.hc-card-news .hc-card-title h3 {
    color: var(--hc-color-text-body);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hc-card-news .hc-card-desc p {
    color: var(--hc-color-text-1);
    font-size: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* form news */
.filter-horizontal-sort-box {
    position: relative;
    margin-bottom: 20px;
}

.filter-horizontal-sort-box .filter-mjk-group {
    justify-content: space-between;
}

.filter-horizontal-sort-box .form-group,
.filter-horizontal-sort-box .hc-form-select {
    min-width: 140px;
    margin: 0;
}

.filter-horizontal-sort-box .hc-form-select-control .ts-control {
    border: 1px solid var(--hc-color-gray-400);
    padding: 10px 15px;
    font-size: 14px;
}

.filter-horizontal-sort-box .has-items .ts-control>input {
    min-width: unset;
}

/* form product */
.filter-horizontal-box {
    position: relative;
    margin-bottom: 20px;
}

.filter-horizontal-box .form-group,
.filter-horizontal-box .hc-form-select {
    min-width: 140px;
    margin: 0;
}

.filter-horizontal-box .hc-form-select-control .ts-control {
    border: 1px solid var(--hc-color-gray-400);
    padding: 10px 15px;
    font-size: 14px;
}

.filter-horizontal-box .has-items .ts-control>input {
    min-width: unset;
}

/* news detail */
.btn-back .hc-btn.variant-plain {
    justify-content: flex-start;
    color: var(--hc-color-text-body) !important;
}

.btn-back .hc-btn.variant-plain:hover {
    color: var(--hc-color-primary) !important;
}

.article-meta ul li {
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-secondary);
    font-weight: 600;
    font-size: 18px;
    margin: 0;
}

.share-network .share-network-icon-box span {
    background-color: var(--hc-color-text-1);
}

.article-post img {
    margin: 30px auto;
    display: block;
    border-radius: 24px;
}

/* = PRODUCT
------------------------------------------------------------ */
.hc-card-product .hc-card {
    background-color: #F9FAFB;
    padding: 20px;
    border-radius: 20px;
}

.hc-card-product .hc-card-img img {
    border-radius: 24px;
}

.hc-card-product .hc-card-content {
    padding: 20px 0;
}

.hc-card-product .hc-card-category h5 {
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-secondary);
    font-weight: 600;
    font-size: 16px;
    margin: 0;
}

.hc-card-product .hc-card-date {
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-text-1);
    font-weight: 400;
    font-size: 16px;
    margin: 0;
}

.hc-card-product .hc-card-meta {
    justify-content: flex-start;
    gap: 15px;
    align-items: center;
    margin-bottom: 10px;
}

.hc-card-product .hc-card-title h3 {
    color: var(--hc-color-text-body);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hc-card-product .hc-card-desc p {
    color: var(--hc-color-text-1);
    font-size: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* variant 2 */
.hc-card-product.variant-2 .hc-card-box {
    overflow: hidden;
    border-radius: 24px;
}

.hc-card-product.variant-2 .hc-card-box a {
    overflow: hidden;
    border-radius: 24px;
}

.hc-card-product.variant-2 .hc-card {
    background-color: transparent;
    padding: 0;
    border-radius: 24px;
    text-align: center;
}

.hc-card-product.variant-2 .hc-card-title h3 {
    color: var(--hc-color-white);
}

.hc-card-product.variant-2 .hc-card:hover .hc-card-title h3 {
    opacity: 0.8;
}

.hc-card-product.variant-2 .hc-card-img figure {
    border-radius: 24px;
}

.hc-card-product.variant-2 .hc-card:hover .hc-card-img img {
    transform: scale(1.03);
}

/* filter */
.filter-vertical-head {
    display: none;
}

.hc-nav-sbmenu {
    gap: 5px;
    padding-left: 10px;
}

/* 
.hc-nav-sbmenu-link {
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    color: var(--hc-color-text-1) !important;
    font-size: 18px;
    border: none;
    background: transparent;
    text-align: left;
    min-width: unset;
    padding: 15px 0;
    border-left: 2px solid transparent;
}

.hc-nav-sbmenu-link.active {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
    padding: 15px 0px 15px 15px;
    border-left: 2px solid var(--hc-color-secondary);
}

.hc-nav-sbmenu-link:hover {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
    padding: 15px 0px 15px 15px;
    border-left: 2px solid var(--hc-color-secondary);
} */

.hc-nav-sbmenu-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    color: var(--hc-color-text-1) !important;
    font-size: 18px;
    line-height: 1.2;
    min-height: 75px;
    border: none;
    text-align: left;
    min-width: unset;
    padding: 15px;
    background-color: var(--hc-color-white);
    border-radius: 6px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
}

.hc-nav-sbmenu-link.active {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
    background-color: var(--hc-color-gray-50);
}

.hc-nav-sbmenu-link:hover {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
    background-color: var(--hc-color-gray-50);
}

/* product detail */
.hc-heading-section.variant-product .hc-heading-subtitle {
    color: var(--hc-color-secondary);
}

.hc-heading-section.variant-product .hc-heading-title {
    font-size: 40px;
}

.tab-productset-desc p {
    color: var(--hc-color-text-1);
    font-size: 16px;
    margin-bottom: 5px;
}

.tab-productset-desc ul {
    margin-bottom: 5px;
}

.tab-productset-desc li {
    color: var(--hc-color-text-1);
    font-size: 16px;
    margin-bottom: 5px;
}

.productset-desc-table tr {
    border-color: transparent;
}

.productset-desc-table td {
    text-align: right;
}

.productset-desc-table th,
.productset-desc-table td {
    color: var(--hc-color-text-1);
    font-size: 16px;
    margin-bottom: 5px;
    padding: 5px 0;
    font-weight: 400;
}

.productset-desc-table table {
    margin: 0;
}

.tabs-product-detail {
    position: relative;
    border: 1px solid var(--hc-color-gray-200);
    padding: 20px;
    border-radius: 20px;
}

.tabs-product-detail .tabs-mjk-nav .nav-tabs {
    border-bottom: none;
    gap: 0;
}

.tabs-product-detail .tabs-mjk-nav .nav-tabs .nav-item {
    flex-grow: unset;
}

.tabs-product-detail .tabs-mjk-nav .nav-tabs .nav-item .nav-link-tab {
    border-bottom: 1px solid var(--hc-color-text-1);
    color: var(--hc-color-text-1);
    font-size: 18px;
    font-weight: 500;
    padding: 15px;
}

.tabs-product-detail .tabs-mjk-nav .nav-tabs .nav-item .nav-link-tab.active {
    border-bottom: 1px solid var(--hc-color-secondary);
    color: var(--hc-color-secondary);
}

.tabs-product-detail .tabs-mjk-content {
    padding: 30px 0 0;
}

/* banner dowbload */
.banner-download-box {
    position: relative;
    border: 1px solid var(--hc-color-gray-200);
    padding: 20px;
    border-radius: 20px;
}

.banner-download {
    position: relative;
    margin: 15px 0 0;
    background-color: var(--hc-color-gray-50);
    padding: 15px 20px;
    border-radius: 20px;
}

.banner-download-title h4 {
    color: var(--hc-color-text-1);
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
}

.card-download-item {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
}

.card-download-caption h4 {
    font-size: 18px;
    font-weight: 600;
    color: var(--hc-color-secondary);
}

.card-download-caption ul {
    display: flex;
    flex-direction: row;
    padding-left: 0;
    gap: 20px;
    list-style: none;
    margin: 0;
}

.card-download-caption ul li {
    color: var(--hc-color-text-1);
    font-size: 16px;
    position: relative;
}

.card-download-caption ul li:after {
    display: block;
    content: "•";
    font-size: 16px;
    color: var(--hc-color-text-1);
    position: absolute;
    top: 0px;
    right: -15px;
}

.card-download-caption ul li:last-child:after {
    display: none
}

.card-download-media {
    width: 20px;
    text-align: center;
}

.card-download-media img {
    margin-bottom: 5px;
    width: 40px;
    height: auto;
}

.card-download-media span {
    color: var(--hc-color-text-1);
}

.card-download-caption-box {
    flex: 10;
}

.card-download-action-box {
    flex: 1;
    text-align: right;
}

.card-download-action-box .hc-btn {
    min-width: unset;
}

.card-download-action-box .hc-btn-icn {
    width: 40px;
    height: 40px;
}

.card-download-action-box .hc-btn span {
    background-color: var(--hc-color-secondary);
    width: 25px;
    height: 25px;
}

/* product detail gallery */
.productset-section-content-box {
    position: relative;
    max-width: 1300px;
    margin: 0 auto;
}

.productset-section-media {
    position: relative;
    padding: 0 20px 20px;
    overflow: hidden;
}

.productset-section-media .swiper-container {
    position: relative;
    width: 100%;
    margin-bottom: 15px;
}

.productset-section-media .js-swiper-variant-thumbnail {
    width: 100%;
    height: 100%;
    padding: 0;
}

.productset-section-media .js-swiper-variant-thumbnail .swiper-wrapper .swiper-slide {
    opacity: 0.5;
    overflow: hidden;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    cursor: pointer;
}

.productset-section-media .js-swiper-variant-thumbnail .swiper-wrapper .swiper-slide:hover {
    opacity: 1;
    border: 2px solid var(--hc-color-gray-100);
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.productset-section-media .js-swiper-variant-thumbnail .swiper-wrapper .swiper-slide.swiper-slide-thumb-active {
    opacity: 1;
    border: 2px solid var(--hc-color-gray-100);
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
}

.productset-section-media .lightbox-images figure,
.productset-section-media .lightbox-video figure {
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border: 1px solid var(--hc-color-gray-50);
}

.productset-section-media .lightbox-images figure img,
.productset-section-media .lightbox-video figure img {
    background-color: var(--hc-color-gray-50);
    padding: 20px;
    border-radius: 30px;
}

.js-swiper-variant-thumbnail .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-color: var(--hc-color-gray-50);
    padding: 15px;
    border-radius: 20px;
}

.productset-section-media .swiper-button-prev {
    justify-content: flex-start;
    align-items: flex-end;
    top: auto;
    top: auto;
    bottom: -100px;
    left: 23%;
    width: auto;
}

.productset-section-media .swiper-button-next {
    justify-content: flex-end;
    align-items: flex-end;
    top: auto;
    bottom: -100px;
    left: auto;
    right: 23%;
    width: auto;
}

.productset-section-media .swiper-button-prev .nav-circle-box,
.productset-section-media .swiper-button-next .nav-circle-box {
    height: 45px;
    width: 45px;
    background-color: var(--hc-color-gray-50);
    padding: 10px;
    border-radius: 50%;
}

.productset-section-media .swiper-button-prev i,
.productset-section-media .swiper-button-next i {
    font-size: 14px;
    width: 20px;
    height: 20px;
    padding: 3px;
}

.productset-section-media .swiper-button-prev span,
.productset-section-media .swiper-button-next span {
    background-color: var(--hc-color-secondary);
}

.productset-section-media .js-swiper-variant-thumbnail {
    width: 40%;
    overflow: hidden;
    margin: 0 auto;
}

.productset-section-media .lightbox-images img,
.productset-section-media .lightbox-video img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
}

.productset-section-media .lightbox-images:hover img,
.productset-section-media .lightbox-video:hover img {
    transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    filter: brightness(80%);
    -webkit-filter: brightness(80%);
    -moz-filter: brightness(80%);
    object-fit: cover;
    transform: scale(1.01);
    -webkit-transform: scale(1.01);
    -moz-transform: scale(1.01);
}

.productset-section-media .lightbox-images:hover img,
.productset-section-media .lightbox-video:hover img {
    filter: unset;
    -webkit-filter: unset;
    -moz-filter: unset;
}

/*small version for thumbnail slider*/
.productset-section-media .hc-galightbox-icon.small {
    width: 25px;
    height: 25px;
}

.productset-section-media .galightbox-icon.small span {
    width: 12px;
    height: 12px;
}

.productset-section-media .productset-section-media .hc-galightbox-icon {
    opacity: 1;
}


/* = CONTACT
------------------------------------------------------------ */
.contact-box-info-heading {
    display: flex;
    margin-bottom: 15px;
}

.contact-box-info-heading h3 {
    font-size: 32px;
    font-weight: 600;
    line-height: 1.2;
    font-family: var(--hc-font-family-1);
    color: var(--hc-color-text-1);
    background: linear-gradient(90deg, rgba(231, 0, 11, 1) 0%, rgba(106, 114, 130, 1) 75%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.form-contact-box {
    margin-top: 0;
    background: #FAFBFB;
    padding: 20px;
    border-radius: 30px;
}

.contact-extra-info p {
    color: var(--hc-color-gray-500);
}

.contact-extra-info p a {
    color: var(--hc-color-secondary);
    text-decoration: unset;
}

.contact-extra-info p a:hover {
    color: var(--hc-color-secondary);
}

.contact-box-info-maps {
    position: relative;
    background-color: var(--grey-300);
    width: 100%;
    height: 350px;
    border-radius: 20px;
}

.contact-box-info-maps iframe {
    border: 0;
    width: 100%;
    height: 350px;
    border-radius: 20px;
}

/* form */
.ts-control .item,
.ts-dropdown [data-selectable].option {
    font-size: 14px;
}

.hc-form-control,
.hc-form-select-control .ts-control {
    border-radius: 15px;
}

.hc-input-group>.hc-form-control {
    margin-left: 5px !important;
}

.hc-form-input,
.hc-form-select {
    margin-bottom: 15px;
}

/* = CARD ICON
------------------------------------------------------------ */

.hc-card-icon.variant-3 .hc-card {
    flex-direction: column;
    gap: 10px;
    padding: 10px 20px;
    background-color: var(--hc-color-gray-200);
}

.hc-card-icon.variant-3 .hc-card-content {
    flex: 1;
}

.hc-card-icon.variant-3 .hc-card-desc p {
    color: var(--hc-color-text-1);
    font-weight: 400;
}

.hc-card-icon.variant-3 .hc-card-title h3 {
    color: var(--hc-color-text-head);
}

/* = PARTNER
------------------------------------------------------------ */
.section-partners {
    position: relative;
}

.section-partners .row {
    border: 1px solid var(--grey-200);
    border-radius: 20px;
}

.slider-partner .swiper {
    width: 100%;
    height: 100%;
}

.slider-partner .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    border-right: 1px solid var(--grey-200);
}

.slider-partner .js-swiper-variant-partner-left .swiper-slide {
    border-bottom: 1px solid var(--grey-200);
}

.slider-partner-img img {
    display: block;
    height: 160px;
    max-width: 350px;
    width: 160px;
    padding: 15px;
    object-fit: contain;
    filter: grayscale(10%);
    opacity: 0.8;
    transition: all 0.3s ease;
    filter: grayscale(100%);
}

.slider-partner-img:hover img {
    filter: grayscale(0%);
    opacity: 1;
}

.slider-partner .swiper-wrapper {
    transition-timing-function: linear !important;
}

.slider-partner {
    position: relative;
}

.slider-partner:after {
    display: block;
    content: '';
    background: linear-gradient(90deg, rgb(0 0 0 / 0%) 10% 10%, rgb(255 255 255) 90% 100%);
    width: 15%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: auto;
    bottom: auto;
    z-index: 1;
}

.slider-partner:before {
    display: block;
    content: '';
    background: linear-gradient(270deg, rgb(0 0 0 / 0%) 10% 10%, rgb(255 255 255) 90% 100%);
    width: 15%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: auto;
    z-index: 2;
}

/* = TAB PRODUCT HOME
------------------------------------------------------------ */
.hc-tab-product-box {
    position: relative;
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border-radius: 20px;
    border: 1px solid rgb(255 255 255 / 30%);
    padding: 20px;
    backdrop-filter: blur(4px);
    margin: 25px 0 10px;
}

.hc-tab-product-menu .nav-pills {
    gap: 15px;
    justify-content: center;
    align-items: center;
    margin: 20px 0 10px;
}

.hc-tab-product-menu .nav-link-pills {
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 0%) 0%) padding-box, linear-gradient(to left, rgb(255 255 255 / 0%), rgb(255 255 255 / 0%)) border-box;
    border-radius: 20px;
    border: 1px solid transparent;
    padding: 20px;
    backdrop-filter: blur(4px);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
    font-family: var(--hc-font-family-2);
    color: var(--hc-color-gray-300);
    max-width: 250px;
    transition: all 0.3s ease-in-out;
    outline: none;
}

.hc-tab-product-menu .nav-link-pills:hover {
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border: 1px solid rgb(255 255 255 / 30%);
}

.hc-tab-product-menu .nav-link-pills.active {
    background: linear-gradient(45deg, rgb(65 65 65 / 0%) 0%, rgb(255 255 255 / 10%) 50%) padding-box, linear-gradient(to left, rgb(255 255 255 / 12%), rgb(255 255 255 / 0%)) border-box;
    border: 1px solid rgb(255 255 255 / 30%);
}

/* = CARD SERVICE HOME
------------------------------------------------------------ */
.infrastructure-section-box {
    position: relative;
}

.infrastructure-content-box {
    display: flex;
    flex-direction: row;
    gap: 0px;
    flex-wrap: wrap;
    width: 100%;
    justify-content: flex-start;
}

.hc-card-infrastructure {
    width: calc((100% - 0px) / 3);
}

.hc-card-infrastructure:nth-child(odd) .hc-card {
    background: linear-gradient(180deg, rgb(159 7 18) 0%, rgba(159, 7, 18, 1) 100%);
}

.hc-card-infrastructure:nth-child(odd) .hc-card-img::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-image: url("../images/content/frame-red.png");
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
}

/* Genap (Even): Putih */
.hc-card-infrastructure:nth-child(even) .hc-card {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 1) 100%);
}

.hc-card-infrastructure:nth-child(even) .hc-card-img::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-image: url("../images/content/framewhite.png");
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
}

.hc-card-infrastructure .hc-card-content {
    position: relative;
    padding: 10px 20px;
    text-align: center;
    bottom: 0;
    width: 100%;
}

.hc-card-infrastructure .hc-card-title h3 {
    font-size: 22px;
    font-weight: 600;
    line-height: 1.4;
    font-family: var(--hc-font-family-2);
    -webkit-box-orient: unset;
    -webkit-line-clamp: unset;
    display: block;
    text-align: center;
}

.hc-card-infrastructure .hc-card-desc p {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.4;
    font-family: var(--hc-font-family-2);
    -webkit-box-orient: unset;
    -webkit-line-clamp: unset;
    display: block;
    padding: 5px 0 10px;
    text-align: center;
}


.hc-card-infrastructure:nth-child(odd) .hc-card-title h3 {
    color: var(--hc-color-white);
}

.hc-card-infrastructure:nth-child(odd) .hc-card-desc p {
    color: var(--hc-color-white);
}

.hc-card-infrastructure:nth-child(even) .hc-card-title h3 {
    color: var(--hc-color-text-body);
}

.hc-card-infrastructure:nth-child(even) .hc-card-desc p {
    color: var(--hc-color-text-body);
}

/* = EXTRA 13-04-2026
------------------------------------------------------------ */


/* ACCORDION */
.hc-accordion-item {
    width: 100%;
}

.hc-accordion-head {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
}

.hc-accordion-link:link {
    color: unset !important;
}

.hc-accordion-link {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    padding: 15px 25px 15px 0;
    position: relative;
    border: none;
    min-width: unset;
    min-height: 75px;
    border-left: 2px solid transparent;
}

.hc-accordion-link-title {
    font-size: 18px;
    color: var(--hc-color-text-1) !important;
    font-family: var(--hc-font-family-1);
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
}

.hc-accordion-link[aria-expanded="true"] {
    padding: 15px 25px 15px 15px;
    border-left: 2px solid var(--hc-color-secondary);
}

.hc-accordion-link[aria-expanded="true"] .hc-accordion-link-title {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
}

.hc-accordion-link:hover {
    padding: 15px 25px 15px 15px;
    border-left: 2px solid var(--hc-color-secondary);
}

.hc-accordion-link:hover .hc-accordion-link-title {
    color: var(--hc-color-secondary) !important;
    font-weight: 600;
}

.hc-accordion-body {
    padding: 0;
    border-bottom: 1px solid transparent;
}

.hc-accordion-content {
    padding: 5px 15px 15px;
}

/*arrow variant 1: icon plus*/
.hc-accordion-link[aria-expanded="false"]::after {
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: -0.125em;
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m19 9l-7 6l-7-6'/%3E%3C/svg%3E");
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    position: absolute;
    top: 20px;
    right: 0;
}

.hc-accordion-link[aria-expanded="true"]::after {
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: -0.125em;
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fb2c36' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m19 15l-7-6l-7 6'/%3E%3C/svg%3E");
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    position: absolute;
    top: 20px;
    right: 0;
}