﻿#filter-form {
    position: unset !important;
}

#filter-form select {
    background-color: #FAFAFA;
    border: 1px solid #CED4DA;
    border-radius: 4px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('../images/expand_more.png');
    background-repeat: no-repeat;
    background-position: right 16px center;
    cursor: pointer;
    width: calc(100% /5 - 16px * 4 / 5)
}

/* #filter-form input {
        background-color: #FAFAFA;
    border: 1px solid #CED4DA;
    width: 100%;
    background-image: url('https://kyanon.dev/wp-content/uploads/2025/03/fi-rs-search.png');
        background-repeat: no-repeat;
    background-position: right 16px center;
} */

@media (max-width: 768px) {
    #filter-form select {
        font-size: 12px !important;
    }
}

#filter-form input::placeholder {
    color: #000;
}

#filter-form select:focus,
#filter-form input:focus {
    border-color: #7A7A7A;
        border-radius: 4px;
    outline: none;
}

.hidden-search {
    display: none !important;
}

.form-filter-header:has(.hidden-search .project-filter-search) {
    margin-bottom: 0 !important;
}

.filter-custom .elementor-heading-title {
    position: absolute;
    z-index: 1;
    height: 48px;
    display: flex;
    align-items: center;
}

.filter-form-full-w .form-filter-header{
    display: block;
}

.filter-form-full-w .e-con-inner {
    gap: 0 !important;
}

.filter-custom .elementor-widget-container {
    margin-bottom: 0 !important;
}

@media(max-width:1024px ) {
    .filter-custom .elementor-widget-heading{
        min-height: 48px;
        margin-bottom: 40px;
        font-size: 28px;
     }
        
    .filter-custom #filter-form{
        justify-content: start !important;
    }
    .filter-custom.related .elementor-widget-heading{
        min-height: unset !important;
        margin-bottom: unset !important;
    }
    .filter-custom.related .elementor-heading-title {
        font-size: 28px;
    }
}

@media(max-width:768px ) {
    .filter-custom.related .elementor-widget-heading {
        min-height: 48px !important;
    }

    .see-more {
        margin-right: unset !important;
    }


}

.filter-custom #filter-form {
    justify-content: end;
}

.filter-custom #filter-form select {
    width: 180px;
}

.filter-custom .custom-button-default-container {
    display: flex;
    justify-content: end;
}



.filter-custom .e-con-inner {
    gap: 0 !important;
}

.load-more-container {
    display: flex;
    justify-content: center;
}

.load-more-button {
    color: #EF403D;
    border: none;
    display: flex;
    font-weight: 600;
    height: 48px;
    margin-top: 16px;
}

.custom-button-default {
    align-items: center;
    color: #EF403D;
    border: none;
    display: flex;
    font-weight: 600;
    height: 48px;
}

.see-more {
    margin-bottom: 25px;
    margin-right: 24px;
}

