/*
Theme Name: Daun Teratai Landing
Theme URI: https://nd60.daunteratai.com
Description: Custom theme Daun Teratai product landing page
Author: KUDOS Design Collaboratory
Author URI: https://kudos.nyc
Template: hello-elementor
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://gnu.org
*/

/* ==========================================================================
   YOUR CUSTOM BREAKPOINT PADDING CSS CLASSES GO BELOW THIS LINE
   ========================================================================== */

.site-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

.elementor-widget-text-editor p:last-child,
.elementor-widget-text-editor h1:last-child,
.elementor-widget-text-editor h2:last-child {
    margin-bottom: 0;
}

.elementor-widget-text-editor a {
    color: inherit;
}

.elementor .elementor-button {
    min-height: 45px;
    line-height: 45px;
    padding-top: 0;
    padding-bottom: 0;
}
.elementor .elementor-button .elementor-button-icon {
    margin-right: 8px;
}

/* samakan dgn clamp utk .e-con-boxed */
.site-header {
    padding-left: 60px;
    padding-right: 60px;
}
.e-con-boxed {
    padding-left: 60px !important;
    padding-right: 60px !important;
}

/* ==========================================================================
   🎬 SCREEN BLEND MODE CONTAINER UTILITY
   Blends a container's background image with its background color.
   ========================================================================== */
.elementor .elementor-element.e-con.blend-screen {
    /* 1. Forces the engine to blend the image layer with the color layer beneath it */
    background-blend-mode: screen !important;
}
.elementor .elementor-element.e-con.blend-multiply {
    /* 1. Forces the engine to blend the image layer with the color layer beneath it */
    background-blend-mode: multiply !important;
}
.elementor .elementor-element.e-con.blend-softlight {
    /* 1. Forces the engine to blend the image layer with the color layer beneath it */
    background-blend-mode: soft-light !important;
}
.elementor .elementor-element.e-con.blend-colorburn {
    /* 1. Forces the engine to blend the image layer with the color layer beneath it */
    background-blend-mode: color-burn !important;
}

/* ==========================================================================
   GLOBAL ELEMENTOR BUTTON SVG FILL COLOR INHERITANCE
   ========================================================================== */

/* Target every native Elementor button wrapper and its inner vector shapes */
.elementor-button .elementor-button-icon svg,
.elementor-button .elementor-button-icon svg path,
.elementor-button .elementor-button-icon svg circle,
.elementor-button .elementor-button-icon svg rect,
.elementor-button .elementor-button-icon svg polyline,
.elementor-button .elementor-button-icon svg polygon {
    fill: currentColor !important;
    /* Force stroke-based SVGs to inherit color as well */
    stroke: currentColor !important; 
    /* Creates a smooth fading transition when hovering */
    transition: fill 0.3s ease, stroke 0.3s ease; 
}

/* Apply the underline to all text links by default */
.elementor-widget-text-editor a:hover {
    text-decoration: underline !important;
    text-underline-offset: 2px;
    text-decoration-color: currentColor !important;
    transition: text-decoration-color 0.3s ease;
}

/* Strip the underline if the link contains an image or vector shape */
.elementor-widget-text-editor a img,
.elementor-widget-text-editor a svg,
.elementor-widget-text-editor a div,
.elementor-widget-text-editor a figure,
.elementor-widget-text-editor a picture {
    text-decoration: none !important;
    display: inline-block; /* Prevents text-decoration from bleeding down */
}

.elementor-widget-text-editor ul {
    padding-left: 20px;
}

h1, h2, h3, h4, h5, h6 {
    margin-top: 0 !important;
}

.site-footer {
    display: none;
}

.sec-spacing-s {
    padding-top: 40px;
    padding-bottom: 40px;
}

.sec-spacing-m {
    padding-top: 70px;
    padding-bottom: 70px;
}

.sec-spacing-mt {
    padding-top: 70px;
}

.sec-spacing-l {
    padding-top: 100px;
    padding-bottom: 100px;
}

.sec-spacing-lt {
    padding-top: 100px;
}

.elementor-element.cont-spacing-s,
.e-con .elementor-widget.elementor-widget.cont-spacing-s
{
    margin-bottom: 12px;
}

.elementor-element.cont-spacing-m,
.e-con .elementor-widget.elementor-widget.cont-spacing-m
{
    margin-bottom: 24px;
}

.elementor-element.cont-spacing-l,
.e-con .elementor-widget.elementor-widget.cont-spacing-l 
{
    margin-bottom: 40px;
}

.elementor-element.cont-spacing-xl,
.e-con .elementor-widget.elementor-widget.cont-spacing-xl 
{
    margin-bottom: 64px;
}

.round-image,
.round-image .e-con-inner {
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
}

.image-cover {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rounded-container {
    border-radius: 20px;
    overflow: hidden;
}

.grid-margin-x {
    column-gap: 28px;
}
.grid-padding-x {
    padding-left: 28px;
    padding-right: 28px;
}
.grid-padding-y {
    padding-top: 28px;
    padding-bottom: 28px;
}
.grid-counter-padding {
    margin-left: -28px;
    margin-right: -28px;
    width: calc(100% + 56px);
}


@media (max-width: 1024px) {
    /* samakan dgn clamp utk .e-con-boxed */
    .site-header {
        padding-left: 32px;
        padding-right: 32px;
    }
    .site-header .header-inner {
        padding-left: 0;
        padding-right: 0;
    }
    .e-con-boxed {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}

@media (max-width: 767px) {
    /* samakan dgn clamp utk .e-con-boxed */
    .site-header {
        padding-left: 16px;
        padding-right: 16px;
    }
    .e-con-boxed {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    .sec-spacing-s {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    
    .sec-spacing-m {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .sec-spacing-l {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    .grid-margin-x {
        column-gap: 16px;
    }
    .grid-padding-x {
        padding-left: 16px;
        padding-right: 16px;
    }
    .grid-padding-y {
        padding-top: 16px;
        padding-bottom: 16px;
    }
    .sm-grid-padding-y {
        padding-left: 0 !important;
        padding-left: 0 !important;
        padding-top: 16px;
        padding-bottom: 16px;
    }
    .grid-counter-padding {
        margin-left: -16px;
        margin-right: -16px;
        width: calc(100% + 32px);
    }
    .sm-reverse-counter-padding {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
    .elementor .e-f593fd7-67a5622 {
        row-gap: 0 !important;
    }
    .elementor .elementor-button {
        min-height: 32px;
        line-height: 32px;
        padding-top: 0;
        padding-bottom: 0;
    }
}

.caption {
    font-family: var(--e-global-typography-2c9a921-font-family);
    font-weight: var(--e-global-typography-2c9a921-font-weight);
    font-size: var(--e-global-typography-2c9a921-font-size);
    line-height: var(--e-global-typography-2c9a921-line-height);
    text-transform: uppercase;
}