.elementor-button:hover{filter: brightness(1.07);
    transform: translateY(-1px);}

.home.wp-singular{
.surpass_fixed_header{position:absolute;top:0;left:auto;right:auto;bottom:auto}
.surpass_fixed_header .float_cart svg path{fill:#fff!important}
.surpass_fixed_header .hfe-site-logo-img{filter:invert(0);}
.surpass_fixed_header .menu-item a.hfe-menu-item,
.surpass_fixed_header .sub-menu a.hfe-sub-menu-item{color:#ffffff !important}
}

.wp-singular .surpass_fixed_header{position:inherit}
.wp-singular .surpass_fixed_header .hfe-site-logo-img{filter:invert(1);}

.surpass_fixed_header,
.surpass_fixed_header .e-con-inner{transition:ease-in-out all .3s;}
.surpass_fixed_header.fixed_surpass{transition:ease-in-out all .2s;}
.surpass_fixed_header.fixed_surpass .e-con-inner{padding-top:15px;padding-bottom:15px;transition:ease-in-out all .2s;}


.heading_underline {position: relative;display: inline-block;}

.heading_underline::after {
    content: "";position: absolute;
    left:6%;bottom: -15px;
    width:88%;height: 20px;
    background: url('https://dev.apexure.org/surpassind/wp-content/uploads/2026/06/yellow-underline.png') no-repeat;
    background-size: 100% 100%;
    clip-path: inset(0 100% 0 0);
    animation: drawUnderline 3s ease 1s forwards;
}
.heading_underline.left_line::after{left:0;}

.ghost_button .elementor-button,
.hero_usp{backdrop-filter: blur(13px)}
.ghost_button .elementor-button:hover{background:#000;}
.desc_top .elementor-icon-box-content{display:flex;flex-direction:column;}
.desc_top .elementor-icon-box-content .elementor-icon-box-description{order:1}
.desc_top .elementor-icon-box-content .elementor-icon-box-title{order:2}

.desc_w_highlight.featured_box .elementor-icon-box-content .elementor-icon-box-description > span{display: inline;
    background:#C0B427;padding: 0.08em 0.25em;border-radius: 3px;line-height: 1;}

.desc_w_highlight .elementor-icon-box-content .elementor-icon-box-description > span{display: inline;
    background:#fff262b3;padding: 0.08em 0.25em;border-radius: 3px;line-height: 1;}

/*
.text-highlight {
    display: inline;
    background: #90E0FF;
    padding: 0.08em 0.25em;
    border-radius: 20px;
    line-height: 1;
}
*/

.text-highlight {display: inline-block;position: relative;z-index: 1;padding:0 8px;}
.text-highlight::before {content: "";position: absolute;inset: 2px;background:#90E0FF;
    border-radius: 8px;z-index: -1;top: -3px;bottom: 4px;font-size:inherit}
.text-highlight.white_bg::before{background:#fff;}
.text-highlight.white_bg{color:#2A75AF}
.hover_desc .elementor-widget-icon-box .elementor-icon-box-content .elementor-icon-box-description {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.6s ease-in-out, opacity 0.5s ease-in-out;
}
.hover_desc:hover .elementor-widget-icon-box .elementor-icon-box-content .elementor-icon-box-description {
    max-height: 500px; /* A safe upper limit to mimic automatic height */
    opacity: 1;}
.hover_desc:hover .elementor-widget-icon-box .elementor-icon-box-icon .elementor-icon{transform:rotate(90deg);}
.post_cards a.hfe-read-more{border-bottom:2px solid #ffcc2f;padding-bottom: 4px;transition:ease-in-out all .2s}
.post_cards a.hfe-read-more:hover{transition:ease-in-out all .2s}


.copyright_text{color:#8E8991;font-size:16px}

.contact_us_social .elementor-icon{background-color:rgb(11 17 41 / 6%) !important}
.spi_form input[type=text],
.spi_form input[type=email],
.spi_form input[type=tel],
.spi_form textarea{border: 1.5px solid rgba(11, 17, 41, 0.2) !important;
    border-radius: 10px;padding: 13px 16px;font-family: Roboto, sans-serif;
    font-size: 15px;color: rgb(11, 17, 41);background: #fff;outline: none;
    transition: border-color .18s ease, box-shadow .18s ease;}
.spi_form .forminator-select .select2-selection{
	border: 1.5px solid rgba(11, 17, 41, 0.2) !important;border-radius: 10px;padding: 5px 16px !important;
    font-family: Roboto, sans-serif;font-size: 15px;color: rgb(11, 17, 41) !important;background: #fff !important;
    outline: none;transition: border-color .18s ease, box-shadow .18s ease;	
}
.spi_form textarea{min-height:140px;}

.spi_form.msf_form input[type=text],
.spi_form.msf_form input[type=email],
.spi_form.msf_form input[type=tel],
.spi_form.msf_form textarea{background:rgb(246,245,242) !important;border-radius:8px}
.spi_form.msf_form .forminator-field-name > .forminator-row {display:flex;flex-direction:row;gap:20px;width:100%}
.spi_form.msf_form .forminator-field-name > .forminator-row .forminator-col-md-6{flex:1 0 0;margin-bottom:0 !important}

.forminator-select.forminator-select-dropdown-container--open .forminator-select-dropdown.forminator-dropdown--basic{padding:0 !important}
.spi_form .forminator-label{ display: block;font-family: Roboto, sans-serif;font-weight: 600;
    font-size: 13px;letter-spacing: .04em;color: rgb(40, 44, 54);margin-bottom: 6px;text-align: left;}
.forminator-field-textarea .forminator-field{position:relative}
.forminator-ui.forminator-custom-form[data-design=basic] .forminator-label+.forminator-description{position:absolute;bottom:0;right:10px;
	pointer-events: none;opacity:.6}
.spi_form .forminator-button,
.spi_form .forminator-button-submit,
.spi_form .forminator-button-next{display: inline-flex;align-items: center;justify-content: center;
    height: 56px;width: 100%;border-radius: 999px;border: none;cursor: pointer;font-family: Roboto, sans-serif;
    font-weight: 700;font-size: 16px;line-height: 1.2em;letter-spacing: .06em;color: #fff;
    background: linear-gradient(158deg, rgb(20, 102, 152) 0%, rgb(52, 152, 201) 58%, rgb(144, 224, 255) 130%);
    transition: filter .2s ease, transform .2s ease;}
.spi_form .forminator-button:hover,
.spi_form .forminator-button-submit:hover,
.spi_form .forminator-button-next:hover{
    filter: brightness(1.07);
	transform: translateY(-1px);}

.spi-myaccount{padding:36px 0px 64px !important;}
.woocommerce-account .woocommerce-MyAccount-navigation{float:unset!important;width:unset!important}
.woocommerce-dashboard .site-main{max-width:1180px !important;}
.spi-myaccount .spi-account-content{margin-top:25px !important;min-height:unset !important}
.woocommerce-page .woocommerce-info .button{line-height: 1.50;border-radius: 30px;border: 1px solid #1f85be;background: #fff;position:relative;top:-12px}
.woocommerce-account .addresses .title::after,
.woocommerce-account .addresses .title::before{content:unset !important}

.spi_accordion .e-n-accordion-item-title{border: none !important;padding-left: 0 !important;}
.spi_accordion .e-n-accordion-item-title::before{content:'';background:rgb(11 17 41 / 14%);
	position:absolute;top:-12px;left:0;width:100%;height:1px;display:block}
.spi_accordion .e-n-accordion-item:first-child .e-n-accordion-item-title::before {
    content: none !important;}
.msf_form_outer{overflow-x:hidden !important}
.msf_form{position:relative;}
.msf_form .forminator-pagination-progress .forminator-progress-label{display:none !important;}
.msf_form .forminator-pagination-progress .forminator-progress-bar{background:rgb(11 17 41 / 10%);position:absolute !important;left:0;bottom:0;
	border-radius:0 0 20px 20px !important;transition:ease-in-out width .3s;width:100%;margin:0 !important;}
.msf_form .forminator-pagination-progress .forminator-progress-bar span{background:linear-gradient(90deg, rgb(20, 102, 152), rgb(52, 152, 201));}
.msf_form .forminator-pagination-footer .forminator-button{border-radius:8px}
.msf_form .forminator-button.forminator-button-back{flex: auto;max-width: 106px;line-height: 1.2em;background: #fff;
	border: 1.5px solid rgba(11, 17, 41, 0.2);color: #000;font-size: 14px;}


.msf_form .forminator-pagination-footer{display:flex !important;flex-direction:row;gap:20px !important}
.form_desclaimer{display:block;text-align: center;font-size: 12px;color: rgba(11, 17, 41, 0.38);margin:10px auto 0;}
.form_desclaimer a{color:rgb(38, 112, 170);text-decoration:none}
.form_desclaimer a{color:rgb(38, 112, 170);text-decoration:underline;}
.smooth_carousel figure.swiper-slide-inner > img.swiper-slide-image{max-height:36px}
.smooth_carousel .spi-smooth-marquee-track > *{flex:auto !important;width:unset !important}
/* ==========================================================
   WOOCOMMERCE BLOCK CART / CHECKOUT
   The cart page uses the WooCommerce *block* cart, which ships
   its own defaults and ignores the SPI product styles. Hello
   Elementor's reset also sets `a { color:#cc3366 }`, which is
   where the pink product links come from.
   ========================================================== */

/* Product links — navy, no underline until hover */
.wc-block-components-product-name,
.wc-block-grid__product-link,
.wc-block-cart-item__wrap a {
  color: var(--spi-navy, #0b1129);
  text-decoration: none;
  font-weight: 600;
}
.wc-block-components-product-name:hover,
.wc-block-cart-item__wrap a:hover {
  color: #2670aa;
  text-decoration: underline;
}

/* Proceed to Checkout — the brand gradient pill */
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background-image: linear-gradient(158deg, #146698 0%, #3498c9 58%, #90e0ff 130%) !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 999px !important;
  color: #fff !important;
  font-family: Roboto, sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 16px 38px;
  transition: filter 0.2s ease, transform 0.2s ease !important;
  text-decoration: none !important;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover {
  filter: brightness(1.07);
  transform: translateY(-2px);
  color: #fff;
}

@keyframes drawUnderline {
    to {
        clip-path: inset(0 0 0 0);
    }
}

/* ============================================================
   Footer legal-links row — site-wide horizontal overflow.

   The footer's Terms / Privacy / Shipping / Return / Cookies row
   (Elementor Header-Footer template 425, widget
   .elementor-element-1f6d41d) is an Elementor *inline* icon list.
   That layout pays for its gutter with per-item margins and
   cancels the two outer ones on the <ul>:

       ul.elementor-inline-items            { margin-inline: -10px }
       ul.elementor-inline-items > li       { margin-inline:  10px }

   So the <li> boxes sit flush with the widget box, but the <ul>'s
   own margin box sticks out 10px past it on each side. Below
   1180px the footer container is full-bleed, so that right-hand
   overhang landed outside the viewport and gave EVERY page
   documentElement.scrollWidth = innerWidth + 10 at 768/900/1024,
   i.e. a horizontal scrollbar. At 1440 the centred 1180px
   container had slack, so it never showed.

   Elementor itself guards against exactly this — widget-icon-list.css
   ships `.elementor-icon-list--layout-inline .elementor-widget-container
   { overflow: hidden }` — but this widget renders without the
   .elementor-widget-container wrapper (optimized DOM output), so
   that rule matches nothing and the guard silently does not apply.

   Reinstating the guard on the widget box itself is the whole fix.
   `clip` rather than `hidden`: it contains the overhang without
   creating a scroll container, so it cannot break position:sticky
   for any descendant. Nothing visible is clipped — the overhang is
   empty margin — and because the margins are left alone, the link
   spacing stays whatever the widget's Elementor spacing control
   says, so re-editing the footer in Elementor cannot desync it.
   ============================================================ */
footer .elementor-widget.elementor-icon-list--layout-inline {
    overflow-x: clip;
}
.spi-metrics { display: grid; grid-template-columns:repeat(4,1fr); gap: 16px; }
.spi-metric  { background: #fff; border-radius: 12px; padding: 20px 24px; }
.spi-metric__value { display: block; font-family: Teko, sans-serif; font-weight: 600;
                     font-size: 28px; color: #2670AA; }
.spi-metric__label { display: block; font-family: Roboto, sans-serif; font-size: 13px;
                     color: rgb(95, 98, 105); line-height: 15px; margin-top: 4px;}

/* ============================================================
   Mobile fix — stop the homepage scrolling sideways.
   Stray absolutely-positioned / wide Elementor elements in the
   "Meet the future…" section pushed ~130px past the viewport,
   causing a horizontal scrollbar on phones. Contain to viewport.
   ============================================================ */
@media (max-width: 767px) {
    html, body { overflow-x: hidden; max-width: 100%; }
    .spi-metrics { display: grid; grid-template-columns:repeat(2,1fr); gap: 12px; }

    /* keep Elementor containers within the screen width */
    .elementor-section, .e-con, .e-con-inner, .elementor-widget-wrap { max-width: 100%; }
}

/* ============================================================
   Loop grid — single-card shrink.
   A loop grid dropped straight into a flex container is a flex
   item, so it shrinks to its content. Once a filter narrows the
   result set to one card the whole grid collapses to that card's
   width instead of holding the row. Force it to fill the track.
   ============================================================ */
.e-con-inner > .elementor-widget-loop-grid { width: 100%; }

/* ============================================================
   Loop grid — mobile row height.
   "Equal height" sets grid-auto-rows to 1fr, which makes every
   row match the tallest card. At one column per row on mobile
   that leaves a tall gap under short cards (blog + case study).
   Only relax it on mobile so desktop keeps equal heights.
   ============================================================ */
@media (max-width: 767px) {
    .elementor-widget-loop-grid .elementor-grid { grid-auto-rows: auto; }
}
.post-type-archive-product .woocommerce-products-header,
.post-type-archive-product ul.products,
.post-type-archive-product .woocommerce-pagination {
    box-sizing: border-box;
    padding-left:  max(64px, calc((100% - 1440px) / 2)) !important;
    padding-right: max(64px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-result-count {
    margin-left:  max(64px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-ordering {
    margin-right: max(64px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-products-header {
    padding-top: 56px;
}
@media (max-width: 767px) {
    .post-type-archive-product .woocommerce-products-header {
        padding-top: 32px;
    }
    .post-type-archive-product .woocommerce-products-header,
.post-type-archive-product ul.products,
.post-type-archive-product .woocommerce-pagination {
    box-sizing: border-box;
    padding-left:  max(20px, calc((100% - 1440px) / 2)) !important;
    padding-right: max(20px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-result-count {
    margin-left:  max(20px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-ordering {
    margin-right: max(20px, calc((100% - 1440px) / 2)) !important;
}
.post-type-archive-product .woocommerce-products-header {
    padding-top: 56px;
}
.woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product{
    width: 100% !important;
}
}
body.post-type-archive-product {
    background-color: #edf3f9;
}

.post-type-archive-product ul.products {
    padding-bottom: 64px;
}

.post-type-archive-product ul.products li.product {
    box-sizing: border-box;
    background: #fff;
    border: 1px solid rgba(11, 17, 41, 0.1);
    border-radius: 12px;
    padding: 16px !important;
}
.post-type-archive-product ul.products li.product .price {
    color: #2670AA !important;
}
@media screen and (max-width:768px){
    .spi-fcart__body .mini_cart_item a:not(.remove){
        flex-direction: column !important;
        font-size: 18px !important;
        padding-right: 0 !important;
    }
    .woocommerce-page ul.product_list_widget li img, #spiFloatCart .spi-fcart__body .woocommerce-mini-cart-item img{
        width: 100% !important;
        height: auto !important;
    }
    .spi-fcart__body .spi-fcart__stepper-price{
        font-size:16px !important;
    }
    .spi-fcart__body .spi-fcart__qty-row{
            margin: 8px 0 0 0px !important;
    }
    .spi-fcart__body .woocommerce-mini-cart-item a.remove{
        bottom: 40px !important;
            top: auto !important; 
    }
    .spi-hero__cta .quantity{
        height: 42px !important;
    }
    .spi-hero__cta .quantity input.qty{
            width: 35px !important;
    }
    .spi-hero__cta .button.single_add_to_cart_button{
            height: 52px !important;
            padding: 0 40px !important;
    }
}
/* ---- shop grid: tighter, even spacing ---- */
body.post-type-archive-product ul.products {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 0 0 16px;
}
body.post-type-archive-product ul.products::before,
body.post-type-archive-product ul.products::after { display: none !important; }

body.post-type-archive-product ul.products li.product {
    width: auto !important;
    margin: 0 !important;
    float: none !important;
}
@media (max-width: 1024px) { body.post-type-archive-product ul.products { grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; } }
@media (max-width: 767px)  { body.post-type-archive-product ul.products { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; } }
@media (max-width: 479px)  { body.post-type-archive-product ul.products { grid-template-columns: minmax(0,1fr); } }

/* ---- Add to cart / View cart ---- */
body.post-type-archive-product ul.products li.product a.button,
body.post-type-archive-product ul.products li.product a.added_to_cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 44px;
    padding: 0 22px;
    border-radius: 999px;
    background-image: linear-gradient(158deg, #146698 0%, #3498c9 58%, #90e0ff 130%);
    background-color: transparent;
    color: #fff !important;
    border: none;
    font-family: Roboto, sans-serif;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-decoration: none;
}
body.post-type-archive-product ul.products li.product a.added_to_cart {
    background-image: none;
    background-color: transparent;
    color: #0b1129 !important;
    box-shadow: inset 0 0 0 1.5px rgba(11,17,41,.25);
    margin-left: 8px;
}
body.post-type-archive-product ul.products li.product a.button:hover { filter: brightness(1.07); }

/* ---- pagination ---- */
body.post-type-archive-product .woocommerce-pagination .page-numbers {
    color: #0b1129;
    border-color: rgba(11,17,41,.15);
}
body.post-type-archive-product .woocommerce-pagination .page-numbers:hover { color: #2670aa; }
body.post-type-archive-product .woocommerce-pagination .page-numbers.current { background: #0b1129; color: #fff; }
body .elementor-widget-loop-grid { scroll-margin-top: 200px !important; }
@media (min-width: 768px) and (max-width: 1024px) {
    body .elementor-widget-loop-grid { scroll-margin-top: 240px !important; }
}
@media (min-width: 1025px) {
    body .elementor-widget-loop-grid { scroll-margin-top: 180px !important; }
}