.load-more-button::after,
.custom-button-default::after {
    content: '';
    background-image: url(../images/arrow_downward.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    display: inline-block;
    margin-left: 8px;
}

.loading.load-more-button::after {
    background: none !important;
    content: none;
  }

.custom-button-default::after {
    background-image: url(../images/arrow-up-right.svg) !important;
}

.load-more-button:hover,
.custom-button-default:hover {
    opacity: 0.8;
    background-color: unset;
    color: #EF403D;
}

.load-more-button:focus,
.custom-button-default:focus {
    opacity: 0.8;
    background-color: unset;
    color: #EF403D;
}

.project-list-slider {
    box-shadow: 0px 0px 10px 0px #0000001A;
}

.project-item {
    display: flex;
    height: fit-content;
}

.project-item-image {
    width: 50%;
    display: flex;
    align-items: center;
}

.project-item-content {
    padding: 24px;
    width: 50%;
    text-overflow: ellipsis;
}

.project-item-title {
    font-weight: 600;
    margin: 0 0 24px;
    height: 108px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

@media (max-width: 992px) {
    .project-item-title {
        line-height: 36px;
        height: 72px !important;
    }
}

@media (max-width: 768px) {
    .project-item-image {
        width: 100% !important;
        display: block !important;
    }
    .project-item-image {
        position: relative;
        width: 100%;
        padding-top: 56.25%;
        overflow: hidden;
    }
    
    .project-item-image img {
        position: absolute;
        top: 0; left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}



.project-item-description {
    margin-bottom: 24px !important;
    height: 112px;
    overflow: hidden;
        display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    color: #000 !important;
}

.receipt-long {
    background-image: url(../images/receipt_long.svg);
}

@media (max-width:768px) {
    #filter-form{
        row-gap: 12px;
    }
    
    #filter-form select{
        width: 100% !important;
    }
    
    .project-item {
        flex-direction: column;
    }
    
    .project-item-image {
        width: 100%;
    }

    .project-item-content {
        width: 100%;
    }

    .project-item-image {
        width: 100% !important;
    }
}

@media (max-width: 992px) {

}
/* project detail */

.custom-banner .e-con-inner {
    gap: 40px !important;
    display: flex;
}

.custom-banner-img {
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-banner-img img {
    max-width: 100%;
    height: auto;
    max-height: 100%;
    object-fit: contain;
}

.custom-banner .e-con-full.e-flex.e-con.e-child {
    padding: 0;
}

.custom-banner .banner-content {
    display: flex;
    justify-content: space-between;
    margin: 24px 0 0;
    gap: 0;
}

.banner-content-title .elementor-heading-title {
    height: 216px;
    margin-bottom: 60px !important; 
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.custom-banner .elementor-icon-list-icon {
    width: 24px !important;
    margin-right: 8px;
}

.custom-banner .elementor-icon-list-icon svg {
    width: 24px;
    height: 24px;
}


@media (max-width: 1024px) {


    .banner-content-title  .elementor-heading-title {
        -webkit-line-clamp: 3;
        height: 108px !important;
        font-size: 24px !important;
        line-height: 36px !important;
        margin-bottom: 30px !important; 
    }

    .banner-content-meta .elementor-icon-list-item {
        font-size: 14px !important;
    }
    .custom-banner .elementor-icon-list-icon {
        width: 18px !important;
        margin-right: 4px !important;
    }
    
    .custom-banner .elementor-icon-list-icon svg {
        width: 18px !important;
        height: 18px !important;
    }
}
@media (max-width: 576px) {
    .banner-content-title .elementor-heading-title {
        height: unset !important;
        -webkit-line-clamp: unset !important;
        margin-bottom: 16px !important; 
    }
}

/* case study detail */

.case-study-detail .e-flex.e-con-boxed {
    padding: 0 !important;
}

.case-study-detail .list-item-icon li {
    display: inline-block;
}

.case-study-detail h3,
.case-study-detail p,
.case-study-detail > ul {
    margin-bottom: 24px;
}

.case-study-detail h3 {
    font-size: 24px;
    line-height: 36px;
    font-weight: 600;
    margin: 0 !important;
    /* padding: 24px 0 !important; */
}

.case-study-detail .elementor-widget-container {
    /* padding: 0 80px 24px; */
}

@media (max-width: 992px) {
    .case-study-detail .elementor-widget-container {
        /* padding: 0 40px 24px; */
    }
    .case-study-detail h3 {
        /* padding-top: 0 !important; */
    }
}

@media (max-width: 768px) {
    .case-study-detail .elementor-widget-container {
        /* padding: 0 0 24px; */
    }
}

.case-study-detail ul {
    gap: 8px;
    display: flex;
    flex-direction: column;
    padding-left: 40px;
}

.case-study-detail li {
    max-width: 100% !important;
    display: inline-block;
}

.custom-li-only li:only-child:before {
    background-image: unset;
}

#loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.185);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    display: none;
}

.loading-spinner {
    width: 40px;
    height: 40px;
    border: 5px solid #f3f3f3;
    border-radius: 50%;
    border-top: 5px solid #3498db;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.featured-empty:not(:has(.project-list-slider-container)) {
    display: none;
}

/* career */
.career-list-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding-bottom: 24px;
}

.post-views.entry-meta>span.post-views-icon.dashicons {
    display: none !important;
}

.career-item .career-item-excerpt .date,
.career-item .career-item-excerpt .views {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.career-item .career-item-excerpt .views .post-views-icon,
.career-item .career-item-excerpt .views .post-views-label {
    display: none;
}
.career-item .career-item-excerpt .icon-calendar_month,
 .career-item .career-item-excerpt .icon-visibility {
    font-size: 24px;
}
.career-item-excerpt .post-views-count:after {
    content: " views";
}
.career-item-excerpt {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    align-items: center;
    color: #000000;
    font-family: 'Poppins', sans-serif;
}

.career-item-title {
    font-size: 20px;
    line-height: 28px;
    height: 28px;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    margin: 0 0 8px;
}
@media (max-width: 768px) {
    .career-item-title {
        min-height: unset !important;
    }
}

.career-item .career-item-image a {
    display: block;
    position: relative;
    height: 231px;
}
 .career-item .career-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
}
.career-item {
    border: 1px solid #CED4DA;
    background-color: #fff;
}

.career-item:hover {
    box-shadow: 0px 0px 10px 0px #0000001A;
}

.career-item:hover .career-item-content {
    background-color: #EF403D;
}

.career-item:hover .career-item-content .career-meta {
    color: #ffffff;
}

.career-item:hover .career-item-content .career-meta:before {
    filter: brightness(0) invert(1);
}

.career-item:hover .career-item-title {
    color: #EF403D;
    text-decoration: underline;
}

.career-item .career-item-header {
    padding: 16px;
}


.career-item .career-item-content {
    background-color: #FFF5F5;
}

.career-item .career-item-content .career-meta {
    padding: 8px 12px;
    color: #EF403D;
}

.career-meta {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.career-meta::before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}

.career-meta.badge-icon::before {
    background-image: url('../images/badge.svg');
}

.career-meta.calendar-icon::before {
    background-image: url('../images/calendar_month.svg');
}

.career-meta.location-icon::before {
    background-image: url('../images/location_on.svg');
}

.career-meta.date-icon::before {
    background-color: #6C757D;
    mask-image: url(../images/clock.svg);
    mask-size: contain;
}

.career-item .career-item-description {
    margin: 16px;
    height: 96px;
    line-height: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
}

.career-item .custom-button-default-container {
    display: flex;
    justify-content: end;
}

.career-item .custom-button-default {
    padding: 16px 24px;;
}

.career-item .custom-button-default a:hover {
    background-color: #EF403D !important;
}

.career-meta.date-icon {
    color: #6C757D;
}

@media (max-width: 992px) {
    .career-list-row {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .career-list-row {
        grid-template-columns: repeat(1, 1fr);
    }
}

.related-career .career-list-row {
    display: grid;
    grid-template-columns: unset;
    grid-template-rows: repeat(3, 1fr);
    gap: 16px;
    padding-bottom: 16px;
}

.related-career .career-item {
    box-shadow: unset;
    border: 1px solid #CED4DA;
}

.related-career .career-item-header {
    padding: 8px;
}

.related-career .career-item-title {
    margin: 0 0 4px;
}

.related-career .career-item-content .career-meta  {
    color: #6C757D;
    font-size: 12px;
    padding: 8px;
}

.related-career .career-item-content .career-meta.badge-icon::before {
    background-image: url('../images/badge1.svg');
}

.related-career .career-item-content .career-meta.calendar-icon::before {
    background-image: url('../images/calendar_month1.svg');
}

.related-career .career-item-content .career-meta.location-icon::before {
    background-image: url('../images/location_on1.svg');
}

.related-career .custom-button-default::after {
    background-image: url('../images/arrow_forward1.svg') !important;
}

@media (min-width: 768px) {
.blog-list-slider-container .blog-list-slider .owl-stage-outer {
    box-shadow: none !important;
 }

.blog-list-slider-container .blog-list-slider .owl-stage-outer .blog-item {
    box-shadow: 0px 0px 10px 0px #0000001A !important;
}

.blog-list-slider-container .blog-list-slider .owl-stage-outer {
    padding: 10px 10px;
    margin: 0 -10px;
}
}

.related-career .custom-button-default {
    justify-content: end;
}


/* application form */

.kyanon-webform.application-form .wap_input {
    margin: 0;
    gap: 16px;
}

.kyanon-webform.application-form .wap_input .upload-file {
    display: none;
}


.kyanon-webform.application-form .wap_input > * {
    flex: 0 0 50%;
    max-width: calc(100% /3 - 32px / 3);
    padding: 0;
    margin-bottom: 24px;
}

.kyanon-webform.application-form .recaptcha {
    margin-top: 24px;
    display: block;
}

.custom-file-upload {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #ccc;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
}

.custom-file-upload p {
    display: flex;
    align-items: center;
    gap: 4px;
}

#fakeUploadBtn {
    background: none;
    border: 1px solid #EF403D;
    color: #EF403D;
    font-weight: 600;
    padding: 12px 24px;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 4px;
}

#fakeUploadBtn::after {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url('../images/share.svg');
}

