.elementor-906 .elementor-element.elementor-element-487c40e{--display:flex;}:root{--page-title-display:none;}body.elementor-page-906{margin:0px 0px 0px 0px;}/* Start custom CSS for html, class: .elementor-element-05b4d5a *//* =========================================================
   EKBAAL BRAND PALETTE
========================================================= */

:root {
    --ekc-purple: #31146a;
    --ekc-purple-dark: #1f0c45;
    --ekc-purple-mid: #5b3d8f;
    --ekc-purple-soft: #8069a9;
    --ekc-lilac: #e8e1f2;
    --ekc-lilac-soft: #f2eef8;
    --ekc-lilac-light: #faf8fd;
    --ekc-yellow: #f5e61b;
    --ekc-yellow-deep: #d8c900;
    --ekc-ink: #171717;
    --ekc-text-muted: #625d6c;
    --ekc-white: #ffffff;
}

/* =========================================================
   CONTENT MARKETING HERO
   STANDALONE VERSION
========================================================= */

.ekc-cm-hero,
.ekc-cm-hero *,
.ekc-cm-hero *::before,
.ekc-cm-hero *::after {
    box-sizing: border-box;
}


.ekc-cm-hero {

    position: relative;

    width: 100%;

    min-height: 930px;

    overflow: hidden;

    padding:
        100px
        0
        0;

    font-family:
        "Poppins",
        "Plus Jakarta Sans",
        Arial,
        sans-serif;

    background:

        radial-gradient(
            circle at 50% 100%,
            rgba(49,20,106,.13),
            transparent 34%
        ),

        radial-gradient(
            circle at 8% 5%,
            rgba(91,61,143,.15),
            transparent 25%
        ),

        linear-gradient(
            135deg,
            #f1edf8 0%,
            #faf8fd 48%,
            #eee8f7 100%
        );

}


.ekc-cm-container {

    position: relative;

    z-index: 3;

    width:
        min(
            1280px,
            calc(100% - 40px)
        );

    margin:
        0 auto;

}



/* =========================================================
   BACKGROUND DECORATIONS
========================================================= */

.ekc-cm-bg-circle {

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

}


.ekc-cm-bg-circle-one {

    width: 330px;

    height: 330px;

    top: -215px;

    left: -120px;

    background:
        rgba(49,20,106,.08);

}


.ekc-cm-bg-circle-two {

    width: 290px;

    height: 290px;

    right: -145px;

    bottom: 20px;

    background:
        rgba(49,20,106,.065);

}


.ekc-cm-bg-dot {

    position: absolute;

    width: 20px;

    height: 20px;

    border-radius: 50%;

    background:
        rgba(49,20,106,.12);

    pointer-events: none;

}


.ekc-cm-bg-dot-one {

    top: 90px;

    left: 9%;

}


.ekc-cm-bg-dot-two {

    top: 250px;

    right: 10%;

}


.ekc-cm-bg-dot-three {

    width: 12px;

    height: 12px;

    left: 18%;

    bottom: 260px;

}



/* =========================================================
   HERO CONTENT
========================================================= */

.ekc-cm-hero-content {

    position: relative;

    z-index: 20;

    max-width: 920px;

    margin:
        0 auto;

    text-align: center;

}



/* LABEL */

.ekc-cm-label {

    width: fit-content;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 20px;

    padding:
        9px
        16px;

    border:
        1px solid
        rgba(49,20,106,.14);

    border-radius: 999px;

    background:
        rgba(255,255,255,.70);

    backdrop-filter:
        blur(15px);

    color:
        var(--ekc-purple);

    font-size: 10px;

    font-weight: 700;

    letter-spacing: .09em;

    box-shadow:
        0 12px 32px
        rgba(49,20,106,.07);

}


.ekc-cm-label-dot {

    position: relative;

    width: 10px;

    height: 10px;

    border-radius: 50%;

    background:
        var(--ekc-purple);

}


.ekc-cm-label-dot::after {

    content: "";

    position: absolute;

    inset: -5px;

    border:
        1px solid
        rgba(49,20,106,.25);

    border-radius: 50%;

    animation:
        ekcCmLabelPulse
        2s
        ease-out
        infinite;

}



/* =========================================================
   TITLE
========================================================= */

.ekc-cm-title {

    margin: 0;

    color:
        var(--ekc-ink);

    font-size:
        clamp(
            54px,
            6vw,
            92px
        );

    line-height: .97;

    letter-spacing: -.06em;

    font-weight: 750;

}


.ekc-cm-title-line {

    display: block;

    margin-top: 6px;

}


.ekc-cm-purple-text {

    color:
        var(--ekc-purple);

}


.ekc-cm-yellow-text {

    position: relative;

    color:
        var(--ekc-yellow-deep);

}


.ekc-cm-yellow-text::after {

    content: "";

    position: absolute;

    left: 3%;

    right: 3%;

    bottom: -3px;

    height: 7px;

    border-radius: 999px;

    background:
        rgba(240,215,0,.22);

    transform:
        scaleX(0);

    transform-origin:
        left;

}


.ekc-cm-hero.ekc-cm-active
.ekc-cm-yellow-text::after {

    animation:
        ekcCmUnderline
        1s
        cubic-bezier(.16,1,.3,1)
        .8s
        forwards;

}



/* =========================================================
   DESCRIPTION
========================================================= */

.ekc-cm-description {

    max-width: 670px;

    margin:
        25px
        auto
        0;

    color:
        var(--ekc-text-muted);

    font-size:
        clamp(
            16px,
            1.3vw,
            18px
        );

    line-height:
        1.7;

}



/* =========================================================
   BUTTONS
========================================================= */

.ekc-cm-actions {

    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;

    gap: 15px;

    margin-top: 30px;

}


.ekc-cm-primary-button,
.ekc-cm-secondary-button {

    text-decoration:
        none;

}


/* PRIMARY */

.ekc-cm-primary-button {

    min-height: 60px;

    display: inline-flex;

    align-items: center;
    

    gap: 18px;

    padding:
        7px
        8px
        7px
        25px;

    border-radius: 999px;

    background:
        linear-gradient(135deg, var(--ekc-purple), var(--ekc-purple-dark));

    color:
        #ffffff !important;

    font-size: 14px;

    font-weight: 600;

    box-shadow:
        0 16px 37px
        rgba(49,20,106,.22);

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}


.ekc-cm-primary-button:hover {

    color:
        #ffffff;

    transform:
        translateY(-4px);

    box-shadow:
        0 25px 50px
        rgba(49,20,106,.28);

}


.ekc-cm-button-arrow {

    width: 46px;

    height: 46px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background:
        rgba(255,255,255,.14);

    font-size: 20px;

    transition:
        transform .35s ease,
        background .35s ease,
        color .35s ease;

}


.ekc-cm-primary-button:hover
.ekc-cm-button-arrow {

    background:
        var(--ekc-yellow);

    color:
        var(--ekc-ink);

    transform:
        translateX(4px);

}



/* SECONDARY */

.ekc-cm-secondary-button {

    min-height: 60px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding:
        0
        27px;

    border:
        1px solid
        rgba(49,20,106,.24);

    border-radius: 999px;

    background:
        rgba(255,255,255,.22);

    color: var(--ekc-purple) !important;

    font-size: 14px;

    font-weight: 600;

    transition:
        transform .35s ease,
        background .35s ease;

}


.ekc-cm-secondary-button:hover {

    color:
        var(--ekc-purple);

    background:
        rgba(255,255,255,.70);

    transform:
        translateY(-4px);

}



/* =========================================================
   CARTOON STAGE
========================================================= */

.ekc-cm-cartoon-stage {

    position: relative;

    z-index: 5;

    width:
        min(
            1100px,
            100%
        );

    height: 490px;

    margin:
        25px
        auto
        0;

    perspective:
        1400px;

}



/* GLOW */

.ekc-cm-cartoon-glow {

    position: absolute;

    width: 700px;

    height: 300px;

    left: 50%;

    bottom: 0;

    border-radius: 50%;

    background:
        radial-gradient(
            ellipse,
            rgba(49,20,106,.16),
            transparent 68%
        );

    filter:
        blur(10px);

    transform:
        translateX(-50%);

}



/* =========================================================
   DASHBOARD
========================================================= */

.ekc-cm-dashboard {

    position: absolute;

    z-index: 5;

    width: 470px;

    height: 285px;

    left: 50%;

    bottom: 25px;

    padding:
        24px;

    overflow: hidden;

    border:
        1px solid
        rgba(49,20,106,.13);

    border-radius: 32px;

    background:
        rgba(255,255,255,.95);

    box-shadow:
        0 35px 75px
        rgba(49,20,106,.14);

    transform:
        translateX(-50%);

}


.ekc-cm-dashboard::before {

    content: "";

    position: absolute;

    width: 190px;

    height: 190px;

    right: -80px;

    top: -110px;

    border-radius: 50%;

    background:
        rgba(245,230,27,.14);

}



/* DASHBOARD HEADER */

.ekc-cm-dashboard-header {

    position: relative;

    z-index: 2;

    display: flex;

    align-items: center;

    justify-content: space-between;

}


.ekc-cm-dashboard-header strong {

    display: block;

    color:
        #202020;

    font-size:
        13px;

}


.ekc-cm-dashboard-header
> div:first-child span {

    display: block;

    margin-top: 2px;

    color:
        #aaaaaa;

    font-size:
        8px;

}


.ekc-cm-live-status {

    display: flex;

    align-items: center;

    gap: 7px;

    color:
        #a3a3a3;

    font-size:
        7px;

    font-weight: 700;

    letter-spacing:
        .1em;

}


.ekc-cm-live-status span {

    width: 8px;

    height: 8px;

    border-radius: 50%;

    background:
        var(--ekc-purple);

    animation:
        ekcCmLivePulse
        1.7s
        infinite;

}



/* DASHBOARD CONTENT */

.ekc-cm-dashboard-content {

    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        1fr
        135px;

    gap: 18px;

    margin-top: 24px;

}


.ekc-cm-dashboard-content-preview {

    display: flex;

    align-items: center;

    gap: 14px;

}



/* VIDEO THUMBNAIL */

.ekc-cm-video-thumbnail {

    width: 80px;

    height: 80px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border-radius: 20px;

    background:
        var(--ekc-purple);

    box-shadow:
        0 15px 30px
        rgba(49,20,106,.2);

}


.ekc-cm-video-thumbnail span {

    color:
        #ffffff;

    font-size:
        22px;

    animation:
        ekcCmPlayPulse
        2.5s
        ease-in-out
        infinite;

}



/* VIDEO COPY */

.ekc-cm-video-copy strong {

    display: block;

    color:
        #222222;

    font-size:
        13px;

    line-height:
        1.25;

}


.ekc-cm-video-copy i {

    display: block;

    width: 85px;

    height: 6px;

    margin-top: 8px;

    border-radius: 999px;

    background:
        var(--ekc-lilac);

}


.ekc-cm-video-copy
i:last-child {

    width:
        60px;

}



/* DASHBOARD STAT */

.ekc-cm-dashboard-stat {

    padding:
        15px;

    border:
        1px solid
        rgba(49,20,106,.1);

    border-radius: 20px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f8f6fb
        );

}


.ekc-cm-dashboard-stat > span {

    display: block;

    color:
        #aaaaaa;

    font-size:
        7px;

    font-weight:
        700;

    letter-spacing:
        .1em;

}


.ekc-cm-dashboard-stat strong {

    display: block;

    margin-top:
        6px;

    color:
        var(--ekc-purple);

    font-size:
        26px;

}



/* MINI TREND */

.ekc-cm-stat-trend {

    height: 34px;

    display: flex;

    align-items: flex-end;

    gap:
        4px;

    margin-top:
        6px;

}


.ekc-cm-stat-trend i {

    width: 6px;

    border-radius: 999px;

    background:
        var(--ekc-yellow);

}


