/**
 * Theme Name:     Kaneka Americas Child
 * Template:       kaneka-americas
 * Text Domain:	   kaneka-americas-child
 * Description:    Kaneka Americas Child Theme
 */
:root {
    --nav-dropdown-arrow: url("data:image/svg+xml,<svg viewBox='0 0 1024 1024' class='icon' version='1.1' xmlns='http://www.w3.org/2000/svg' fill='white' stroke='white'><g id='SVGRepo_bgCarrier' stroke-width='0'></g><g id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'></g><g id='SVGRepo_iconCarrier'><path d='M903.232 256l56.768 50.432L512 768 64 306.432 120.768 256 512 659.072z' fill='white'></path></g></svg>");
}
body, body * {
    letter-spacing: normal !important;
}
.site-header {
	max-width: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
}
.hm-hero-banner {
    position: absolute;
    inset: 0;
}
.fw-400 {
    font-weight: 400;
}
.lh-14 {
    line-height: 1.4;
}
.lh-18 {
    line-height: 1.8;
}
.btn {
    text-decoration: none !important;
     font-weight: 600; 
}
.primary-menu {
    color: white;
}
.main-navigation {
    justify-content: start;
}
.main-navigation .menu-item-has-children > a:after {
    content: '';
    background-image: var(--nav-dropdown-arrow);
    width: 12px;
    height: 12px;
    background-position: center 2px;
    background-repeat: no-repeat;
    margin-left: 8px;
    rotate: -90deg;
}
.menu-toggle {
    color: white;
}
.main-navigation.toggled .dropdown-toggle::after {
    content: none;
}
.custom-logo-link {
    /* z-index: 6; */
}
#site-navigation-wrapper {
    width: 100%;
}
#site-navigation-wrapper.mobile_menu_toggled .mobile-toggled-logo {
    display: block;
    position: relative;
    /* z-index: 200; */
    padding-block: 1rem;
}
.mobile_menu_toggled .menu-side-content {
    pointer-events: none;
}
.mobile_menu_toggled .primary-menu-container {
    position: relative;
    width: 100%;
    display: block;
}
.mobile_menu_toggled .primary-menu-container ul:not(.sub-menu) {
    margin: 1rem auto 0;
}
.main-navigation li:hover > a,
.main-navigation li.focus > a,
.main-navigation .current_page_item > a,
.main-navigation .current-menu-item > a,
.main-navigation .current_page_ancestor > a,
.main-navigation .current-menu-ancestor > a,
.mobile_menu_toggled .primary-menu-container .lnr-chevron-down:before {
    color: white;
}