#fileName {
    font-size: 16px;
}

.kyanon-webform.application-form .wap_button {
    margin-top: 16px;
}

@media (max-width: 768px) {
    .kyanon-webform.application-form {
        gap: 16px;
    }

    .kyanon-webform.application-form .wap_input > * {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 0;
    }
    .kyanon-webform.application-form .custom-file-upload {
        margin-top: 16px;
        height: 46px;
    }
    
    .kyanon-webform.application-form .wap_input input {
        height: 40px;
        font-size: 14px;
    }

    #fakeUploadBtn {
        height: 30px;
        padding: 8px 24px;
    }
    #fileName {
        font-size: 12px;
    }
}

/* white paper */
.kyanon-webform.white-paper .wap_input > * {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
    margin-bottom: 16px;
}

.kyanon-webform.white-paper .wap_input {
    margin: 0 !important;
}

.kyanon-webform.white-paper .recaptcha {
    margin-top: 24px;
    display: block;
    margin-bottom: 24px;
}

.kyanon-webform.white-paper .wap_button {
    text-align: start;
}

.kk-star-ratings {
    margin-top: 32px;
}

.kk-star-ratings {
    margin-top: 16px;
}

 @media (max-width: 768px) {
    .kk-star-ratings {
        margin-top: 16px;
    }
}