.ekc-cm-stat-trend
i:nth-child(1) {

    height:
        8px;

}


.ekc-cm-stat-trend
i:nth-child(2) {

    height:
        15px;

}


.ekc-cm-stat-trend
i:nth-child(3) {

    height:
        22px;

}


.ekc-cm-stat-trend
i:nth-child(4) {

    height:
        30px;

}



/* =========================================================
   DASHBOARD BARS
========================================================= */

.ekc-cm-dashboard-bars {

    position: absolute;

    z-index: 2;

    left: 24px;

    right: 24px;

    bottom: 20px;

    height: 74px;

    display: flex;

    align-items: flex-end;

    gap:
        12px;

}


.ekc-cm-dashboard-bars span {

    flex: 1;

    height:
        var(--bar-height);

    min-height:
        14px;

    border-radius:
        8px
        8px
        3px
        3px;

    background:
        linear-gradient(
            180deg,
            var(--ekc-purple-mid), var(--ekc-purple)
        );

    transform:
        scaleY(0);

    transform-origin:
        bottom;

}


.ekc-cm-active
.ekc-cm-dashboard-bars span {

    animation:
        ekcCmBarGrow
        .9s
        cubic-bezier(.16,1,.3,1)
        forwards;

}


.ekc-cm-dashboard-bars
span:nth-child(1) {
    animation-delay: .5s;
}

.ekc-cm-dashboard-bars
span:nth-child(2) {
    animation-delay: .6s;
}

.ekc-cm-dashboard-bars
span:nth-child(3) {
    animation-delay: .7s;
}

.ekc-cm-dashboard-bars
span:nth-child(4) {
    animation-delay: .8s;
}

.ekc-cm-dashboard-bars
span:nth-child(5) {
    animation-delay: .9s;
}

.ekc-cm-dashboard-bars
span:nth-child(6) {
    animation-delay: 1s;
}



/* =========================================================
   PERSON COMMON
========================================================= */

.ekc-cm-person {

    position: absolute;

    z-index: 9;

    width:
        220px;

    height:
        300px;

    bottom:
        0;

}


.ekc-cm-person-left {

    left:
        20px;

}


.ekc-cm-person-right {

    right:
        20px;

}



/* =========================================================
   HEAD
========================================================= */

.ekc-cm-head {

    position: absolute;

    z-index: 5;

    width: 92px;

    height: 105px;

    top: 25px;

    left: 50%;

    border-radius:
        46%
        46%
        43%
        43%;

    background:
        #ffc99f;

    box-shadow:
        inset -8px -5px 0
        rgba(200,115,75,.07);

    transform:
        translateX(-50%);

}



/* HAIR */

.ekc-cm-hair {

    position: absolute;

    width: 100px;

    height: 57px;

    left: -4px;

    top: -10px;

    background:
        #372732;

}


.ekc-cm-hair-left {

    border-radius:
        60px
        52px
        34px
        25px;

    transform:
        rotate(-4deg);

}


.ekc-cm-hair-left::after {

    content: "";

    position: absolute;

    width: 30px;

    height: 55px;

    left: -5px;

    top: 22px;

    border-radius: 50%;

    background:
        #372732;

}


.ekc-cm-hair-right {

    border-radius:
        55px
        60px
        25px
        28px;

}


.ekc-cm-hair-right::after {

    content: "";

    position: absolute;

    width: 30px;

    height: 40px;

    right: -7px;

    top: 8px;

    border-radius: 50%;

    background:
        #372732;

}



/* EYES */

.ekc-cm-eye {

    position: absolute;

    width: 7px;

    height: 10px;

    top: 53px;

    border-radius: 50%;

    background:
        #252025;

    animation:
        ekcCmBlink
        4.5s
        infinite;

}


.ekc-cm-eye-one {

    left:
        27px;

}


.ekc-cm-eye-two {

    right:
        27px;

}



/* NOSE */

.ekc-cm-nose {

    position: absolute;

    width: 5px;

    height: 6px;

    left: 50%;

    top: 64px;

    border-radius:
        50%;

    background:
        rgba(198,116,84,.23);

    transform:
        translateX(-50%);

}



/* SMILE */

.ekc-cm-smile {

    position: absolute;

    width: 22px;

    height: 11px;

    left: 50%;

    bottom: 18px;

    border-bottom:
        3px solid
        #a15159;

    border-radius:
        0
        0
        20px
        20px;

    transform:
        translateX(-50%);

}



/* =========================================================
   BODY
========================================================= */

.ekc-cm-body {

    position: absolute;

    width: 145px;

    height: 157px;

    top: 112px;

    left: 50%;

    border-radius:
        48px
        48px
        25px
        25px;

    transform:
        translateX(-50%);

}


.ekc-cm-body-left {

    background:
        linear-gradient(
            145deg,
            #8068ad,
            #56348d
        );

}


.ekc-cm-body-right {

    background:
        linear-gradient(
            145deg,
            #624497,
            #35186d
        );

}



/* =========================================================
   ARMS
========================================================= */

.ekc-cm-arm {

    position: absolute;

    width: 29px;

    height: 105px;

    border-radius:
        999px;

    background:
        inherit;

}


.ekc-cm-writing-arm {

    right:
        -5px;

    top:
        35px;

    transform:
        rotate(-38deg);

    transform-origin:
        top center;

    animation:
        ekcCmWritingArm
        2.2s
        ease-in-out
        infinite;

}


.ekc-cm-right-arm {

    left:
        -4px;

    top:
        40px;

    transform:
        rotate(35deg);

    animation:
        ekcCmRightArm
        3s
        ease-in-out
        infinite;

}



/* HAND */

.ekc-cm-writing-hand {

    position: absolute;

    width: 28px;

    height: 28px;

    right:
        -49px;

    top:
        88px;

    border-radius:
        50%;

    background:
        #ffc99f;

    animation:
        ekcCmWritingHand
        2.2s
        ease-in-out
        infinite;

}



/* PENCIL */

.ekc-cm-pencil {

    position: absolute;

    width: 7px;

    height: 57px;

    left: 10px;

    top: -39px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            var(--ekc-yellow),
            #ddc917
        );

    transform:
        rotate(26deg);

}



/* =========================================================
   LAPTOP
========================================================= */

.ekc-cm-laptop {

    position: absolute;

    z-index: 10;

    width: 155px;

    height: 96px;

    left: 4px;

    bottom: 4px;

    border-radius:
        10px
        10px
        18px
        18px;

    background:
        linear-gradient(
            145deg,
            #8d8b99,
            #5f5b6d
        );

    box-shadow:
        0 16px 30px
        rgba(49,20,106,.16);

    transform:
        rotate(4deg);

}


.ekc-cm-laptop span {

    position: absolute;

    left: 50%;

    top: 50%;

    color:
        var(--ekc-yellow);

    font-size:
        22px;

    transform:
        translate(-50%,-50%);

}



/* =========================================================
   NOTEBOOK
========================================================= */

.ekc-cm-notebook {

    position: absolute;

    z-index: 11;

    width: 92px;

    height: 65px;

    right: -10px;

    bottom: 8px;

    padding:
        15px;

    border-radius:
        9px;

    background:
        #fffef5;

    box-shadow:
        0 12px 25px
        rgba(49,20,106,.12);

    transform:
        rotate(-8deg);

}


.ekc-cm-notebook i {

    display: block;

    height: 4px;

    margin-bottom:
        7px;

    border-radius:
        999px;

    background:
        #ddd4ea;

}



/* =========================================================
   TABLET
========================================================= */

.ekc-cm-tablet {

    position: absolute;

    z-index: 10;

    width: 125px;

    height: 97px;

    left: 48px;

    bottom: 6px;

    padding:
        8px;

    border-radius:
        15px;

    background:
        #352844;

    box-shadow:
        0 15px 30px
        rgba(49,20,106,.18);

    transform:
        rotate(-5deg);

}


.ekc-cm-tablet-screen {

    width: 100%;

    height: 100%;

    display: flex;

    align-items: flex-end;

    gap:
        7px;

    padding:
        15px;

    border-radius:
        10px;

    background:
        linear-gradient(
            145deg,
            #eee9f5,
            #cfc3df
        );

}


.ekc-cm-tablet-screen span {

    flex: 1;

    border-radius:
        6px
        6px
        2px
        2px;

    background:
        var(--ekc-purple);

}


.ekc-cm-tablet-screen
span:nth-child(1) {

    height:
        25px;

}


.ekc-cm-tablet-screen
span:nth-child(2) {

    height:
        48px;

}


.ekc-cm-tablet-screen
span:nth-child(3) {

    height:
        38px;

}



/* =========================================================
   SPEECH BUBBLES
========================================================= */

.ekc-cm-speech {

    position: absolute;

    z-index: 15;

    width: 58px;

    height: 58px;

    display: grid;

    place-items: center;

    border-radius:
        19px
        19px
        19px
        6px;

    background:
        #ffffff;

    box-shadow:
        0 15px 32px
        rgba(49,20,106,.13);

}


.ekc-cm-idea-bubble {

    top: -6px;

    right: -7px;

    animation:
        ekcCmSpeechFloat
        4s
        ease-in-out
        infinite;

}


.ekc-cm-message-bubble {

    top: 0;

    left: -9px;

    display: flex;

    align-items: center;

    justify-content: center;

    gap:
        4px;

    animation:
        ekcCmSpeechFloat
        4.6s
        ease-in-out
        infinite;

}


.ekc-cm-message-bubble span {

    width: 6px;

    height: 6px;

    border-radius: 50%;

    background:
        var(--ekc-purple);

}



/* CSS BULB */

.ekc-cm-bulb {

    position: relative;

    width: 24px;

    height: 29px;

    border-radius:
        50%
        50%
        45%
        45%;

    background:
        var(--ekc-yellow);

    box-shadow:
        0 0 20px
        rgba(245,230,27,.55);

}


.ekc-cm-bulb::after {

    content: "";

    position: absolute;

    width: 12px;

    height: 8px;

    left: 50%;

    bottom: -7px;

    border-radius:
        2px
        2px
        5px
        5px;

    background:
        #5b3d8f;

    transform:
        translateX(-50%);

}



/* =========================================================
   CAMERA
========================================================= */

.ekc-cm-camera {

    position: absolute;

    z-index: 10;

    width: 82px;

    height: 185px;

    right: 180px;

    bottom:
        -5px;

}


.ekc-cm-camera-body {

    position: relative;

    width:
        76px;

    height:
        56px;

    border-radius:
        13px;

    background:
        linear-gradient(
            145deg,
            #54318c,
            #28124f
        );

    animation:
        ekcCmCameraFloat
        4s
        ease-in-out
        infinite;

}


.ekc-cm-camera-lens {

    position: absolute;

    width: 30px;

    height: 30px;

    left: 50%;

    top: 50%;

    border:
        6px solid
        #29232e;

    border-radius:
        50%;

    background:
        #8d8598;

    transform:
        translate(-50%,-50%);

}


.ekc-cm-camera-stick {

    position: absolute;

    width: 6px;

    height: 110px;

    left: 35px;

    top: 53px;

    border-radius:
        999px;

    background:
        #342c3a;

}


.ekc-cm-camera-leg {

    position: absolute;

    width: 6px;

    height: 67px;

    left: 35px;

    bottom: -3px;

    border-radius:
        999px;

    background:
        #342c3a;

    transform-origin:
        top;

}


.ekc-cm-camera-leg-one {

    transform:
        rotate(28deg);

}


.ekc-cm-camera-leg-two {

    transform:
        rotate(-28deg);

}



/* =========================================================
   FLOATING BUBBLE
========================================================= */

.ekc-cm-floating-bubble,
.ekc-cm-floating-stat,
.ekc-cm-calendar {

    position: absolute;

    z-index: 16;

    border:
        1px solid
        rgba(49,20,106,.13);

    background:
        rgba(255,255,255,.94);

    backdrop-filter:
        blur(16px);

    box-shadow:
        0 18px 43px
        rgba(49,20,106,.13);

}