.hm-hero .carousel-control-next,
.hm-hero .carousel-control-prev {
    width: 8%;
    opacity: 0.875;
}
.hm-hero .carousel-control-next:hover,
.hm-hero .carousel-control-prev:hover {
    background: transparent;
}
@media (min-width: 992px) {
    .menu-toggle {
        display: block;
    }
}
@media (min-width: 1200px) {
    .menu-toggle {
        display: none;
    }
    .primary-menu-wrapper .primary-menu-container {
        display: flex;
    }
    .primary-menu-wrapper {
        overflow: visible;
        padding: 0;
        z-index: 10;
        -webkit-transform: none;
        -ms-transform: none;
        transform: none;
        position: static;
        top: initial;
        background: transparent;
        min-height: auto;
        -webkit-transition: none;
        -o-transition: none;
        transition: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }
    .main-navigation li {
        float: left;
    }
    .primary-menu-wrapper .menu {
        opacity: 1;
    }
    .main-navigation .menu-item-has-children > a {
        padding-right: 1rem;
    }
    .main-navigation .menu-item-has-children > a:after {
        display: inline-block;
    }
    .main-navigation li:hover > a,
    .main-navigation li.focus > a,
    .main-navigation .current_page_item > a,
    .main-navigation .current-menu-item > a,
    .main-navigation .current_page_ancestor > a,
    .main-navigation .current-menu-ancestor > a {
        background-color: white;
        color: #1D61AC;
        text-decoration: none;
        
    }
    .slide-item {
        padding-top: 4rem;
    }
}
@media (min-width: 1300px) {
    .main-navigation .menu-item-has-children > a {
        padding-right: 1.25rem;
    }
}
@media (max-width: 1199px) {
    .main-navigation .primary-menu-wrapper {
        display: none;
    }
    .main-navigation.toggled .primary-menu-wrapper {
        display: flex;
    }
    .primary-menu-wrapper {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        min-height: 100vh;
        overflow: hidden;
        z-index: -10;
        -webkit-transition: all 0.3s ease, z-index 1s step-end;
        -o-transition: all 0.3s ease, z-index 1s step-end;
        transition: all 0.3s ease, z-index 1s step-end;
        padding: 5rem 1.5625rem;
    }
    .primary-menu-wrapper .dropdown-toggle,
    .primary-menu-wrapper .mobile-search-form-wrapper {
        display: block;
    }
    .primary-menu-wrapper .dropdown-toggle {
        right: 25%;
        rotate: -90deg;
          margin-top: 4px;
        margin-right: -8px;
    }
    .primary-menu-wrapper .dropdown-toggle.toggled-on span {
        rotate: -90deg;
    }
    .primary-menu-wrapper:after {
        content: '';
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        min-width: 0;
        min-height: 0;
        border-radius: 50%;
        /* background: rgba(242, 249, 253, 0.98); */
        background: rgba(0, 102, 166, 0.9);
        -webkit-transition: min-width 0.3s linear 0.5s, min-height 0.3s linear 0.5s, border-radius 0.3s linear 0.2s;
        -o-transition: min-width 0.3s linear 0.5s, min-height 0.3s linear 0.5s, border-radius 0.3s linear 0.2s;
        transition: min-width 0.3s linear 0.5s, min-height 0.3s linear 0.5s, border-radius 0.3s linear 0.2s;
        -webkit-transform: translateY(-50%) translateX(50%);
        -ms-transform: translateY(-50%) translateX(50%);
        transform: translateY(-50%) translateX(50%);
    }
    .main-navigation li {
        float: none;
    }
    .primary-menu-wrapper .menu {
        opacity: 0;
        max-width: 345px;
    }
    .main-navigation .menu-item-has-children > a:after {
        display: none;
    }
    .main-navigation a {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .main-navigation ul ul a {
        color: white;
    }
    .slide-item {
        padding-top: 12rem;
    }


    .uagb-ifb-title-wrap{
        margin-top: 20px;
    }
}
@media (min-width: 0px) and (max-width: 480px) {
    /* mobile ONLY */
}

@media only screen and (max-width: 480px) {

    .py-10{
         padding-top:10rem;
    }

       .uagb-ifb-content{
            margin-top: 65px !important;
        }

.display-2 {
   
    margin-top: -50px !important;
         
}
    
}

@media only screen and (min-width: 300px) and (max-width: 668px) {

    .py-10{
         padding-top:10rem;
    }

    .uagb-ifb-content{
        margin-top: 65px !important;
    }

    #environment-energy {
        top: 15% !important;
        left: 50%;
    }

    #health-care {
        top: 33%;
        left: -5% !important;
    }

    #info-communication {
       bottom: 50% !important;
        right: -5% !important;
    }

    #food-support {
    bottom: 35% !important;
        left: 50% !important;
    }
}





/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
      .py-10{
    padding-top:2rem;
    }

    .uagb-ifb-content{
    margin-top: 65px !important;
}


   

}

@media only screen and (min-width: 380px) and (max-width: 932px) {
    #environment-energy {
        top: 18% !important;
        left: 50%;
    }

     #health-care
 {
        top: 31% !important;
        left: -2% !important;
    }
#info-communication {
        bottom: 53% !important;
        right: -2% !important;
    }
    #food-support {
              bottom: 37% !important;
        left: 50% !important;
	}



}  
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
   

}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

}

.table tbody tr,
.table tbody td {
    background-color: transparent !important;
}


.table,
.table td,
.table th {
    border: none !important;
}


.table tbody tr {
    border-bottom: 1px solid #4B95C3 !important;
}


.table-hover tbody tr:hover {
    background-color: #f7faff !important;
}


.table > tbody > tr:nth-of-type(odd) {
    background: transparent !important;
}


.table thead tr th {
    background-color: #0066a6 !important; 
    color: #fff !important;               
    text-transform: capitalize;
    font-weight: 500;
    border-bottom: 1px solid #4B95C3 !important; 
}


.table thead th {
    padding: 10px 12px;
    font-weight: 600;
}


.table .align-middle a {
    color: #003cff;
    text-decoration: none;
}


.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-responsive table {
    width: 100%;
    min-width: 650px;
}



@media (max-width: 767px) {
    .table thead th {
        width: auto !important; 
    }

    .table-responsive table {
        min-width: 600px; 
    }
}

.pagination {
    display: flex;
    gap: 4px;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap; 
}


.pagination .page-item {
    list-style: none;
}