/* job detail */
.custom-job-detail h3,
.custom-job-detail h4,
.custom-job-detail b{
    padding: 24px 0;
    margin: 0;
    font-weight: 600;
}

.custom-job-detail h3:first-child,
.custom-job-detail h4:first-child,
.custom-job-detail b:first-child {
    padding: 0 0 24px;
}

.custom-job-detail p {
    margin-left: 24px;
}

.custom-job-detail p,
.custom-job-detail li:not(:has(ul)) {
    position: relative;
    padding-left: 33px !important;
    list-style: none;
    margin-bottom: 8px;
}

.custom-job-detail p:before,
.custom-job-detail li:not(:has(ul)):before {
    content: '';
    display: block;
    width: 17px;
    height: 17px;
    background-image: url(../images/focus.svg);
    position: absolute;
    top: 4px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
}

.custom-job-detail ul li ul {
    padding-left: 30px !important;
    margin-left: -11px;
}

.custom-job-detail ul li ul li {
    list-style: disc;
    padding-left: 0 !important;
    margin-bottom: 0 !important;
}

.custom-job-detail ul li ul li:before {
    all: unset;
}

.custom-job-detail ul li:has(b) {
    position: relative;
    padding-left: 33px !important;
    list-style: none;
    margin-bottom: 24px;
}

.custom-job-detail ul li:has(b):before {
    /* content: '';
    display: block;
    width: 17px;
    height: 17px;
    background-image: url(../images/focus.svg);
    position: absolute;
    top: 4px;
    left: 0; */
}

.custom-job-detail ul + p {
    margin-top: 24px !important;
}

.job-description-header .elementor-icon-list-items {
    display: flex;
    flex-direction: row;
}

@media (max-width: 992px) {
    .custom-job-detail p,
    .custom-job-detail li,
    .custom-job-detail span {
        font-size: 14px;
        line-height: 24px;
    }
}

@media (max-width: 576px) {
    .custom-job-detail p {
        margin-left: 0 !important;
    }

    .custom-job-detail ul {
        padding-left: 0 !important;
    }
}

.kyanon-footer {
    width: 100% !important;
}

@media (max-width: 1336px) {
    /* .custom-breadcrumb {
        margin-left: 16px !important;
        margin-right: 16px !important;
    } */

    .custom-breadcrumb span,
    .custom-breadcrumb .arrow + a {
        white-space: nowrap; 
        overflow: hidden;        
        text-overflow: ellipsis;    
        display: inline-block;     
        max-width: 150px;
     }
}