/* LIKE */

.ekc-cm-floating-bubble {

    width: 58px;

    height: 58px;

    display: grid;

    place-items: center;

    border-radius:
        19px
        19px
        19px
        7px;

}


.ekc-cm-like-bubble {

    left: 3px;

    top: 155px;

    color:
        #ef5572;

    font-size:
        26px;

    animation:
        ekcCmFloatA
        5s
        ease-in-out
        infinite;

}



/* FLOATING STATS */

.ekc-cm-floating-stat {

    min-width:
        135px;

    padding:
        16px;

    border-radius:
        20px;

}


.ekc-cm-floating-stat > span {

    display: block;

    margin-bottom:
        5px;

    color:
        #aaaaaa;

    font-size:
        7px;

    font-weight:
        700;

    letter-spacing:
        .1em;

}


.ekc-cm-floating-stat strong {

    display: block;

    color:
        var(--ekc-purple);

    font-size:
        24px;

}


.ekc-cm-engagement-card {

    left:
        150px;

    bottom:
        50px;

    animation:
        ekcCmFloatA
        6s
        ease-in-out
        infinite;

}


.ekc-cm-reach-card {

    right:
        60px;

    top:
        120px;

    animation:
        ekcCmFloatB
        5.6s
        ease-in-out
        infinite;

}


.ekc-cm-reach-card b {

    position: absolute;

    right:
        14px;

    bottom:
        11px;

    color:
        var(--ekc-yellow-deep);

    font-size:
        22px;

}



/* MINI LINE */

.ekc-cm-mini-line {

    height: 25px;

    display: flex;

    align-items: flex-end;

    gap:
        4px;

    margin-top:
        6px;

}


.ekc-cm-mini-line i {

    width: 16px;

    border-radius:
        999px;

    background:
        var(--ekc-yellow);

}


.ekc-cm-mini-line
i:nth-child(1) {

    height:
        6px;

}


.ekc-cm-mini-line
i:nth-child(2) {

    height:
        10px;

}


.ekc-cm-mini-line
i:nth-child(3) {

    height:
        15px;

}


.ekc-cm-mini-line
i:nth-child(4) {

    height:
        22px;

}



/* =========================================================
   CALENDAR
========================================================= */

.ekc-cm-calendar {

    width:
        72px;

    height:
        78px;

    right:
        3px;

    bottom:
        66px;

    padding:
        12px;

    border-radius:
        20px;

    animation:
        ekcCmFloatB
        5.3s
        ease-in-out
        infinite;

}


.ekc-cm-calendar-top {

    width:
        100%;

    height:
        8px;

    margin-bottom:
        10px;

    border-radius:
        999px;

    background:
        var(--ekc-purple);

}


.ekc-cm-calendar-grid {

    display: grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:
        5px;

}


.ekc-cm-calendar-grid span {

    aspect-ratio:
        1;

    border-radius:
        3px;

    background:
        #e8e1f2;

}


.ekc-cm-calendar-grid
span.active {

    background:
        var(--ekc-yellow);

}



/* =========================================================
   SPARKLES
========================================================= */

.ekc-cm-spark {

    position: absolute;

    z-index: 3;

    color:
        var(--ekc-yellow-deep);

    font-size:
        25px;

    animation:
        ekcCmSpark
        3s
        ease-in-out
        infinite;

}


.ekc-cm-spark-one {

    left:
        24%;

    top:
        22px;

}


.ekc-cm-spark-two {

    right:
        25%;

    top:
        55px;

    animation-delay:
        1s;

}


.ekc-cm-spark-three {

    left:
        52%;

    top:
        110px;

    animation-delay:
        2s;

}



/* =========================================================
   REVEAL
========================================================= */

.ekc-cm-reveal {

    opacity:
        0;

    filter:
        blur(7px);

    transform:
        translateY(45px);

    transition:

        opacity
        .9s
        ease,

        filter
        .9s
        ease,

        transform
        .9s
        cubic-bezier(.16,1,.3,1);

}


.ekc-cm-reveal.ekc-cm-visible {

    opacity:
        1;

    filter:
        blur(0);

    transform:
        translateY(0);

}



/* STAGGER */

.ekc-cm-label {

    transition-delay:
        .05s;

}


.ekc-cm-title {

    transition-delay:
        .14s;

}


.ekc-cm-description {

    transition-delay:
        .25s;

}


.ekc-cm-actions {

    transition-delay:
        .35s;

}


.ekc-cm-cartoon-stage {

    transition-delay:
        .25s;

}



/* =========================================================
   KEYFRAMES
========================================================= */

@keyframes ekcCmLabelPulse {

    from {

        opacity:
            .8;

        transform:
            scale(.8);

    }

    to {

        opacity:
            0;

        transform:
            scale(1.8);

    }

}


@keyframes ekcCmUnderline {

    from {

        transform:
            scaleX(0);

    }

    to {

        transform:
            scaleX(1);

    }

}


@keyframes ekcCmBarGrow {

    from {

        transform:
            scaleY(0);

    }

    to {

        transform:
            scaleY(1);

    }

}


@keyframes ekcCmLivePulse {

    0%,
    100% {

        box-shadow:
            0 0 0 0
            rgba(49,20,106,.2);

    }

    50% {

        box-shadow:
            0 0 0 9px
            rgba(49,20,106,0);

    }

}


@keyframes ekcCmPlayPulse {

    0%,
    100% {

        transform:
            scale(1);

    }

    50% {

        transform:
            scale(1.13);

    }

}


@keyframes ekcCmBlink {

    0%,
    44%,
    48%,
    100% {

        transform:
            scaleY(1);

    }

    45%,
    47% {

        transform:
            scaleY(.08);

    }

}


@keyframes ekcCmWritingArm {

    0%,
    100% {

        transform:
            rotate(-38deg);

    }

    50% {

        transform:
            rotate(-29deg);

    }

}


@keyframes ekcCmWritingHand {

    0%,
    100% {

        transform:
            translate(0,0);

    }

    50% {

        transform:
            translate(6px,4px);

    }

}


@keyframes ekcCmRightArm {

    0%,
    100% {

        transform:
            rotate(35deg);

    }

    50% {

        transform:
            rotate(29deg);

    }

}


@keyframes ekcCmSpeechFloat {

    0%,
    100% {

        transform:
            translateY(0);

    }

    50% {

        transform:
            translateY(-10px);

    }

}


@keyframes ekcCmCameraFloat {

    0%,
    100% {

        transform:
            rotate(-1deg);

    }

    50% {

        transform:
            rotate(2deg);

    }

}


@keyframes ekcCmFloatA {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(-2deg);

    }

    50% {

        transform:
            translateY(-12px)
            rotate(1deg);

    }

}


@keyframes ekcCmFloatB {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(2deg);

    }

    50% {

        transform:
            translateY(-14px)
            rotate(-1deg);

    }

}