.pagination .page-link {
    display: inline-block;
    padding: 6px 12px;
    background: #0066a6;
    color: #fff !important;
    border-radius: 4px;
    text-decoration: none;
    border: 1px solid #0066a6;
}

/* Current page */
.pagination .current {
    background: #004f80 !important;
    border-color: #004f80 !important;
    color: #fff !important;
}

/* Hover */
.pagination .page-link:hover {
    background: #004f80;
    color: #fff !important;
}

/* Prevent weird vertical spacing */
.pagination li {
    margin: 0;
    padding: 0;
}

body.page-template-default {
    background-image: url("assets/img/mx-background-img.png");
    /* background-size: cover; */
    background-repeat: no-repeat;
    background-position: center top;
    
}

@media (min-width: 1400px) and (max-width: 2560px)  {
   
    body.page-template-default {
   
    background-size: 100% auto; 
    background-attachment: scroll;
   
}

 body.page-template-template-front-page {
  background-size: 100% auto; 
    background-attachment: scroll;
} 


}


.slick-prev:before,
.slick-next:before {
    content: "";
    display: block;
    width: 40px;
    height: 40px;
    background-size: contain;
    background-repeat: no-repeat;
    filter: brightness(0) invert(1); /* makes black SVG white */
}

.slick-prev:before {
    background-image: url("https://cdn.jsdelivr.net/npm/bootstrap-icons/icons/chevron-left.svg");
}

.slick-next:before {
    background-image: url("https://cdn.jsdelivr.net/npm/bootstrap-icons/icons/chevron-right.svg");
}


.wp-block-getwid-images-slider .slick-prev:before,.wp-block-getwid-media-text-slider .slick-prev:before,.wp-block-getwid-post-slider .slick-prev:before,.wp-block-getwid-post-carousel .slick-prev:before{
 
  content:'' !important
}

.wp-block-getwid-images-slider .slick-next:before,.wp-block-getwid-media-text-slider .slick-next:before,.wp-block-getwid-post-slider .slick-next:before,.wp-block-getwid-post-carousel .slick-next:before{
  content:'' !important
 
}

.wp-block-getwid-section__background-holder{
    position: relative !important;
}


@media only screen and (min-width: 1920px) and (max-width: 2560px) {
    /* CSS for full HD displays */
       body.page-template-default .h-50 {
            height: 34% !important;
       }
    
       
}

body.page-template-template-front-page {
    background-image: url("assets/img/mx-background-img.png");
    /* background-size: cover; */
    background-repeat: no-repeat;
    background-position: center top;
  
    
}

.wpcf7-radio .wpcf7-list-item {
    display: block;       /* stack vertically */
    margin-bottom: 8px;   /* spacing between options */
}

.btn-submit {
  background-color:#1D61AC;
    color: white;
    padding: 12px 30px;
    border-radius: 5px;
    border: none;
    font-weight: 600;
    font-size: 16px;
}


.btn-submit.alt-style {

    background-color:#1D61AC;



    border-radius: 4px;

    font-size: 14px;

    display: inline-flex;

    align-items: center;

 

}



.btn-submit:hover {

    background-color: #1D61AC;

}
.main-navigation ul ul a
{
width:310px !important;
}

.main-navigation ul ul li#menu-item-3188 > a {
    width: 210px !important;
}
@media (min-width: 992px) {
    .main-navigation ul ul a {
        width: 310px !important;
    }
}


.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #00BAFF;
    --bs-btn-border-color: #00BAFF;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #00BAFF;
    --bs-btn-hover-border-color: #00BAFF;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #00BAFF;
    --bs-btn-active-border-color: #00BAFF;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #00BAFF;
    --bs-btn-disabled-border-color: #0d6efd
}

@media (min-width: 1200px) {
    .display-2 {
        font-size: 3.5rem;
    }
}

.uagb-buttons-repeater.wp-block-button__link {
   border-radius: 0.25em !important;
    font-weight: 600; 
}

/* .page-id-1166 .site-footer {
    margin-top: -95px !important;
   
}

.page-id-2111 .site-footer {
    margin-top: -95px !important;
   
}  */

@media (min-width: 1200px) and (max-width: 1920px) {
   .site-footer {
    margin-top: -26px !important;
   }
}

@media (min-width: 1024px) {
    .site-footer {
     margin-top: -26px !important;
   }
   
}

@media (min-width: 960px) {
    .site-footer {
    margin-top: -26px !important;
   }
}

@media (min-width: 800px) {
    .site-footer {
    margin-top: -26px !important;
   }
}