.our-tech-stasks .elementor-section .elementor-column .elementor-element-populated {
    background-color: #fff;
}

.bg-human:after {
    content: "";
     background-image: url(../images/Vector.png);
        background-image: url(../images/Vector-6.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center left;
        width: 1573px;
        height: 1265px;
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        pointer-events: none;
        
    }

    .bg-your-rq:after {
        content: "";
          background-image: url(../images/Group-5461.png);
          background-repeat: no-repeat;
          background-size: contain;
          width: 476px;
          height: 1179px;
          position: absolute;
          right: 0;
          top: 50%;
          transform: translateY(-50%);
          z-index: -1;
      }

/*.choose-model-content h4{*/
/*    font-size: 24px;*/
/*    font-weight: 600;*/
/*}*/

/* fix all layout content duplicate */

.choose-model-content .elementor-column-gap-default {
    gap: 24px !important;
    display: flex;
    flex-wrap: wrap;
}

.choose-model-content .elementor-container .elementor-column{
    border: 1px solid #CED4DA;
    width: calc(100% / 3 - 48px / 3);
    padding:24px;
    background-color: rgb(255, 255, 255);
}

@media (max-width: 992px) {
    .choose-model-content .elementor-container .elementor-column{
        width: calc(100% / 2 - 48px / 2) !important;
    }
}

.choose-model-content .elementor-container .elementor-column  .elementor-widget-text-editor {
    margin-bottom: 0 !important;
}
@media only screen and (max-width: 767px) {
    /*.choose-model-content h4{*/
    /*  font-size: 20px;*/
    /*  }*/
      .choose-model-content .elementor-container .elementor-column{
          width:100%;
          padding:5px;
     
      }
  }

.default-btn {
    width: fit-content;
}

  /* card */

.blog-item-title {
    height: 108px;
}

.see-more-btn.elementor-hidden-mobile {
    display: block;
}

.post-99143 .elementor-element-4be4af6 .elementor-container {
    min-height: unset !important;
}

.post-99143 .elementor-element-4be4af6 .elementor-heading-title {
    margin-top: 193px;
    margin-bottom: 40px;
}

.post-99143 .elementor-element-4be4af6 .form-filter-header {
    padding-bottom: 80px;
    max-width: 1310px;
    margin: 0 auto;
    gap: 0 !important;
}

.post-99143 .elementor-element-4be4af6 .form-filter-header .hidden-search {

}

@media (max-width: 1024px) {
    .post-99143 .elementor-element-4be4af6 #filter-form {
        width: calc(100%);
    }
}

@media (max-width: 768px) {
    .post-99143 .elementor-element-4be4af6 #filter-form {
        width: calc(100%);
    }
}

.form-filter-header .form-filter-title {
    margin-bottom: 40px;
}

.post-99143 .elementor-element-4be4af6 .hidden-search {
    display: unset !important;
}

/* pagination */

.pagination-links {
    display: flex;
    justify-content: end;
    gap: 4px;
    margin-top: 40px;
}

.pagination-links span {
    background: #ec4e4c;
    border-radius: 50%;
    width: 28px;
    height: 28px;
    align-content: center;
    text-align: center;
    color: #fff
}

.pagination-links a {
    border-radius: 50%;
    width: 28px;
    height: 28px;
    align-content: center;
    text-align: center;
    color: #ec4e4c;
}

.pagination-links .prev,
.pagination-links .next {
    font-size: 20px;
}

.pagination-links .dots {
    background-color: unset;
    color: #ec4e4c;

}

#project-results:has(.case-study) .pagination-links {
    display: none;
}

@media (min-width: 768px) {
    .filter-custom .elementor-widget-heading {
        position: absolute;
    }
}

@media (max-width: 768px) {
    .form-filter-header form {
        margin: unset !important;
    }
    .filter-custom .elementor-widget-heading h3 {
        line-height: 42px;
    }
    
/* .blog-list.case-study {
    margin: 0 16px;
}

.form-filter-header {
    column-gap: 0 !important;
}

*/
}
.form-filter-header #filter-form {
    width: 100%;
} 

#filter-form[data-post-type="careers"] .project-filter-search {
    display: unset !important;
}

.case-study-title {
    margin-top: 0;
    margin-bottom: 40px;

    @media (max-width: 768px) {
        margin-bottom: 24px;
    }
}