@keyframes ekcCmSpark {

    0%,
    100% {

        opacity:
            .35;

        transform:
            scale(.7)
            rotate(0deg);

    }

    50% {

        opacity:
            1;

        transform:
            scale(1.2)
            rotate(20deg);

    }

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1050px) {

    .ekc-cm-hero {

        min-height:
            870px;

    }


    .ekc-cm-cartoon-stage {

        transform:
            scale(.86);

        transform-origin:
            center top;

        margin-bottom:
            -65px;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .ekc-cm-hero {

        min-height:
            800px;

        padding:
            55px
            0
            0;

    }


    .ekc-cm-container {

        width:
            calc(100% - 28px);

    }


    .ekc-cm-title {

        font-size:
            clamp(
                45px,
                13vw,
                65px
            );

    }


    .ekc-cm-description {

        font-size:
            15px;

    }


    .ekc-cm-actions {

        flex-direction:
            column;

        align-items:
            stretch;

    }


    .ekc-cm-primary-button,
    .ekc-cm-secondary-button {

        width:
            100%;

    }


    .ekc-cm-primary-button {

        justify-content:
            space-between;

    }


    .ekc-cm-cartoon-stage {

        width:
            760px;

        height:
            450px;

        left:
            50%;

        margin-top:
            25px;

        margin-bottom:
            -110px;

        transform:
            translateX(-50%)
            scale(.5);

        transform-origin:
            center top;

    }

}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .ekc-cm-hero {

        min-height:
            760px;

    }


    .ekc-cm-title {

        font-size:
            44px;

    }


    .ekc-cm-cartoon-stage {

        transform:
            translateX(-50%)
            scale(.45);

        margin-bottom:
            -130px;

    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .ekc-cm-hero *,
    .ekc-cm-hero *::before,
    .ekc-cm-hero *::after {

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e2149f7 *//* =========================================================
   CONTENT LAB — SECTION 2
========================================================= */

.ekc-lab-section,
.ekc-lab-section *,
.ekc-lab-section *::before,
.ekc-lab-section *::after {

    box-sizing:
        border-box;

}


.ekc-lab-section {

    --ekc-lab-purple: #31146a;
    --ekc-lab-purple-dark: #1f0c45;
    --ekc-lab-purple-mid: #5b3d8f;
    --ekc-lab-purple-soft: #8069a9;
    --ekc-lab-lilac: #e8e1f2;
    --ekc-lab-lilac-light: #faf8fd;
    --ekc-lab-yellow: #f5e61b;
    --ekc-lab-ink: #171717;

    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    padding:
        120px
        0;

    font-family:
        "Poppins",
        "Plus Jakarta Sans",
        Arial,
        sans-serif;

    background:

        radial-gradient(
            circle at 5% 20%,
            rgba(245,230,27,.12),
            transparent 22%
        ),

        radial-gradient(
            circle at 92% 80%,
            rgba(49,20,106,.07),
            transparent 25%
        ),

        linear-gradient(
            180deg,
            #ffffff 0%,
            var(--ekc-lab-lilac-light) 100%
        );

}


.ekc-lab-container {

    width:
        min(
            1280px,
            calc(100% - 40px)
        );

    margin:
        0 auto;

}



/* =========================================================
   HEADER
========================================================= */

.ekc-lab-header {

    display:
        grid;

    grid-template-columns:
        1.2fr
        .8fr;

    gap:
        70px;

    align-items:
        end;

    margin-bottom:
        70px;

}



/* LABEL */

.ekc-lab-label {

    width:
        fit-content;

    display:
        inline-flex;

    align-items:
        center;

    gap:
        10px;

    margin-bottom:
        22px;

    color:
        var(--ekc-lab-purple);

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        .13em;

}


.ekc-lab-label > span {

    width:
        11px;

    height:
        11px;

    border-radius:
        50%;

    background:
        var(--ekc-lab-yellow);

    box-shadow:
        0 0 0 6px
        rgba(245,230,27,.15);

}



/* TITLE */

.ekc-lab-header h2 {

    margin:
        0;

    color:
        var(--ekc-lab-ink);

    font-size:
        clamp(
            52px,
            6vw,
            88px
        );

    line-height:
        .94;

    letter-spacing:
        -.06em;

    font-weight:
        750;

}


.ekc-lab-purple {

    color:
        var(--ekc-lab-purple);

}



/* HEADER RIGHT */

.ekc-lab-header-right {

    max-width:
        430px;

    justify-self:
        end;

}


.ekc-lab-header-right p {

    margin:
        0;

    color:
        #707070;

    font-size:
        17px;

    line-height:
        1.75;

}


.ekc-lab-header-line {

    position:
        relative;

    display:
        block;

    width:
        100%;

    height:
        2px;

    margin-top:
        28px;

    overflow:
        hidden;

    border-radius:
        999px;

    background:
        var(--ekc-lab-lilac);

}


.ekc-lab-header-line::after {

    content:
        "";

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            var(--ekc-lab-purple),
            var(--ekc-lab-yellow)
        );

    transform:
        translateX(-100%);

}


.ekc-lab-header-right.ekc-lab-visible
.ekc-lab-header-line::after {

    animation:
        ekcLabLineReveal
        1.2s
        cubic-bezier(.16,1,.3,1)
        .4s
        forwards;

}



/* =========================================================
   BENTO GRID
========================================================= */

.ekc-lab-grid {

    display:
        grid;

    grid-template-columns:
        1.25fr
        .75fr;

    grid-template-rows:
        420px
        420px;

    gap:
        24px;

}



/* =========================================================
   CARD COMMON
========================================================= */

.ekc-lab-card {

    position:
        relative;

    overflow:
        hidden;

    padding:
        30px;

    border:
        1px solid
        rgba(49,20,106,.14);

    border-radius:
        38px;

    background:
        #ffffff;

    box-shadow:
        0 24px 60px
        rgba(49,20,106,.08);

    transform-style:
        preserve-3d;

    transition:
        box-shadow
        .5s
        ease;

}


.ekc-lab-card:hover {

    box-shadow:
        0 35px 80px
        rgba(49,20,106,.14);

}



/* =========================================================
   GRID POSITIONS
========================================================= */

.ekc-lab-card-social {

    grid-column:
        1;

    grid-row:
        1 / span 2;

    min-height:
        864px;

    background:

        radial-gradient(
            circle at 80% 15%,
            rgba(245,230,27,.25),
            transparent 23%
        ),

        linear-gradient(
            145deg,
            #f3eff9,
            var(--ekc-lab-lilac-light) 65%,
            #ffffff
        );

}


.ekc-lab-card-article {

    grid-column:
        2;

    grid-row:
        1;

    background:
        linear-gradient(
            145deg,
            #fffbd8,
            #fffefa
        );

}


.ekc-lab-card-video {

    grid-column:
        2;

    grid-row:
        2;

    background:
        linear-gradient(
            145deg,
            #f0ecf8,
            #ffffff
        );

}


.ekc-lab-card-story {

    grid-column:
        1 / span 2;

    min-height:
        420px;

    background:
        var(--ekc-lab-purple-dark);

}



/* =========================================================
   CARD TOP
========================================================= */

.ekc-lab-card-top {

    position:
        relative;

    z-index:
        10;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

}


.ekc-lab-card-number {

    color:
        #a8a8a8;

    font-size:
        11px;

    font-weight:
        700;

    letter-spacing:
        .1em;

}


.ekc-lab-card-tag {

    padding:
        8px
        12px;

    border-radius:
        999px;

    background:
        rgba(255,255,255,.70);

    color:
        var(--ekc-lab-purple);

    font-size:
        8px;

    font-weight:
        700;

    letter-spacing:
        .12em;

}


.ekc-lab-card-story
.ekc-lab-card-number {

    color:
        #777777;

}


.ekc-lab-card-story
.ekc-lab-card-tag {

    background:
        rgba(255,255,255,.10);

    color:
        var(--ekc-lab-yellow);

}



/* =========================================================
   CARD CONTENT
========================================================= */

.ekc-lab-card-content {

    position:
        absolute;

    z-index:
        10;

    left:
        30px;

    right:
        30px;

    bottom:
        30px;

}


.ekc-lab-card-content h3 {

    margin:
        0;

    color:
        var(--ekc-lab-ink);

    font-size:
        clamp(
            29px,
            3vw,
            45px
        );

    line-height:
        1;

    letter-spacing:
        -.045em;

}


.ekc-lab-card-content p {

    max-width:
        520px;

    margin:
        14px
        0
        0;

    color:
        #707070;

    font-size:
        15px;

    line-height:
        1.65;

}


.ekc-lab-card-story
.ekc-lab-card-content h3 {

    color:
        #ffffff;

}


.ekc-lab-card-story
.ekc-lab-card-content p {

    color:
        rgba(255,255,255,.55);

}



/* =========================================================
   SOCIAL CONTENT VISUAL
========================================================= */

.ekc-lab-social-visual {

    position:
        relative;

    width:
        100%;

    height:
        560px;

    margin-top:
        35px;

}



/* POST CARDS */

.ekc-lab-post {

    position:
        absolute;

    width:
        280px;

    height:
        390px;

    left:
        50%;

    padding:
        15px;

    border:
        1px solid
        rgba(49,20,106,.10);

    border-radius:
        30px;

    background:
        #ffffff;

    box-shadow:
        0 24px 55px
        rgba(49,20,106,.12);

    transform-origin:
        center bottom;

}


.ekc-lab-post-back {

    top:
        80px;

    transform:
        translateX(-50%)
        translateX(-115px)
        rotate(-11deg)
        scale(.88);

    opacity:
        .6;

    animation:
        ekcLabPostBack
        6s
        ease-in-out
        infinite;

}


.ekc-lab-post-middle {

    top:
        55px;

    transform:
        translateX(-50%)
        translateX(105px)
        rotate(9deg)
        scale(.92);

    opacity:
        .75;

    animation:
        ekcLabPostMiddle
        6.5s
        ease-in-out
        infinite;

}


.ekc-lab-post-front {

    z-index:
        5;

    top:
        20px;

    transform:
        translateX(-50%);

    animation:
        ekcLabPostFront
        5.5s
        ease-in-out
        infinite;

}



/* IMAGE */

.ekc-lab-post-image {

    position:
        relative;

    height:
        255px;

    display:
        grid;

    place-items:
        center;

    overflow:
        hidden;

    border-radius:
        22px;

    background:

        radial-gradient(
            circle at 70% 25%,
            var(--ekc-lab-yellow) 0 8%,
            transparent 9%
        ),

        linear-gradient(
            145deg,
            var(--ekc-lab-purple),
            var(--ekc-lab-purple-mid) 55%,
            var(--ekc-lab-purple-soft)
        );

}


.ekc-lab-post-image::before {

    content:
        "";

    position:
        absolute;

    width:
        170px;

    height:
        170px;

    left:
        -70px;

    bottom:
        -80px;

    border-radius:
        50%;

    background:
        rgba(255,255,255,.14);

}


.ekc-lab-post-play {

    position:
        relative;

    z-index:
        2;

    width:
        65px;

    height:
        65px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        rgba(255,255,255,.92);

    color:
        var(--ekc-lab-purple);

    font-size:
        20px;

    box-shadow:
        0 15px 35px
        rgba(31,12,69,.16);

    animation:
        ekcLabPlayPulse
        2.5s
        ease-in-out
        infinite;

}



/* POST ACTIONS */

.ekc-lab-post-actions {

    display:
        flex;

    gap:
        15px;

    margin-top:
        16px;

    color:
        var(--ekc-lab-purple);

    font-size:
        16px;

}


.ekc-lab-post-front > i,
.ekc-lab-post-back > span,
.ekc-lab-post-middle > span {

    display:
        block;

    height:
        7px;

    margin-top:
        12px;

    border-radius:
        999px;

    background:
        var(--ekc-lab-lilac);

}


.ekc-lab-post-front > i:first-of-type {

    width:
        80%;

}


.ekc-lab-post-front > i:last-of-type {

    width:
        55%;

}



/* REACTION */

.ekc-lab-reaction {

    position:
        absolute;

    z-index:
        8;

    right:
        7%;

    top:
        75px;

    display:
        flex;

    align-items:
        center;

    gap:
        9px;

    padding:
        13px
        16px;

    border-radius:
        18px;

    background:
        #ffffff;

    color:
        var(--ekc-lab-purple);

    box-shadow:
        0 18px 40px
        rgba(49,20,106,.12);

    animation:
        ekcLabReactionFloat
        4.5s
        ease-in-out
        infinite;

}


.ekc-lab-reaction strong {

    color:
        #252525;

    font-size:
        12px;

}



/* =========================================================
   ARTICLE VISUAL
========================================================= */

.ekc-lab-article-visual {

    position:
        relative;

    height:
        220px;

    margin-top:
        25px;

}


.ekc-lab-article-paper {

    position:
        absolute;

    width:
        220px;

    height:
        190px;

    left:
        50%;

    top:
        5px;

    padding:
        24px;

    border-radius:
        24px;

    background:
        #ffffff;

    box-shadow:
        0 20px 45px
        rgba(105,85,50,.10);

    transform:
        translateX(-50%)
        rotate(-3deg);

    animation:
        ekcLabPaperFloat
        5.5s
        ease-in-out
        infinite;

}


.ekc-lab-article-title {

    display:
        block;

    width:
        76%;

    height:
        11px;

    margin-bottom:
        8px;

    border-radius:
        999px;

    background:
        #2a2a2a;

}


.ekc-lab-article-title.ekc-short {

    width:
        53%;

}


.ekc-lab-article-text {

    margin-top:
        22px;

}


.ekc-lab-article-text i {

    display:
        block;

    width:
        100%;

    height:
        5px;

    margin-bottom:
        7px;

    border-radius:
        999px;

    background:
        #e9e2d0;

}


.ekc-lab-article-text
i:nth-child(2) {

    width:
        87%;

}


.ekc-lab-article-text
i:nth-child(4) {

    width:
        72%;

}


.ekc-lab-article-highlight {

    width:
        fit-content;

    margin-top:
        17px;

    padding:
        8px
        10px;

    border-radius:
        8px;

    background:
        var(--ekc-lab-yellow);

}


.ekc-lab-article-highlight span {

    color:
        var(--ekc-lab-ink);

    font-size:
        7px;

    font-weight:
        800;

    letter-spacing:
        .09em;

}



/* PENCIL */

.ekc-lab-pencil {

    position:
        absolute;

    z-index:
        4;

    width:
        11px;

    height:
        120px;

    right:
        13%;

    top:
        45px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            var(--ekc-lab-purple),
            var(--ekc-lab-purple-dark)
        );

    transform:
        rotate(24deg);

    animation:
        ekcLabPencilMove
        3s
        ease-in-out
        infinite;

}


.ekc-lab-pencil span {

    position:
        absolute;

    width:
        11px;

    height:
        15px;

    bottom:
        -8px;

    clip-path:
        polygon(
            0 0,
            100% 0,
            50% 100%
        );

    background:
        #e4bb86;

}



/* =========================================================
   VIDEO VISUAL
========================================================= */

.ekc-lab-video-visual {

    position:
        relative;

    height:
        220px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    margin-top:
        20px;

}



/* VIDEO RING */

.ekc-lab-video-ring {

    position:
        relative;

    width:
        125px;

    height:
        125px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        linear-gradient(
            145deg,
            var(--ekc-lab-purple),
            var(--ekc-lab-purple-mid) 55%,
            var(--ekc-lab-purple-soft)
        );

    box-shadow:
        0 25px 55px
        rgba(49,20,106,.20);

}


.ekc-lab-video-ring::before {

    content:
        "";

    position:
        absolute;

    inset:
        -18px;

    border:
        1px dashed
        rgba(49,20,106,.24);

    border-radius:
        50%;

    animation:
        ekcLabRotate
        15s
        linear
        infinite;

}


.ekc-lab-video-play {

    width:
        58px;

    height:
        58px;

    display:
        grid;

    place-items:
        center;

    border-radius:
        50%;

    background:
        #ffffff;

    color:
        var(--ekc-lab-purple);

    font-size:
        19px;

}



/* AUDIO WAVE */

.ekc-lab-video-wave {

    position:
        absolute;

    left:
        0;

    bottom:
        25px;

    height:
        45px;

    display:
        flex;

    align-items:
        center;

    gap:
        4px;

}


.ekc-lab-video-wave span {

    width:
        5px;

    border-radius:
        999px;

    background:
        var(--ekc-lab-yellow);

    animation:
        ekcLabWave
        1.2s
        ease-in-out
        infinite;

}


.ekc-lab-video-wave
span:nth-child(1) {

    height:
        12px;

}


.ekc-lab-video-wave
span:nth-child(2) {

    height:
        28px;

    animation-delay:
        .1s;

}


.ekc-lab-video-wave
span:nth-child(3) {

    height:
        18px;

    animation-delay:
        .2s;

}


.ekc-lab-video-wave
span:nth-child(4) {

    height:
        40px;

    animation-delay:
        .3s;

}


.ekc-lab-video-wave
span:nth-child(5) {

    height:
        24px;

    animation-delay:
        .4s;

}


.ekc-lab-video-wave
span:nth-child(6) {

    height:
        34px;

    animation-delay:
        .5s;

}


.ekc-lab-video-wave
span:nth-child(7) {

    height:
        15px;

    animation-delay:
        .6s;

}



/* TIME */

.ekc-lab-video-time {

    position:
        absolute;

    right:
        0;

    bottom:
        30px;

    padding:
        9px
        12px;

    border-radius:
        999px;

    background:
        var(--ekc-lab-purple-dark);

    color:
        #ffffff;

    font-size:
        9px;

    font-weight:
        700;

}



/* =========================================================
   STORYTELLING VISUAL
========================================================= */

.ekc-lab-story-visual {

    position:
        absolute;

    inset:
        0;

    overflow:
        hidden;

}


.ekc-lab-story-word {

    position:
        absolute;

    padding:
        15px
        24px;

    border-radius:
        999px;

    font-size:
        clamp(
            24px,
            3vw,
            42px
        );

    font-weight:
        800;

    letter-spacing:
        -.04em;

    box-shadow:
        0 20px 50px
        rgba(0,0,0,.18);

}


.ekc-word-idea {

    top:
        65px;

    left:
        11%;

    background:
        var(--ekc-lab-yellow);

    color:
        var(--ekc-lab-ink);

    transform:
        rotate(-8deg);

    animation:
        ekcLabStoryWordOne
        6s
        ease-in-out
        infinite;

}


.ekc-word-story {

    top:
        105px;

    left:
        43%;

    background:
        var(--ekc-lab-purple);

    color:
        #ffffff;

    transform:
        rotate(4deg);

    animation:
        ekcLabStoryWordTwo
        6.5s
        ease-in-out
        infinite;

}


.ekc-word-emotion {

    top:
        58px;

    right:
        7%;

    background:
        #ffffff;

    color:
        var(--ekc-lab-ink);

    transform:
        rotate(-5deg);

    animation:
        ekcLabStoryWordThree
        5.8s
        ease-in-out
        infinite;

}


.ekc-lab-story-star {

    position:
        absolute;

    right:
        25%;

    bottom:
        75px;

    color:
        var(--ekc-lab-yellow);

    font-size:
        75px;

    animation:
        ekcLabRotate
        12s
        linear
        infinite;

}



/* =========================================================
   REVEAL
========================================================= */

.ekc-lab-reveal {

    opacity:
        0;

    filter:
        blur(7px);

    transform:
        translateY(55px);

    transition:

        opacity
        .9s
        ease,

        filter
        .9s
        ease,

        transform
        .9s
        cubic-bezier(.16,1,.3,1);

}


.ekc-lab-reveal.ekc-lab-visible {

    opacity:
        1;

    filter:
        blur(0);

    transform:
        translateY(0);

}



/* STAGGER */

.ekc-lab-card-social {

    transition-delay:
        .05s;

}


.ekc-lab-card-article {

    transition-delay:
        .14s;

}


.ekc-lab-card-video {

    transition-delay:
        .22s;

}


.ekc-lab-card-story {

    transition-delay:
        .1s;

}



/* =========================================================
   KEYFRAMES
========================================================= */

@keyframes ekcLabLineReveal {

    to {

        transform:
            translateX(0);

    }

}


@keyframes ekcLabPostFront {

    0%,
    100% {

        transform:
            translateX(-50%)
            translateY(0);

    }

    50% {

        transform:
            translateX(-50%)
            translateY(-10px);

    }

}


@keyframes ekcLabPostBack {

    0%,
    100% {

        transform:
            translateX(-50%)
            translateX(-115px)
            rotate(-11deg)
            scale(.88);

    }

    50% {

        transform:
            translateX(-50%)
            translateX(-125px)
            translateY(-8px)
            rotate(-13deg)
            scale(.88);

    }

}


@keyframes ekcLabPostMiddle {

    0%,
    100% {

        transform:
            translateX(-50%)
            translateX(105px)
            rotate(9deg)
            scale(.92);

    }

    50% {

        transform:
            translateX(-50%)
            translateX(118px)
            translateY(-10px)
            rotate(11deg)
            scale(.92);

    }

}


@keyframes ekcLabReactionFloat {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(2deg);

    }

    50% {

        transform:
            translateY(-13px)
            rotate(-1deg);

    }

}