@media (max-width: 767px) {
    .download_box_image img {
        width: 86px !important;
        height: auto !important;
    }
}

@media (min-width: 2048px) and (max-width: 4320px) {
    .site-footer {
    margin-top: -26px !important;
   }
}



/* =========================================
   Fusion-style Zoom-Out Image Hover Effect
   (Getwid Image Box)
   ========================================= */


.wp-block-getwid-image-box__image-container {
    position: relative;
    overflow: hidden;
}


.wp-block-getwid-image-box__image {
    width: 100%;
    height: 100%;
    object-fit: cover;

    
    transform: scale(1.15);

    transition: transform 0.6s ease;
}


.wp-block-getwid-image-box:hover 
.wp-block-getwid-image-box__image {
    transform: scale(1);
}


.wp-block-getwid-image-box__image-container::after {
    content: "";
    position: absolute;
    inset: 0;
    /* background: rgba(0, 0, 0, 0.2); */
    opacity: 0;
    transition: opacity 0.6s ease;
    pointer-events: none;
}


.wp-block-getwid-image-box:hover 
.wp-block-getwid-image-box__image-container::after {
    opacity: 1;
}


.wp-block-getwid-image-box {
    transition: box-shadow 0.4s ease, transform 0.4s ease;
}

/* Initial state: offscreen LEFT */
.wp-block-columns .wp-block-column {
    opacity: 1;
    /* transform: translate3d(-50px, 0, 0) !important; */
    transform: translate3d(50px, 0, 0) !important;
    transition:
        opacity 1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94),
        transform 1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform, opacity;
}

/* Animated state */
.wp-block-columns.aos-animate .wp-block-column {
    opacity: 1;
    transform: translate3d(0, 0, 0) !important;
}

/* Staggered delays */
.wp-block-columns.aos-animate .wp-block-column:nth-child(1) { transition-delay: 0s; }
.wp-block-columns.aos-animate .wp-block-column:nth-child(2) { transition-delay: 0.15s; }
.wp-block-columns.aos-animate .wp-block-column:nth-child(3) { transition-delay: 0.3s; }
.wp-block-columns.aos-animate .wp-block-column:nth-child(4) { transition-delay: 0.45s; }

/*fix space bottom of home page*/

#learn-more {margin-bottom: 0!important;}

.entry-footer {
    margin-top: -3px!important;
}

/* ==========================================================
   MISSION SECTION – SUBTLE RIGHT TO LEFT ANIMATION (ALL DEVICES)
   ========================================================== */

/* Base Hidden State */
.mission-turtle {
    position: relative;
    background-size: cover;
    background-position: center;
    will-change: transform, opacity, background-position;
}

.mission-turtle .mission-home,
.mission-turtle .mission-head,
.mission-turtle .mission-para,
.mission-turtle .kaneka-home figure,
.mission-turtle .turtle-water {
    opacity: 0;
    transform: translateX(10px) scale(1); /* smaller movement for subtle effect */
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    will-change: transform, opacity;
}

/* TEXT (left → right) */
.mission-turtle .mission-home,
.mission-turtle .mission-head,
.mission-turtle .mission-para {
    transform: translateX(-10px);
}

/* IMAGE / FIGURE (right → left + subtle zoom) */
.mission-turtle .kaneka-home figure,
.mission-turtle .turtle-water {
    transform: translateX(10px) scale(1);
}

/* Staggered text delays */
.mission-turtle .mission-head { transition-delay: 0s; }
.mission-turtle .mission-para { transition-delay: 0.03s; }

/* Visible State – Scroll Trigger */
.mission-turtle.is-visible .mission-home,
.mission-turtle.is-visible .mission-head,
.mission-turtle.is-visible .mission-para {
    opacity: 1;
    transform: translate3d(0,0,0);
}

.mission-turtle.is-visible .kaneka-home figure,
.mission-turtle.is-visible .turtle-water {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1.01);
}

/* Animate the background image smoothly */
.mission-turtle {
    transition: background-position 1s ease-out, transform 1s ease-out;
}

.mission-turtle.is-visible {
    transform: scale(1.01);
    background-position: center center;
}

/* Mobile / Tablet Adjustments */
@media (max-width: 1024px) {
    .mission-turtle .mission-home,
    .mission-turtle .mission-head,
    .mission-turtle .mission-para {
        transform: translateY(8px);
    }
    .mission-turtle.is-visible .mission-home,
    .mission-turtle.is-visible .mission-head,
    .mission-turtle.is-visible .mission-para {
        transform: translateY(0);
    }

    .mission-turtle .kaneka-home figure,
    .mission-turtle .turtle-water {
        transform: translateY(8px) scale(1);
    }
    .mission-turtle.is-visible .kaneka-home figure,
    .mission-turtle.is-visible .turtle-water {
        transform: translateY(0) scale(1.01);
    }

    .mission-turtle { transform: scale(1); }
    .mission-turtle.is-visible { transform: scale(1.01); }
}

/* Extra small mobile */
@media (max-width: 480px) {
    .mission-turtle .mission-home,
    .mission-turtle .mission-head,
    .mission-turtle .mission-para,
    .mission-turtle .kaneka-home figure,
    .mission-turtle .turtle-water {
        transition-duration: 0.5s;
    }

    .mission-turtle { transition-duration: 0.7s; }
}

/* ==========================================================
   TURTLE STRETCH SECTION – MOBILE + ALL DEVICES ANIMATION
   ========================================================== */

/* Base hidden state */
.turtle-stretch .statement,
.turtle-stretch .statement-para,
.turtle-stretch .turtle-water {
    opacity: 0;
    transform: translateX(10px) scale(1);
    transition: transform 0.6s cubic-bezier(0.25,0.46,0.45,0.94),
                opacity 0.6s cubic-bezier(0.25,0.46,0.45,0.94);
    will-change: transform, opacity;
}

/* Text (left → right) */
.turtle-stretch .statement,
.turtle-stretch .statement-para {
    transform: translateX(-10px);
}

/* Image (right → left + subtle zoom) */
.turtle-stretch .turtle-water {
    transform: translateX(10px) scale(1);
}

/* Staggered text delays */
.turtle-stretch .statement { transition-delay: 0s; }
.turtle-stretch .statement-para { transition-delay: 0.03s; }

/* Visible state */
.turtle-stretch.is-visible .statement,
.turtle-stretch.is-visible .statement-para {
    opacity: 1;
    transform: translate3d(0,0,0);
}

.turtle-stretch.is-visible .turtle-water {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1.02);
}

/* Mobile / Tablet Adjustments */
@media (max-width: 1024px) {
    .turtle-stretch .statement,
    .turtle-stretch .statement-para {
        transform: translateY(8px);
    }
    .turtle-stretch.is-visible .statement,
    .turtle-stretch.is-visible .statement-para {
        transform: translateY(0);
    }

    .turtle-stretch .turtle-water {
        transform: translateY(8px) scale(1);
    }
    .turtle-stretch.is-visible .turtle-water {
        transform: translateY(0) scale(1.02);
    }
}

/* Extra small mobile */
@media (max-width: 480px) {
    .turtle-stretch .statement,
    .turtle-stretch .statement-para,
    .turtle-stretch .turtle-water {
        transition-duration: 0.5s;
    }
}

/* for all product page images mourse over */
/* Container: hide overflow for smooth zoom */
/* UAGB Image Hover – Zoom Back */
/* =========================================================
   UAGB IMAGE – LOAD ANIMATION
   ========================================================= */

.wp-block-uagb-image {
    position: relative;
    overflow: hidden;
    display: inline-block;

    /* 🔥 animation added */
    animation: uagbFadeSlide 1.1s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

/* Keyframes REQUIRED */
@keyframes uagbFadeSlide {
    from {
        opacity: 0;
        transform: translate3d(50px, 0, 0);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}

/* =========================================================
   IMAGE ZOOM-BACK HOVER EFFECT
   ========================================================= */

.wp-block-uagb-image img {
    width: 100%;
    height: auto;
    object-fit: cover;

    transform: scale(1.15);
    transition: transform 0.6s ease;
}

/* Zoom back on hover */
.wp-block-uagb-image:hover img {
    transform: scale(1);
}

/* =========================================================
   OPTIONAL OVERLAY
   ========================================================= */

.wp-block-uagb-image::after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.6s ease;
    pointer-events: none;
}

.wp-block-uagb-image:hover::after {
    opacity: 1;
}

/* =========================================================
   STAGGERED DELAYS (NOW THEY WORK)
   ========================================================= */

.wp-block-uagb-image:nth-of-type(1) { animation-delay: 0s; }
.wp-block-uagb-image:nth-of-type(2) { animation-delay: 0.15s; }
.wp-block-uagb-image:nth-of-type(3) { animation-delay: 0.3s; }
.wp-block-uagb-image:nth-of-type(4) { animation-delay: 0.45s; }