@keyframes ekcLabPlayPulse {

    0%,
    100% {

        transform:
            scale(1);

    }

    50% {

        transform:
            scale(1.12);

    }

}


@keyframes ekcLabPaperFloat {

    0%,
    100% {

        transform:
            translateX(-50%)
            translateY(0)
            rotate(-3deg);

    }

    50% {

        transform:
            translateX(-50%)
            translateY(-8px)
            rotate(-1deg);

    }

}


@keyframes ekcLabPencilMove {

    0%,
    100% {

        transform:
            translate(0,0)
            rotate(24deg);

    }

    50% {

        transform:
            translate(-7px,7px)
            rotate(19deg);

    }

}


@keyframes ekcLabRotate {

    from {

        transform:
            rotate(0deg);

    }

    to {

        transform:
            rotate(360deg);

    }

}


@keyframes ekcLabWave {

    0%,
    100% {

        transform:
            scaleY(.65);

    }

    50% {

        transform:
            scaleY(1.2);

    }

}


@keyframes ekcLabStoryWordOne {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(-8deg);

    }

    50% {

        transform:
            translateY(-13px)
            rotate(-5deg);

    }

}


@keyframes ekcLabStoryWordTwo {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(4deg);

    }

    50% {

        transform:
            translateY(-16px)
            rotate(1deg);

    }

}


@keyframes ekcLabStoryWordThree {

    0%,
    100% {

        transform:
            translateY(0)
            rotate(-5deg);

    }

    50% {

        transform:
            translateY(-11px)
            rotate(-2deg);

    }

}



/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .ekc-lab-header {

        grid-template-columns:
            1fr;

        gap:
            30px;

    }


    .ekc-lab-header-right {

        max-width:
            650px;

        justify-self:
            start;

    }


    .ekc-lab-grid {

        grid-template-columns:
            1fr
            1fr;

        grid-template-rows:
            auto;

    }


    .ekc-lab-card-social {

        grid-column:
            1 / span 2;

        grid-row:
            auto;

        min-height:
            760px;

    }


    .ekc-lab-card-article,
    .ekc-lab-card-video {

        grid-column:
            auto;

        grid-row:
            auto;

        min-height:
            420px;

    }


    .ekc-lab-card-story {

        grid-column:
            1 / span 2;

    }

}



/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .ekc-lab-section {

        padding:
            80px
            0;

    }


    .ekc-lab-container {

        width:
            calc(100% - 28px);

    }


    .ekc-lab-header {

        margin-bottom:
            50px;

    }


    .ekc-lab-header h2 {

        font-size:
            clamp(
                46px,
                13vw,
                66px
            );

    }


    .ekc-lab-grid {

        display:
            flex;

        flex-direction:
            column;

    }


    .ekc-lab-card {

        min-height:
            480px;

        padding:
            24px;

        border-radius:
            30px;

    }


    .ekc-lab-card-social {

        min-height:
            680px;

    }


    .ekc-lab-card-story {

        min-height:
            500px;

    }


    .ekc-lab-card-content {

        left:
            24px;

        right:
            24px;

        bottom:
            24px;

    }


    .ekc-lab-social-visual {

        transform:
            scale(.75);

        transform-origin:
            center top;

    }


    .ekc-lab-story-word {

        font-size:
            25px;

        padding:
            12px
            18px;

    }


    .ekc-word-idea {

        left:
            5%;

    }


    .ekc-word-story {

        left:
            35%;

        top:
            150px;

    }


    .ekc-word-emotion {

        top:
            250px;

        right:
            5%;

    }

}



/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .ekc-lab-section *,
    .ekc-lab-section *::before,
    .ekc-lab-section *::after {

        animation-duration:
            .01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            .01ms !important;

    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-b07cb4d *//* =========================================================
   EKBAAL COLOR PALETTE
   Main purple: #31146a
   Dark purple: #1f0c45
   Medium purple: #5b3d8f
   Soft purple: #8069a9
   Lavender: #e8e1f2
   Yellow accent: #f5e61b
========================================================= */

/* =========================================================
   SECTION 4 — CONTENT ECOSYSTEM
========================================================= */

.ekc-ecosystem-section,
.ekc-ecosystem-section *,
.ekc-ecosystem-section *::before,
.ekc-ecosystem-section *::after {
    box-sizing: border-box;
}


.ekc-ecosystem-section {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        125px
        0;

    font-family:
        "Poppins",
        "Plus Jakarta Sans",
        Arial,
        sans-serif;

    background:
        radial-gradient(
            circle at 4% 20%,
            rgba(245, 230, 27, 0.13),
            transparent 23%
        ),
        radial-gradient(
            circle at 95% 75%,
            rgba(49, 20, 106, 0.10),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #faf8fd 100%
        );
}


.ekc-ecosystem-container {
    position: relative;

    z-index: 3;

    width:
        min(
            1280px,
            calc(100% - 40px)
        );

    margin: 0 auto;
}


/* =========================================================
   BACKGROUND ORBS
========================================================= */

.ekc-ecosystem-orb {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.ekc-ecosystem-orb-one {
    width: 330px;

    height: 330px;

    left: -200px;

    top: 250px;

    background:
        rgba(245, 230, 27, 0.12);
}


.ekc-ecosystem-orb-two {
    width: 380px;

    height: 380px;

    right: -240px;

    bottom: 120px;

    background:
        rgba(49, 20, 106, 0.07);
}


/* =========================================================
   HEADING
========================================================= */

.ekc-ecosystem-heading {
    display: grid;

    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(320px, 0.85fr);

    align-items: end;

    gap:
        clamp(
            50px,
            8vw,
            110px
        );

    margin-bottom: 75px;
}


.ekc-ecosystem-label {
    width: fit-content;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 22px;

    color: #31146a;

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 0.13em;
}


.ekc-ecosystem-label > span {
    width: 11px;

    height: 11px;

    border-radius: 50%;

    background: #f5e61b;

    box-shadow:
        0 0 0 6px
        rgba(245, 230, 27, 0.15);
}


.ekc-ecosystem-heading h2 {
    margin: 0;

    color: #171717;

    font-size:
        clamp(
            50px,
            6vw,
            86px
        );

    line-height: 0.95;

    letter-spacing: -0.06em;

    font-weight: 750;
}


.ekc-ecosystem-heading h2 > span {
    color: #31146a;
}


.ekc-ecosystem-heading-right {
    max-width: 480px;

    justify-self: end;
}


.ekc-ecosystem-heading-right > p {
    margin: 0;

    color: #707070;

    font-size: 17px;

    line-height: 1.75;
}


.ekc-ecosystem-heading-note {
    width: fit-content;

    display: flex;

    align-items: center;

    gap: 10px;

    margin-top: 25px;

    padding:
        11px
        16px;

    border:
        1px solid
        rgba(49, 20, 106, 0.15);

    border-radius: 999px;

    background:
        #ffffff;

    color: #31146a;

    font-size: 11px;

    font-weight: 600;

    box-shadow:
        0 12px 30px
        rgba(49, 20, 106, 0.08);
}


.ekc-ecosystem-heading-note > span {
    color: #e2ca00;

    font-size: 16px;
}


/* =========================================================
   MAIN BOARD
========================================================= */

.ekc-ecosystem-board {
    position: relative;

    width: 100%;

    height: 820px;

    overflow: hidden;

    border:
        1px solid
        rgba(49, 20, 106, 0.15);

    border-radius: 50px;

    background:
        radial-gradient(
            circle at 50% 42%,
            rgba(49, 20, 106, 0.11),
            transparent 27%
        ),
        radial-gradient(
            circle at 88% 15%,
            rgba(245, 230, 27, 0.18),
            transparent 23%
        ),
        linear-gradient(
            145deg,
            #e8e1f2 0%,
            #faf8fd 52%,
            #ffffff 100%
        );

    box-shadow:
        0 35px 90px
        rgba(49, 20, 106, 0.12);

    perspective: 1400px;
}


/* =========================================================
   BACKGROUND GRID
========================================================= */

.ekc-ecosystem-grid-bg {
    position: absolute;

    inset: 0;

    opacity: 0.38;

    background-image:
        linear-gradient(
            rgba(49, 20, 106, 0.055) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(49, 20, 106, 0.055) 1px,
            transparent 1px
        );

    background-size:
        48px
        48px;

    -webkit-mask-image:
        radial-gradient(
            circle at center,
            #000 10%,
            transparent 75%
        );

    mask-image:
        radial-gradient(
            circle at center,
            #000 10%,
            transparent 75%
        );
}


/* =========================================================
   CONNECTOR LINES
========================================================= */

.ekc-ecosystem-lines {
    position: absolute;

    width: 100%;

    height: 650px;

    left: 0;

    top: 0;

    pointer-events: none;
}


.ekc-ecosystem-path {
    fill: none;

    stroke:
        rgba(49, 20, 106, 0.23);

    stroke-width: 2;

    stroke-linecap: round;

    stroke-dasharray:
        8
        12;

    animation:
        ekcEcosystemLineMove
        15s
        linear
        infinite;
}


/* =========================================================
   CENTER
========================================================= */

.ekc-ecosystem-center {
    position: absolute;

    z-index: 8;

    width: 230px;

    height: 230px;

    left: 50%;

    top: 310px;

    transform:
        translate(-50%, -50%);
}


.ekc-ecosystem-center-ring {
    position: absolute;

    inset: 0;

    border:
        1px dashed
        rgba(49, 20, 106, 0.28);

    border-radius: 50%;

    animation:
        ekcEcosystemRotate
        18s
        linear
        infinite;
}


.ekc-ecosystem-center-ring::before {
    content: "";

    position: absolute;

    width: 13px;

    height: 13px;

    left: 50%;

    top: -7px;

    border-radius: 50%;

    background: #f5e61b;

    box-shadow:
        0 0 0 8px
        rgba(245, 230, 27, 0.13);
}


.ekc-ecosystem-center-core {
    position: absolute;

    inset: 25px;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    border-radius: 46px;

    background:
        linear-gradient(
            145deg,
            #31146a,
            #5b3d8f
        );

    box-shadow:
        0 30px 65px
        rgba(49, 20, 106, 0.28);

    animation:
        ekcEcosystemCenterFloat
        4.5s
        ease-in-out
        infinite;
}


.ekc-ecosystem-center-core::after {
    content: "";

    position: absolute;

    width: 55px;

    height: 12px;

    right: -20px;

    top: 28px;

    border-radius: 999px;

    background: #f5e61b;

    transform: rotate(-18deg);
}


.ekc-ecosystem-center-icon {
    color: #f5e61b;

    font-size: 29px;
}


.ekc-ecosystem-center-core small {
    display: block;

    margin-top: 13px;

    color:
        rgba(255, 255, 255, 0.62);

    font-size: 7px;

    font-weight: 700;

    letter-spacing: 0.14em;
}


.ekc-ecosystem-center-core strong {
    display: block;

    margin-top: 5px;

    color: #ffffff;

    font-size: 27px;

    line-height: 1;
}


.ekc-ecosystem-center-core p {
    margin:
        8px
        0
        0;

    color:
        rgba(255, 255, 255, 0.70);

    font-size: 10px;
}


/* =========================================================
   CONTENT FORMAT NODES
========================================================= */

.ekc-ecosystem-node {
    position: absolute;

    z-index: 10;

    min-width: 185px;

    display: flex;

    align-items: center;

    gap: 13px;

    padding:
        14px
        17px;

    border:
        1px solid
        rgba(49, 20, 106, 0.14);

    border-radius: 23px;

    background:
        rgba(255, 255, 255, 0.94);

    backdrop-filter:
        blur(17px);

    color: #171717 !important;

    font-family: inherit;

    text-align: left;

    cursor: pointer;

    box-shadow:
        0 19px 45px
        rgba(49, 20, 106, 0.12);

    transform-style: preserve-3d;

    transition:
        border-color 0.4s ease,
        background 0.4s ease,
        box-shadow 0.4s ease;
}


.ekc-ecosystem-node:hover {
    border-color:
        rgba(49, 20, 106, 0.45);

    box-shadow:
        0 27px 55px
        rgba(49, 20, 106, 0.17);
}


.ekc-ecosystem-node.active {
    border-color: #31146a !important;

    background: #31146a;

    color: #ffffff !important;

    box-shadow:
        0 26px 60px
        rgba(49, 20, 106, 0.27);
}


.ekc-ecosystem-node-icon {
    width: 45px;

    height: 45px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border-radius: 15px;

    background: #171717;

    color: #f5e61b;

    font-size: 18px;

    transition:
        transform 0.4s ease,
        background 0.4s ease,
        color 0.4s ease;
}


.ekc-ecosystem-node.active
.ekc-ecosystem-node-icon {
    background: #f5e61b;

    color: #171717;

    transform:
        rotate(-7deg)
        scale(1.06);
}


.ekc-ecosystem-node-copy {
    display: block;

    flex: 1;
}


.ekc-ecosystem-node-copy small {
    display: block;

    color: #a2a2a2;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: 0.11em;
}


.ekc-ecosystem-node.active
.ekc-ecosystem-node-copy small {
    color:
        rgba(255, 255, 255, 0.65);
}


.ekc-ecosystem-node-copy strong {
    display: block;

    margin-top: 4px;

    font-size: 15px;
}


.ekc-ecosystem-node-status {
    width: 8px;

    height: 8px;

    flex-shrink: 0;

    border-radius: 50%;

    background:
        rgba(49, 20, 106, 0.25);
}


.ekc-ecosystem-node.active
.ekc-ecosystem-node-status {
    background: #f5e61b;

    box-shadow:
        0 0 0 6px
        rgba(245, 230, 27, 0.15);

    animation:
        ekcEcosystemPulse
        1.8s
        infinite;
}


/* =========================================================
   NODE POSITIONS
========================================================= */

.ekc-ecosystem-node-reel {
    left: 6%;

    top: 95px;

    animation:
        ekcEcoNodeFloatOne
        5.4s
        ease-in-out
        infinite;
}


.ekc-ecosystem-node-carousel {
    right: 6%;

    top: 95px;

    animation:
        ekcEcoNodeFloatTwo
        5.9s
        ease-in-out
        infinite;
}


.ekc-ecosystem-node-blog {
    left: 3%;

    top: 430px;

    animation:
        ekcEcoNodeFloatThree
        6.2s
        ease-in-out
        infinite;
}


.ekc-ecosystem-node-story {
    right: 3%;

    top: 430px;

    animation:
        ekcEcoNodeFloatFour
        5.6s
        ease-in-out
        infinite;
}


.ekc-ecosystem-node-email {
    left: 50%;

    top: 475px;

    transform:
        translateX(-50%);

    animation:
        ekcEcoNodeFloatEmail
        6s
        ease-in-out
        infinite;
}


/* =========================================================
   DETAIL CARD
========================================================= */

.ekc-ecosystem-detail {
    position: absolute;

    z-index: 20;

    width:
        min(
            680px,
            calc(100% - 80px)
        );

    left: 50%;

    bottom: 30px;

    padding: 22px;

    border:
        1px solid
        rgba(49, 20, 106, 0.15);

    border-radius: 31px;

    background:
        rgba(255, 255, 255, 0.94);

    backdrop-filter:
        blur(20px);

    box-shadow:
        0 26px 65px
        rgba(49, 20, 106, 0.14);

    transform:
        translateX(-50%);
}


.ekc-ecosystem-detail-top {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 15px;
}


.ekc-ecosystem-detail-number {
    color: #31146a;

    font-size: 12px;

    font-weight: 800;
}


.ekc-ecosystem-detail-label {
    color: #a2a2a2;

    font-size: 7px;

    font-weight: 700;

    letter-spacing: 0.12em;
}


.ekc-ecosystem-detail-body {
    display: grid;

    grid-template-columns:
        150px
        1fr;

    align-items: center;

    gap: 23px;
}


.ekc-ecosystem-detail-visual {
    height: 125px;

    overflow: hidden;

    border-radius: 22px;

    background:
        linear-gradient(
            145deg,
            #31146a,
            #8069a9
        );

    transition:
        opacity 0.3s ease,
        transform 0.5s
        cubic-bezier(.16, 1, .3, 1);
}


.ekc-ecosystem-detail-copy {
    transition:
        opacity 0.3s ease,
        transform 0.5s
        cubic-bezier(.16, 1, .3, 1);
}


.ekc-ecosystem-detail.is-changing
.ekc-ecosystem-detail-visual,
.ekc-ecosystem-detail.is-changing
.ekc-ecosystem-detail-copy {
    opacity: 0;

    transform:
        translateY(15px);
}


.ekc-ecosystem-detail-copy > small {
    display: block;

    color: #31146a;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 0.12em;
}


.ekc-ecosystem-detail-copy h3 {
    margin:
        8px
        0
        0;

    color: #171717;

    font-size:
        clamp(
            23px,
            2.5vw,
            34px
        );

    line-height: 1.05;

    letter-spacing: -0.045em;
}


.ekc-ecosystem-detail-copy p {
    margin:
        11px
        0
        0;

    color: #707070;

    font-size: 13px;

    line-height: 1.65;
}


/* =========================================================
   REEL VISUAL
========================================================= */

.ekc-ecosystem-reel-visual {
    position: relative;

    width: 100%;

    height: 100%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    gap: 9px;
}


.ekc-ecosystem-reel-play {
    width: 43px;

    height: 43px;

    display: grid;

    place-items: center;

    border-radius: 50%;

    background: #ffffff;

    color: #31146a;

    font-size: 15px;

    animation:
        ekcEcosystemPlayPulse
        2.3s
        ease-in-out
        infinite;
}


.ekc-ecosystem-reel-line {
    width: 62%;

    height: 5px;

    border-radius: 999px;

    background:
        rgba(255, 255, 255, 0.65);
}


.ekc-ecosystem-reel-line.short {
    width: 40%;
}


/* =========================================================
   DYNAMIC VISUAL TYPES
========================================================= */

.ekc-eco-carousel-visual,
.ekc-eco-blog-visual,
.ekc-eco-story-visual,
.ekc-eco-email-visual {
    width: 100%;

    height: 100%;
}


/* CAROUSEL */

.ekc-eco-carousel-visual {
    position: relative;

    background:
        linear-gradient(
            145deg,
            #f5e61b,
            #fff5a0
        );
}


.ekc-eco-carousel-slide {
    position: absolute;

    width: 65px;

    height: 83px;

    top: 21px;

    border-radius: 13px;

    background: #ffffff;

    box-shadow:
        0 10px 25px
        rgba(80, 60, 20, 0.14);
}


.ekc-eco-carousel-slide:nth-child(1) {
    left: 19px;

    transform:
        rotate(-9deg);
}


.ekc-eco-carousel-slide:nth-child(2) {
    left: 43px;

    z-index: 2;
}


.ekc-eco-carousel-slide:nth-child(3) {
    right: 18px;

    transform:
        rotate(9deg);
}


.ekc-eco-carousel-slide::before {
    content: "";

    position: absolute;

    width: 30px;

    height: 30px;

    left: 50%;

    top: 15px;

    border-radius: 9px;

    background: #31146a;

    transform:
        translateX(-50%);
}


.ekc-eco-carousel-slide::after {
    content: "";

    position: absolute;

    width: 36px;

    height: 5px;

    left: 50%;

    bottom: 18px;

    border-radius: 999px;

    background: #d9d0e6;

    transform:
        translateX(-50%);
}


/* BLOG */

.ekc-eco-blog-visual {
    position: relative;

    padding: 22px;

    background:
        linear-gradient(
            145deg,
            #fffbd8,
            #ffffff
        );
}


.ekc-eco-blog-title {
    display: block;

    width: 75%;

    height: 10px;

    border-radius: 999px;

    background: #171717;
}


.ekc-eco-blog-title.short {
    width: 50%;

    margin-top: 7px;
}


.ekc-eco-blog-line {
    display: block;

    width: 100%;

    height: 5px;

    margin-top: 11px;

    border-radius: 999px;

    background: #ddd7b2;
}


.ekc-eco-blog-line.short {
    width: 65%;
}


/* STORY */

.ekc-eco-story-visual {
    position: relative;

    display: grid;

    place-items: center;

    background:
        linear-gradient(
            145deg,
            #171717,
            #1f0c45
        );
}


.ekc-eco-story-frame {
    position: relative;

    width: 64px;

    height: 100px;

    border:
        3px solid
        rgba(255, 255, 255, 0.9);

    border-radius: 18px;
}


.ekc-eco-story-frame::before {
    content: "STORY";

    position: absolute;

    left: 50%;

    top: 50%;

    color: #f5e61b;

    font-size: 10px;

    font-weight: 800;

    transform:
        translate(-50%, -50%)
        rotate(-7deg);
}


/* EMAIL */

.ekc-eco-email-visual {
    position: relative;

    display: grid;

    place-items: center;

    background:
        linear-gradient(
            145deg,
            #e8e1f2,
            #ffffff
        );
}


.ekc-eco-email-envelope {
    position: relative;

    width: 90px;

    height: 60px;

    overflow: hidden;

    border-radius: 12px;

    background: #31146a;

    box-shadow:
        0 13px 30px
        rgba(49, 20, 106, 0.22);
}


.ekc-eco-email-envelope::before,
.ekc-eco-email-envelope::after {
    content: "";

    position: absolute;

    width: 68px;

    height: 68px;

    top: -36px;

    border:
        2px solid
        rgba(255, 255, 255, 0.85);

    transform: rotate(45deg);
}


.ekc-eco-email-envelope::before {
    left: -15px;
}


.ekc-eco-email-envelope::after {
    right: -15px;
}


/* =========================================================
   SPARKS
========================================================= */

.ekc-ecosystem-spark {
    position: absolute;

    color: #e5cf00;

    font-size: 27px;

    animation:
        ekcEcosystemSpark
        3s
        ease-in-out
        infinite;
}


.ekc-ecosystem-spark-one {
    left: 32%;

    top: 75px;
}


.ekc-ecosystem-spark-two {
    right: 32%;

    top: 245px;

    animation-delay: 1s;
}


.ekc-ecosystem-spark-three {
    left: 39%;

    top: 465px;

    animation-delay: 2s;
}


/* =========================================================
   PRINCIPLES
========================================================= */

.ekc-ecosystem-principles {
    display: grid;

    grid-template-columns:
        repeat(3, 1fr);

    gap: 20px;

    margin-top: 28px;
}


.ekc-ecosystem-principle {
    display: flex;

    align-items: flex-start;

    gap: 19px;

    min-height: 175px;

    padding: 27px;

    border:
        1px solid
        rgba(49, 20, 106, 0.14);

    border-radius: 30px;

    background:
        linear-gradient(
            145deg,
            #eee9f5,
            #ffffff
        );

    box-shadow:
        0 20px 45px
        rgba(49, 20, 106, 0.08);

    transition:
        transform 0.45s
        cubic-bezier(.16, 1, .3, 1),
        box-shadow 0.45s ease;
}


.ekc-ecosystem-principle:nth-child(2) {
    background:
        linear-gradient(
            145deg,
            #fffbd8,
            #ffffff
        );
}


.ekc-ecosystem-principle:hover {
    transform:
        translateY(-8px);

    box-shadow:
        0 28px 60px
        rgba(49, 20, 106, 0.13);
}


.ekc-ecosystem-principle-number {
    width: 43px;

    height: 43px;

    flex-shrink: 0;

    display: grid;

    place-items: center;

    border-radius: 14px;

    background: #171717;

    color: #f5e61b;

    font-size: 10px;

    font-weight: 700;
}


.ekc-ecosystem-principle strong {
    color: #171717;

    font-size: 19px;
}


.ekc-ecosystem-principle p {
    margin:
        10px
        0
        0;

    color: #707070;

    font-size: 14px;

    line-height: 1.65;
}


/* =========================================================
   SCROLL REVEAL
========================================================= */

.ekc-ecosystem-reveal {
    opacity: 0;

    filter: blur(7px);

    transform:
        translateY(55px);

    transition:
        opacity 0.9s ease,
        filter 0.9s ease,
        transform 0.9s
        cubic-bezier(.16, 1, .3, 1);
}


.ekc-ecosystem-reveal.ekc-ecosystem-visible {
    opacity: 1;

    filter: blur(0);

    transform:
        translateY(0);
}


.ekc-ecosystem-heading-right {
    transition-delay: 0.12s;
}


.ekc-ecosystem-board {
    transition-delay: 0.15s;
}


.ekc-ecosystem-principle:nth-child(2) {
    transition-delay: 0.10s;
}


.ekc-ecosystem-principle:nth-child(3) {
    transition-delay: 0.20s;
}


/* =========================================================
   KEYFRAMES
========================================================= */

@keyframes ekcEcosystemLineMove {

    from {
        stroke-dashoffset: 0;
    }

    to {
        stroke-dashoffset: -100;
    }

}


@keyframes ekcEcosystemRotate {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}


@keyframes ekcEcosystemCenterFloat {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(-1deg);
    }

    50% {
        transform:
            translateY(-10px)
            rotate(1deg);
    }

}


@keyframes ekcEcosystemPulse {

    0%,
    100% {
        box-shadow:
            0 0 0 0
            rgba(245, 230, 27, 0.22);
    }

    50% {
        box-shadow:
            0 0 0 9px
            rgba(245, 230, 27, 0);
    }

}


@keyframes ekcEcoNodeFloatOne {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(-2deg);
    }

    50% {
        transform:
            translateY(-12px)
            rotate(1deg);
    }

}


@keyframes ekcEcoNodeFloatTwo {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(2deg);
    }

    50% {
        transform:
            translateY(-14px)
            rotate(-1deg);
    }

}


@keyframes ekcEcoNodeFloatThree {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(1deg);
    }

    50% {
        transform:
            translateY(-11px)
            rotate(-2deg);
    }

}


@keyframes ekcEcoNodeFloatFour {

    0%,
    100% {
        transform:
            translateY(0)
            rotate(-2deg);
    }

    50% {
        transform:
            translateY(-13px)
            rotate(1deg);
    }

}


@keyframes ekcEcoNodeFloatEmail {

    0%,
    100% {
        transform:
            translateX(-50%)
            translateY(0);
    }

    50% {
        transform:
            translateX(-50%)
            translateY(-12px);
    }

}


@keyframes ekcEcosystemSpark {

    0%,
    100% {
        opacity: 0.35;

        transform:
            scale(0.7)
            rotate(0);
    }

    50% {
        opacity: 1;

        transform:
            scale(1.2)
            rotate(20deg);
    }

}


@keyframes ekcEcosystemPlayPulse {

    0%,
    100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.12);
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .ekc-ecosystem-heading {
        grid-template-columns: 1fr;

        gap: 30px;
    }


    .ekc-ecosystem-heading-right {
        max-width: 660px;

        justify-self: start;
    }


    .ekc-ecosystem-board {
        height: 900px;
    }


    .ekc-ecosystem-center {
        top: 330px;
    }


    .ekc-ecosystem-node-reel {
        left: 4%;
    }


    .ekc-ecosystem-node-carousel {
        right: 4%;
    }


    .ekc-ecosystem-node-blog {
        left: 2%;

        top: 480px;
    }


    .ekc-ecosystem-node-story {
        right: 2%;

        top: 480px;
    }


    .ekc-ecosystem-node-email {
        top: 600px;
    }


    .ekc-ecosystem-detail {
        bottom: 25px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .ekc-ecosystem-section {
        padding:
            85px
            0;
    }


    .ekc-ecosystem-container {
        width:
            calc(100% - 28px);
    }


    .ekc-ecosystem-heading {
        margin-bottom: 50px;
    }


    .ekc-ecosystem-heading h2 {
        font-size:
            clamp(
                45px,
                13vw,
                64px
            );
    }


    .ekc-ecosystem-heading-right > p {
        font-size: 15px;
    }


    .ekc-ecosystem-board {
        height: auto;

        min-height: 1050px;

        padding:
            40px
            18px;

        border-radius: 34px;
    }


    .ekc-ecosystem-lines,
    .ekc-ecosystem-grid-bg {
        display: none;
    }


    .ekc-ecosystem-center {
        position: relative;

        width: 205px;

        height: 205px;

        left: auto;

        top: auto;

        margin:
            0
            auto
            35px;

        transform: none;
    }


    .ekc-ecosystem-node {
        position: relative;

        width: 100%;

        min-width: 0;

        left: auto;

        right: auto;

        top: auto;

        margin-bottom: 13px;

        animation:
            none;
    }


    .ekc-ecosystem-node-email {
        transform: none;
    }


    .ekc-ecosystem-detail {
        position: relative;

        width: 100%;

        left: auto;

        bottom: auto;

        margin-top: 22px;

        transform: none;
    }


    .ekc-ecosystem-detail-body {
        grid-template-columns: 1fr;
    }


    .ekc-ecosystem-detail-visual {
        height: 150px;
    }


    .ekc-ecosystem-spark {
        display: none;
    }


    .ekc-ecosystem-principles {
        grid-template-columns: 1fr;
    }

}


/* =========================================================
   REDUCED MOTION
========================================================= */

@media (
    prefers-reduced-motion:
    reduce
) {

    .ekc-ecosystem-section *,
    .ekc-ecosystem-section *::before,
    .ekc-ecosystem-section *::after {
        animation-duration:
            0.01ms !important;

        animation-iteration-count:
            1 !important;

        transition-duration:
            0.01ms !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c053ce7 *//* =========================================================
   SECTION 5 — FEATURED CONTENT
   EKBAAL PALETTE: #31146a + #f5e61b
========================================================= */

.ekc-work-section,
.ekc-work-section *,
.ekc-work-section *::before,
.ekc-work-section *::after {
    box-sizing: border-box;
}


.ekc-work-section {
    /* Standalone palette */
    --ekc-purple: #31146a;
    --ekc-purple-dark: #1f0c45;
    --ekc-purple-mid: #5b3d8f;
    --ekc-purple-soft: #8069a9;
    --ekc-lavender: #e8e1f2;
    --ekc-lavender-light: #faf8fd;
    --ekc-yellow: #f5e61b;
    --ekc-yellow-soft: #fffbd8;
    --ekc-dark: #171717;
    --ekc-text: #707070;
    --ekc-border: rgba(49, 20, 106, .14);
    --ekc-shadow: 0 24px 60px rgba(49, 20, 106, .09);
    --ekc-shadow-hover: 0 35px 80px rgba(49, 20, 106, .16);

    position: relative;
    width: 100%;
    overflow: hidden;

    padding:
        120px
        0;

    font-family:
        "Poppins",
        "Plus Jakarta Sans",
        Arial,
        sans-serif;

    background:
        radial-gradient(
            circle at 4% 18%,
            rgba(245, 230, 27, .10),
            transparent 24%
        ),
        radial-gradient(
            circle at 96% 82%,
            rgba(49, 20, 106, .07),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #faf8fd 0%,
            #ffffff 100%
        );
}


/* =========================================================
   HEADING
========================================================= */

.ekc-work-heading {
    position: relative;
    margin-bottom: 65px;
}


/* Optional heading styles if your HTML uses them */

.ekc-work-heading .ekc-work-label {
    width: fit-content;

    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 20px;

    color: var(--ekc-purple);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .13em;
}


.ekc-work-heading .ekc-work-label::before {
    content: "";

    width: 11px;
    height: 11px;

    border-radius: 50%;

    background: var(--ekc-yellow);

    box-shadow:
        0 0 0 6px
        rgba(245, 230, 27, .15);
}


.ekc-work-heading h2 {
    margin: 0;

    color: var(--ekc-dark);

    font-size:
        clamp(
            50px,
            6vw,
            86px
        );

    line-height: .95;
    letter-spacing: -.06em;
    font-weight: 750;
}


.ekc-work-heading h2 span {
    color: var(--ekc-purple);
}


.ekc-work-heading p {
    max-width: 650px;

    margin:
        24px
        0
        0;

    color: var(--ekc-text);

    font-size: 17px;
    line-height: 1.75;
}


/* =========================================================
   GRID
========================================================= */

.ekc-work-grid {
    display: grid;

    grid-template-columns:
        1.3fr
        .7fr;

    grid-template-rows:
        1fr
        1fr;

    gap: 24px;
}


/* =========================================================
   CARD COMMON
========================================================= */

.ekc-work-card {
    position: relative;
    overflow: hidden;

    border:
        1px solid
        var(--ekc-border);

    border-radius: 38px;

    background:
        #ffffff;

    box-shadow:
        var(--ekc-shadow);

    transition:
        transform .5s
        cubic-bezier(.16,1,.3,1),
        box-shadow .5s ease,
        border-color .4s ease;
}


.ekc-work-card:hover {
    border-color:
        rgba(49, 20, 106, .28);

    transform:
        translateY(-10px);

    box-shadow:
        var(--ekc-shadow-hover);
}


.ekc-work-card-big {
    grid-row:
        span 2;
}


/* =========================================================
   BIG PREVIEW
========================================================= */

.ekc-work-preview {
    position: relative;

    min-height: 540px;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    padding: 45px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(245, 230, 27, .92),
            transparent 23%
        ),
        radial-gradient(
            circle at 15% 85%,
            rgba(255, 255, 255, .08),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #31146a 0%,
            #4b2b7c 58%,
            #8069a9 100%
        );
}


.ekc-work-preview::before {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    top: -150px;
    left: -100px;

    border:
        60px solid
        rgba(255,255,255,.11);

    border-radius: 50%;
}


.ekc-work-preview::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    right: -75px;
    bottom: -75px;

    border-radius: 50%;

    background:
        rgba(245, 230, 27, .11);
}


.ekc-work-preview-number {
    position: absolute;

    top: 26px;
    right: 34px;

    color:
        rgba(255,255,255,.18);

    font-size:
        clamp(
            76px,
            9vw,
            110px
        );

    line-height: 1;
    font-weight: 800;

    -webkit-text-stroke:
        1px
        rgba(255,255,255,.12);
}


.ekc-work-preview > span {
    position: relative;
    z-index: 2;

    color:
        var(--ekc-yellow);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
}


.ekc-work-preview h3 {
    position: relative;
    z-index: 2;

    max-width: 570px;

    margin:
        15px
        0
        0;

    color:
        #ffffff;

    font-size:
        clamp(
            42px,
            5vw,
            72px
        );

    line-height: .97;
    letter-spacing: -.055em;
}


/* =========================================================
   SMALL PREVIEWS
========================================================= */

.ekc-work-yellow-preview,
.ekc-work-dark-preview {
    position: relative;

    min-height: 240px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 30px;

    overflow: hidden;
}


.ekc-work-yellow-preview {
    color:
        var(--ekc-dark);

    background:
        radial-gradient(
            circle at 88% 15%,
            rgba(49, 20, 106, .12),
            transparent 25%
        ),
        linear-gradient(
            145deg,
            #f5e61b 0%,
            #fff45d 100%
        );
}


.ekc-work-yellow-preview::after {
    content: "";

    position: absolute;

    width: 105px;
    height: 105px;

    right: -35px;
    bottom: -35px;

    border:
        24px solid
        rgba(49, 20, 106, .10);

    border-radius: 50%;
}


.ekc-work-dark-preview {
    color:
        #ffffff;

    background:
        radial-gradient(
            circle at 85% 18%,
            rgba(245, 230, 27, .14),
            transparent 25%
        ),
        linear-gradient(
            145deg,
            #171717 0%,
            #1f0c45 100%
        );
}


.ekc-work-dark-preview::after {
    content: "✦";

    position: absolute;

    right: 27px;
    top: 24px;

    color:
        var(--ekc-yellow);

    font-size: 36px;

    opacity: .85;
}


.ekc-work-yellow-preview span,
.ekc-work-dark-preview span {
    position: relative;
    z-index: 2;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
}


.ekc-work-yellow-preview strong,
.ekc-work-dark-preview strong {
    position: relative;
    z-index: 2;

    max-width: 300px;

    font-size:
        clamp(
            30px,
            3vw,
            45px
        );

    line-height: 1;
    letter-spacing: -.035em;
}


/* =========================================================
   INFO
========================================================= */

.ekc-work-info {
    padding: 24px;

    background:
        #ffffff;
}


.ekc-work-info span {
    display: block;

    margin-bottom: 8px;

    color:
        var(--ekc-purple);

    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
}


.ekc-work-info strong {
    display: block;

    color:
        var(--ekc-dark);

    font-size: 20px;
    line-height: 1.35;
}


/* =========================================================
   OPTIONAL HOVER DETAILS
========================================================= */

.ekc-work-card:hover
.ekc-work-preview-number {
    transform:
        translateY(-5px)
        rotate(-3deg);
}


.ekc-work-preview-number {
    transition:
        transform .55s
        cubic-bezier(.16,1,.3,1);
}


/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 800px) {

    .ekc-work-section {
        padding:
            85px
            0;
    }


    .ekc-work-heading {
        margin-bottom:
            50px;
    }


    .ekc-work-heading h2 {
        font-size:
            clamp(
                45px,
                13vw,
                64px
            );
    }


    .ekc-work-heading p {
        font-size:
            15px;
    }


    .ekc-work-grid {
        grid-template-columns:
            1fr;

        grid-template-rows:
            auto;
    }


    .ekc-work-card-big {
        grid-row:
            auto;
    }


    .ekc-work-preview {
        min-height:
            430px;

        padding:
            30px;
    }


    .ekc-work-yellow-preview,
    .ekc-work-dark-preview {
        min-height:
            250px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .ekc-work-card {
        border-radius:
            30px;
    }


    .ekc-work-preview {
        min-height:
            390px;

        padding:
            26px;
    }


    .ekc-work-info {
        padding:
            21px;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-62f8090 *//* =========================================================
   SECTION 6 — CTA
========================================================= */

.ekc-cta-section {
    padding:
        110px
        0;

    background:
        #ffffff;
}


.ekc-cta-card {
    position: relative;

    min-height: 600px;

    display: grid;

    grid-template-columns:
        1.1fr
        .9fr;

    align-items: center;

    gap: 60px;

    padding:
        clamp(
            50px,
            7vw,
            90px
        );

    overflow: hidden;

    border:
        1px solid
        var(--ekc-border);

    border-radius: 50px;

    background:
        linear-gradient(
            135deg,
            #f3e8fb,
            #faf8fb 55%,
            #ffffff
        );

    box-shadow:
        var(--ekc-shadow);
}


.ekc-cta-content {
    position: relative;

    z-index: 3;
}


.ekc-cta-content h2 {
    font-size:
        clamp(
            48px,
            6vw,
            86px
        );

    line-height: .96;

    letter-spacing: -.06em;
}


.ekc-cta-content h2 span {
    position: relative;

    color:
        var(--ekc-purple);
}


.ekc-cta-content h2 span::after {
    content: "";

    position: absolute;

    left: 0;

    right: 0;

    bottom: 2px;

    height: 15px;

    z-index: -1;

    background:
        var(--ekc-yellow);

    border-radius: 999px;

    transform:
        rotate(-1deg);
}


.ekc-cta-content p {
    max-width: 570px;

    margin:
        25px 0 34px;

    color:
        var(--ekc-text);

    font-size: 17px;

    line-height: 1.75;
}
.ekc-cta-content a{
    font-weight: bold;
    padding: 10px 15px;
    background:
        var(--ekc-yellow);

    color:
        var(--ekc-dark);
    border-radius: calc(infinity * 1px);
}

/* VISUAL */

.ekc-cta-visual {
    position: relative;

    min-height: 430px;
}


.ekc-cta-word {
    position: absolute;

    padding:
        17px
        25px;

    border-radius: 999px;

    font-size:
        clamp(
            25px,
            3vw,
            43px
        );

    font-weight: 800;

    letter-spacing: -.03em;

    box-shadow:
        0 20px 45px
        rgba(70,40,80,.12);
}


.ekc-word-one {
    top: 55px;

    left: 10px;

    background:
        var(--ekc-yellow);

    color:
        var(--ekc-dark);

    transform:
        rotate(-9deg);

    animation:
        ekcWordFloat1
        5s
        ease-in-out
        infinite;
}


.ekc-word-two {
    top: 170px;

    right: 10px;

    background:
        var(--ekc-purple);

    color:
        #ffffff;

    transform:
        rotate(7deg);

    animation:
        ekcWordFloat2
        5.8s
        ease-in-out
        infinite;
}


.ekc-word-three {
    left: 50px;

    bottom: 40px;

    background:
        var(--ekc-dark);

    color:
       black !important;

    transform:
        rotate(-4deg);

    animation:
        ekcWordFloat3
        6.2s
        ease-in-out
        infinite;
}


.ekc-cta-star {
    position: absolute;

    right: 35px;

    bottom: 35px;

    color:
        var(--ekc-yellow);

    font-size: 100px;

    animation:
        ekcStarRotate
        12s
        linear
        infinite;
}


/* ORBS */

.ekc-cta-yellow-orb,
.ekc-cta-purple-orb {
    position: absolute;

    border-radius: 50%;
}


.ekc-cta-yellow-orb {
    width: 320px;

    height: 320px;

    right: -160px;

    top: -160px;

    background:
        rgba(245,230,27,.20);
}


.ekc-cta-purple-orb {
    width: 280px;

    height: 280px;

    left: -170px;

    bottom: -170px;

    background:
        rgba(184,43,236,.08);
}


/* ANIMATION */

@keyframes ekcWordFloat1 {
    0%,
    100% {
        transform:
            translateY(0)
            rotate(-9deg);
    }

    50% {
        transform:
            translateY(-15px)
            rotate(-6deg);
    }
}


@keyframes ekcWordFloat2 {
    0%,
    100% {
        transform:
            translateY(0)
            rotate(7deg);
    }

    50% {
        transform:
            translateY(-13px)
            rotate(4deg);
    }
}


@keyframes ekcWordFloat3 {
    0%,
    100% {
        transform:
            translateY(0)
            rotate(-4deg);
    }

    50% {
        transform:
            translateY(-12px)
            rotate(-1deg);
    }
}


@keyframes ekcStarRotate {
    from {
        transform:
            rotate(0deg);
    }

    to {
        transform:
            rotate(360deg);
    }
}


@media (max-width: 900px) {

    .ekc-cta-card {
        grid-template-columns:
            1fr;
    }


    .ekc-cta-visual {
        min-height:
            400px;
    }

}


@media (max-width: 767px) {

    .ekc-cta-section {
        padding:
            80px
            0;
    }


    .ekc-cta-card {
        padding:
            40px
            24px;

        border-radius:
            34px;
    }


    .ekc-cta-visual {
        min-height:
            340px;
    }

}/* End custom CSS */