/* =========================================================
   BITMINT LAB — CORE BASE
   Replaces required legacy style.css dependencies
========================================================= */

@import url(
    "https://fonts.googleapis.com/css?family=Muli:300,400,500,600,700,800|Oswald:200,300,400,500,600,700&display=swap"
);

html {
    scroll-behavior: auto;
    scroll-padding-top: 100px;
}

body {
    margin: 0;
    color: var(--wm-dark);

    font-family: "Muli", sans-serif;
    font-weight: 400;
    font-style: normal;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

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

    font-family: "Oswald", sans-serif;
    font-style: normal;
    font-weight: 500;
}

p {
    font-family: "Muli", sans-serif;
}

a {
    text-decoration: none;

    transition:
        color 0.25s ease,
        background-color 0.25s ease,
        border-color 0.25s ease,
        opacity 0.25s ease,
        transform 0.25s ease;
}

a:hover,
a:focus {
    text-decoration: none;
}

button,
input,
select,
textarea {
    font-family: inherit;
}

button:focus,
input:focus,
select:focus,
textarea:focus,
a:focus {
    outline: none;
}

ul {
    margin: 0;
    padding: 0;
}

li {
    list-style: none;
}

img {
    max-width: 100%;
}

.mb-40 {
    margin-bottom: 40px;
}


/* =========================================================
   PRELOADER
========================================================= */

#preloader-active {
    position: fixed;
    inset: 0;

    z-index: 999999;
}

.preloader {
    position: fixed;
    inset: 0;

    width: 100%;
    height: 100%;

    margin: 0 auto;

    background:
        radial-gradient(
            circle at center,
            rgba(0, 208, 132, 0.08),
            transparent 45%
        ),
        #ffffff;

    transition:
        opacity 0.35s ease,
        visibility 0.35s ease;
}

.preloader-inner {
    position: relative;

    width: 110px;
    height: 110px;
}

.preloader-circle {
    position: absolute;
    inset: 0;

    width: 110px;
    height: 110px;

    border: 2px solid rgba(0, 208, 132, 0.12);
    border-top-color: var(--wm-primary, #00d084);

    border-radius: 50%;

    animation:
        wm-preloader-spin 1.1s linear infinite;
}

.preloader-img {
    position: absolute;
    top: 50%;
    left: 50%;

    z-index: 2;

    width: 72px;

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

    text-align: center;
}

.preloader-img img {
    display: block;

    width: auto;
    max-width: 64px;
    max-height: 64px;

    margin: 0 auto;

    object-fit: contain;
}

@keyframes wm-preloader-spin {

    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }

}

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

    .preloader-circle {
        animation: none;
    }

}

/* =========================================================
   ABOUT BITMINT LAB — MODERN SECTION
========================================================= */

.wm-about-section {
    position: relative;

    padding: 120px 0;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #f8fcfa 0%,
            #ffffff 48%,
            #f5f8ff 100%
        );

    isolation: isolate;
}

.wm-about-container {
    position: relative;
    z-index: 4;
}


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

.wm-about-background {
    position: absolute;
    inset: 0;

    z-index: 0;

    overflow: hidden;

    pointer-events: none;
}

.wm-about-grid {
    position: absolute;
    inset: 0;

    opacity: 0.34;

    background-image:
        linear-gradient(
            rgba(25, 53, 73, 0.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(25, 53, 73, 0.04) 1px,
            transparent 1px
        );

    background-size: 48px 48px;

    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 18%,
            #000 82%,
            transparent
        );
}

.wm-about-glow {
    position: absolute;

    display: block;

    border-radius: 50%;

    filter: blur(8px);

    pointer-events: none;
}

.wm-about-glow-one {
    top: -250px;
    right: -230px;

    width: 620px;
    height: 620px;

    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.13),
            transparent 70%
        );
}

.wm-about-glow-two {
    bottom: -280px;
    left: -250px;

    width: 650px;
    height: 650px;

    background:
        radial-gradient(
            circle,
            rgba(81, 108, 255, 0.09),
            transparent 70%
        );
}


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

.wm-about-heading {
    max-width: 810px;

    margin-bottom: 55px;
}

.wm-about-badge {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    min-height: 37px;

    padding: 8px 15px;

    margin-bottom: 20px;

    color: #147954;

    background:
        rgba(0, 208, 132, 0.09);

    border:
        1px solid
        rgba(0, 208, 132, 0.18);

    border-radius: 999px;

    font-size: 11px;

    font-weight: 800;
}

.wm-about-badge i {
    color: var(--wm-primary);
}

.wm-about-heading h2 {
    max-width: 800px;

    margin: 0 0 20px;

    color: var(--wm-dark);

    font-size:
        clamp(40px, 4.4vw, 58px);

    font-weight: 800;

    line-height: 1.1;

    letter-spacing: -2px;
}

.wm-about-heading h2 span {
    color:
        var(--wm-primary-dark);
}

.wm-about-heading p {
    max-width: 720px;

    margin: 0;

    color: #637486;

    font-size: 17px;

    line-height: 1.8;
}


/* Header Note */

.wm-about-header-note {
    display: flex;

    align-items: center;

    gap: 14px;

    padding: 19px;

    margin-bottom: 55px;

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

    border:
        1px solid #e1eae6;

    border-radius: 17px;

    box-shadow:
        0 14px 35px
        rgba(23, 42, 62, 0.06);

    backdrop-filter: blur(12px);
}

.wm-about-note-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 52px;
    height: 52px;
    flex: 0 0 52px;

    padding: 0 !important;

    color: #10231b;

    background:
        linear-gradient(
            135deg,
            #79f1ba,
            #00d084
        );

    border-radius: 15px;
}
.wm-about-note-icon i {
    position: static !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    display: inline-block !important;

    width: auto !important;
    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    font-size: 20px !important;
    line-height: 1 !important;

    color: #10231b !important;

    transform: none !important;
}

.wm-about-header-note span {
    display: block;

    margin-bottom: 3px;

    color:
        var(--wm-primary-dark);

    font-size: 8px;

    font-weight: 900;

    letter-spacing: 0.65px;

    text-transform: uppercase;
}

.wm-about-header-note strong {
    display: block;

    color: var(--wm-dark);

    font-size: 12px;

    line-height: 1.5;
}


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

.wm-about-layout {
    display: grid;

    grid-template-columns:
        minmax(0, 1.55fr)
        minmax(0, 0.9fr);

    gap: 24px;
}


/* =========================================================
   MAIN DARK CARD
========================================================= */

.wm-about-main-card {
    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(240px, 0.75fr);

    gap: 25px;

    min-height: 500px;

    padding: 40px;

    overflow: hidden;

    color: #ffffff;

    background:
        linear-gradient(
            145deg,
            #151d31 0%,
            #19374a 58%,
            #123b39 100%
        );

    border:
        1px solid
        rgba(255, 255, 255, 0.08);

    border-radius: 28px;

    box-shadow:
        0 25px 70px
        rgba(20, 35, 54, 0.18);
}

.wm-about-main-content {
    position: relative;

    z-index: 3;
}

.wm-about-label {
    display: block;

    margin-bottom: 11px;

    color: #76edb7;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 0.8px;

    text-transform: uppercase;
}

.wm-about-main-card h3 {
    max-width: 500px;

    margin: 0 0 20px;

    color: #ffffff;

    font-size: 34px;

    font-weight: 800;

    line-height: 1.18;

    letter-spacing: -1px;
}

.wm-about-main-card p {
    max-width: 540px;

    margin: 0 0 17px;

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

    font-size: 13px;

    line-height: 1.75;
}


/* Principles */

.wm-about-principles {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 12px;

    margin-top: 29px;
}

.wm-about-principle {
    display: flex;

    align-items: flex-start;

    gap: 11px;

    padding: 14px;

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

    border:
        1px solid
        rgba(255, 255, 255, 0.08);

    border-radius: 14px;
}

.wm-about-principle > span {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 37px;
    height: 37px;

    flex: 0 0 37px;

    color: #72edb6;

    background:
        rgba(0, 208, 132, 0.12);

    border-radius: 10px;
}

.wm-about-principle strong {
    display: block;

    margin-bottom: 3px;

    color: #ffffff;

    font-size: 10px;
}

.wm-about-principle small {
    display: block;

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

    font-size: 8px;

    line-height: 1.5;
}


/* =========================================================
   ABOUT VISUAL
========================================================= */

.wm-about-main-visual {
    position: relative;

    z-index: 2;

    min-height: 390px;
}

.wm-about-core {
    position: absolute;

    top: 50%;
    left: 50%;

    display: flex;

    align-items: center;
    flex-direction: column;
    justify-content: center;

    width: 155px;
    height: 155px;

    padding: 20px;

    color: #ffffff;

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

    border:
        1px solid
        rgba(255, 255, 255, 0.11);

    border-radius: 32px;

    box-shadow:
        0 24px 55px
        rgba(0, 0, 0, 0.2);

    backdrop-filter: blur(15px);

    text-align: center;

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

.wm-about-core-logo {
    display: block;

    width: 54px;
    height: 54px;

    margin-bottom: 11px;

    object-fit: contain;
}

.wm-about-core strong {
    margin-bottom: 4px;

    font-size: 14px;
}

.wm-about-core small {
    color:
        rgba(255, 255, 255, 0.48);

    font-size: 7px;
}


/* Floating labels */

.wm-about-orbit-item {
    position: absolute;

    display: inline-flex;

    align-items: center;

    gap: 7px;

    min-height: 38px;

    padding: 10px 12px;

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

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

    border:
        1px solid
        rgba(255, 255, 255, 0.1);

    border-radius: 12px;

    box-shadow:
        0 13px 28px
        rgba(0, 0, 0, 0.13);

    backdrop-filter: blur(12px);

    font-size: 9px;

    font-weight: 800;
}

.wm-about-orbit-item i {
    color: #6cebb2;
}

.wm-about-orbit-product {
    top: 40px;
    left: 0;
}

.wm-about-orbit-custom {
    top: 70px;
    right: 0;
}

.wm-about-orbit-scale {
    bottom: 45px;
    left: 12px;
}


/* =========================================================
   FEATURE CARDS
========================================================= */

.wm-about-feature-grid {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 18px;
}

.wm-about-feature-card {
    position: relative;

    min-width: 0;

    padding: 25px;

    overflow: hidden;

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

    border:
        1px solid #e2eae7;

    border-radius: 21px;

    box-shadow:
        0 13px 37px
        rgba(22, 41, 60, 0.06);
}

.wm-about-feature-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 50px;
    height: 50px;

    margin-bottom: 28px;

    color: #ffffff;

    border-radius: 15px;

    box-shadow:
        0 12px 24px
        rgba(20, 38, 57, 0.15);
}

.wm-about-icon-product {
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00a36a
        );
}

.wm-about-icon-platform {
    background:
        linear-gradient(
            135deg,
            #5d83ff,
            #6855db
        );
}

.wm-about-feature-number {
    position: absolute;

    top: 25px;
    right: 25px;

    color: #dbe3e6;

    font-size: 23px;

    font-weight: 900;
}

.wm-about-feature-card h3 {
    margin: 0 0 12px;

    color: var(--wm-dark);

    font-size: 21px;

    font-weight: 800;
}

.wm-about-feature-card p {
    margin: 0 0 22px;

    color: #657587;

    font-size: 11px;

    line-height: 1.7;
}

.wm-about-feature-tag {
    display: inline-flex;

    padding: 6px 10px;

    color:
        var(--wm-primary-dark);

    background:
        rgba(0, 208, 132, 0.09);

    border:
        1px solid
        rgba(0, 208, 132, 0.16);

    border-radius: 999px;

    font-size: 8px;

    font-weight: 800;
}


/* Wide feature */

.wm-about-feature-wide {
    grid-column: 1 / -1;

    display: flex;

    align-items: center;

    gap: 18px;

    background:
        linear-gradient(
            135deg,
            #f5fbf8,
            #f4f7ff
        );
}

.wm-about-wide-icon {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    width: 55px;
    height: 55px;

    flex: 0 0 55px;

    color: #10231b;

    background:
        linear-gradient(
            135deg,
            #7bf1ba,
            #00d084
        );

    border-radius: 16px;
}

.wm-about-feature-label {
    display: block;

    margin-bottom: 5px;

    color:
        var(--wm-primary-dark);

    font-size: 8px;

    font-weight: 900;

    text-transform: uppercase;

    letter-spacing: 0.65px;
}

.wm-about-feature-wide h3 {
    margin-bottom: 6px;

    font-size: 17px;
}

.wm-about-feature-wide p {
    margin: 0;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {

    .wm-about-section {
        padding: 100px 0;
    }

    .wm-about-main-card {
        grid-template-columns: 1fr;
    }

    .wm-about-main-visual {
        min-height: 300px;
    }

}


@media (max-width: 991px) {

    .wm-about-layout {
        grid-template-columns: 1fr;
    }

    .wm-about-header-note {
        max-width: 500px;

        margin-bottom: 45px;
    }

}


@media (max-width: 767px) {

    .wm-about-section {
        padding: 80px 0;
    }

    .wm-about-heading h2 {
        font-size: 41px;

        letter-spacing: -1.3px;
    }

    .wm-about-heading p {
        font-size: 15px;
    }

    .wm-about-main-card {
        padding: 29px;
    }

    .wm-about-principles {
        grid-template-columns: 1fr;
    }

}


@media (max-width: 575px) {

    .wm-about-section {
        padding: 65px 0;
    }

    .wm-about-heading h2 {
        font-size: 34px;

        letter-spacing: -0.8px;
    }

    .wm-about-main-card {
        padding: 22px;

        border-radius: 21px;
    }

    .wm-about-main-card h3 {
        font-size: 27px;
    }

    .wm-about-main-visual {
        min-height: 260px;
    }

    .wm-about-feature-grid {
        grid-template-columns: 1fr;
    }

    .wm-about-feature-wide {
        grid-column: auto;

        align-items: flex-start;

        flex-direction: column;
    }

}

/* =========================================================
   SHARED LEGACY-COMPATIBLE UTILITIES
   Confirmed used by current markup
========================================================= */

.section-space {
    padding: 95px 0;
}

.section-light {
    background: var(--wm-bg);
}

.about-box {
    padding: 38px;
    background: #ffffff;
    border: 1px solid var(--wm-border);
    border-radius: 28px;
    box-shadow: 0 20px 60px rgba(26, 58, 82, 0.08);
}

.about-box h2 {
    margin-bottom: 18px;
    color: var(--wm-dark);
    font-size: 42px;
}

.about-box p {
    color: var(--wm-muted);
}

.metric {
    margin-bottom: 18px;
    padding: 22px;
    background: rgba(0, 208, 132, 0.10);
    border-radius: 18px;
}

.metric strong {
    display: block;
    color: var(--wm-dark);
    font-family: "Oswald", sans-serif;
    font-size: 30px;
}

.metric span {
    color: var(--wm-muted);
    font-weight: 700;
}

.preloader-img img {
    max-height: 72px;
    width: auto;
}

.wm-eyebrow {
    color: var(--wm-primary);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1.5px;
}

/* =========================================================
   SOLUTION STRIP — RESPONSIVE MOTION
========================================================= */

.solution-strip {
    position: relative;
    overflow: hidden;

    padding: 16px 0;

    background:
        linear-gradient(
            90deg,
            #111326,
            #15192f,
            #111326
        );

    border-top:
        1px solid rgba(255, 255, 255, 0.05);

    border-bottom:
        1px solid rgba(255, 255, 255, 0.05);
}

.solution-strip::before,
.solution-strip::after {
    position: absolute;

    top: 0;
    bottom: 0;

    z-index: 3;

    width: 100px;

    content: "";

    pointer-events: none;
}

.solution-strip::before {
    left: 0;

    background:
        linear-gradient(
            to right,
            #111326,
            transparent
        );
}

.solution-strip::after {
    right: 0;

    background:
        linear-gradient(
            to left,
            #111326,
            transparent
        );
}


.solution-strip-track {
    display: flex;

    width: max-content;

    animation:
        wmSolutionMarquee
        28s linear infinite;

    will-change: transform;
}


.solution-strip-group {
    display: flex;

    align-items: center;

    gap: 18px;

    flex-shrink: 0;

    padding-right: 18px;
}


.solution-strip-item {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    min-height: 44px;

    padding: 10px 18px;

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

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

    border:
        1px solid
        rgba(255, 255, 255, 0.07);

    border-radius: 999px;

    font-size: 13px;

    font-weight: 700;

    white-space: nowrap;

    transition:
        transform .25s ease,
        background .25s ease,
        border-color .25s ease,
        color .25s ease,
        box-shadow .25s ease;
}


.solution-strip-item i {
    color: #00d084;

    font-size: 12px;
}


.solution-strip-item:hover {
    color: #ffffff;

    background:
        rgba(0, 208, 132, 0.1);

    border-color:
        rgba(0, 208, 132, 0.25);

    box-shadow:
        0 8px 25px
        rgba(0, 208, 132, 0.08);

    transform:
        translateY(-2px);
}


.solution-strip:hover
.solution-strip-track {
    animation-play-state: paused;
}


@keyframes wmSolutionMarquee {

    from {
        transform:
            translate3d(0, 0, 0);
    }

    to {
        transform:
            translate3d(-50%, 0, 0);
    }

}


/* Tablet */

@media (max-width: 991px) {

    .solution-strip {
        padding: 14px 0;
    }

    .solution-strip-track {
        animation-duration: 24s;
    }

    .solution-strip-item {
        min-height: 40px;

        padding:
            9px 15px;

        font-size: 12px;
    }

}


/* Mobile */

@media (max-width: 575px) {

    .solution-strip {
        padding: 12px 0;
    }

    .solution-strip::before,
    .solution-strip::after {
        width: 45px;
    }

    .solution-strip-group {
        gap: 10px;

        padding-right: 10px;
    }

    .solution-strip-item {
        min-height: 38px;

        padding:
            8px 13px;

        font-size: 11px;
    }

    .solution-strip-track {
        animation-duration: 20s;
    }

}


/* Reduced Motion */

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

    .solution-strip-track {
        animation: none;
    }

}

.featured-product-visual {
    min-height: 430px;
    padding: 35px;
    border-radius: 30px;
    background: linear-gradient(145deg, var(--wm-dark), var(--wm-blue));
    display: flex;
    flex-direction: column;
}

.visual-label {
    color: var(--wm-primary);
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.dashboard-placeholder {
    flex: 1;
    margin-top: 25px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.08);
    color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 35px;
}

.dashboard-placeholder i {
    font-size: 56px;
    color: var(--wm-primary);
    margin-bottom: 20px;
}

.dashboard-placeholder strong {
    font-size: 26px;
    margin-bottom: 10px;
}

.dashboard-placeholder span {
    color: rgba(255, 255, 255, 0.68);
}

.featured-product-copy h2 {
    color: var(--wm-dark);
    font-size: 44px;
    margin: 12px 0 18px;
}

.featured-product-copy p {
    color: var(--wm-muted);
    margin-bottom: 25px;
}

.feature-list-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 30px;
}

.feature-list-grid span {
    color: var(--wm-blue);
    font-weight: 700;
}

.feature-list-grid i {
    color: var(--wm-primary);
    margin-right: 8px;
}

@media (max-width: 991px) {
    .about-box h2,
    .featured-product-copy h2 {
        font-size: 34px;
    }

    .solution-strip-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575px) {
    .section-space {
        padding: 65px 0;
    }

    .solution-strip-grid,
    .feature-list-grid {
        grid-template-columns: 1fr;
    }

    .solution-strip-grid span {
        padding: 5px 0;
    }

    .featured-product-visual {
        min-height: 340px;
        padding: 22px;
    }
}


/* =========================================================
   BITMINT LAB HEADER
========================================================= */

:root {
    --wm-primary: #00d084;
    --wm-primary-dark: #00a96c;
    --wm-dark: #141426;
    --wm-blue: #1a3a52;
    --wm-text: #4f5f70;
    --wm-muted: #607089;
    --wm-white: #ffffff;
    --wm-bg: #f7fafc;
    --wm-card: #ffffff;
    --wm-border: #e6edf2;
    --wm-header-height: 84px;
}

/* Prevent section content from hiding behind sticky header */
body {
    padding-top: var(--wm-header-height);
}

/* Main header */
.wm-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
}

.wm-navbar {
    min-height: var(--wm-header-height);
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid transparent;
    transition:
        min-height 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.wm-header-container {
    max-width: 1440px;
    padding-right: 45px;
    padding-left: 45px;
}

/* Header state after scrolling */
.wm-header.wm-header-scrolled .wm-navbar {
    min-height: 72px;
    background: rgba(255, 255, 255, 0.98);
    border-bottom-color: var(--wm-border);
    box-shadow: 0 12px 35px rgba(20, 20, 38, 0.08);
}

/* Logo */
.wm-logo {
    display: flex;
    align-items: center;
}

.wm-logo a {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.wm-logo-image {
    width: auto;
    height: 50px;
    object-fit: contain;
    transition: height 0.3s ease;
}

.wm-logo-text {
    color: var(--wm-dark);
    font-family: "Oswald", sans-serif;
    font-size: 25px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.3px;
    white-space: nowrap;
}

.wm-logo-text strong {
    color: var(--wm-primary);
    font-weight: 700;
}

.wm-header.wm-header-scrolled .wm-logo-image {
    height: 44px;
}

/* Desktop navigation */
.wm-main-menu {
    display: flex;
    align-items: center;
    justify-content: center;
}

.wm-main-menu nav {
    width: 100%;
}

.wm-main-menu #navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 34px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wm-main-menu #navigation > li {
    position: relative;
    display: block;
    margin: 0;
}

.wm-main-menu #navigation > li > a {
    position: relative;
    display: block;
    padding: 31px 0;
    color: var(--wm-dark);
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition:
        color 0.25s ease,
        padding 0.3s ease;
}

.wm-header.wm-header-scrolled .wm-main-menu #navigation > li > a {
    padding-top: 25px;
    padding-bottom: 25px;
}

.wm-main-menu #navigation > li > a::after {
    position: absolute;
    right: 0;
    bottom: 20px;
    left: 0;
    width: 0;
    height: 2px;
    margin: auto;
    background: var(--wm-primary);
    border-radius: 10px;
    content: "";
    transition: width 0.25s ease;
}

.wm-main-menu #navigation > li > a:hover,
.wm-main-menu #navigation > li > a.active {
    color: var(--wm-primary-dark);
}

.wm-main-menu #navigation > li > a:hover::after,
.wm-main-menu #navigation > li > a.active::after {
    width: 100%;
}

/* Header CTA */
.wm-header-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.wm-header-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 14px 23px;
    overflow: hidden;
    color: var(--wm-white) !important;
    background: var(--wm-primary);
    border: 1px solid var(--wm-primary);
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 208, 132, 0.2);
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-header-btn:hover {
    color: var(--wm-white) !important;
    background: var(--wm-primary-dark);
    border-color: var(--wm-primary-dark);
    box-shadow: 0 14px 30px rgba(0, 169, 108, 0.25);
    transform: translateY(-2px);
}

.wm-header-btn i {
    font-size: 12px;
    transition: transform 0.25s ease;
}

.wm-header-btn:hover i {
    transform: translateX(4px);
}

/* Mobile menu container */
.wm-mobile-menu-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    min-height: var(--wm-header-height);
}

/* SlickNav mobile menu */
.wm-header .slicknav_menu {
    width: 100%;
    padding: 0;
    background: transparent;
}
.wm-header .slicknav_btn {
    position: absolute;
    top: 50%;
    right: 16px;
    float: none;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;
    padding: 0;
    margin: 0;

    transform: translateY(-50%);

    background: #f2f7f5;
    border: 1px solid var(--wm-border);
    border-radius: 12px;
    box-shadow: none;
    text-shadow: none;

    cursor: pointer;
    z-index: 999;
}

.wm-header .slicknav_icon {
    position: static;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 22px;
    height: 18px;

    padding: 0;
    margin: 0;
}

.wm-header .slicknav_icon-bar {
    position: static;

    display: block;
    width: 22px;
    height: 2px;

    margin: 2.5px 0;

    background: #f59b23 !important;
    border-radius: 10px;
    box-shadow: none;
}


.wm-header .slicknav_nav {
    position: fixed;
    top: 84px;
    right: 15px;
    left: 15px;
    max-height: calc(100vh - 105px);
    padding: 14px;
    overflow-y: auto;
    background: var(--wm-white);
    border: 1px solid var(--wm-border);
    border-radius: 18px;
    box-shadow: 0 25px 55px rgba(20, 20, 38, 0.16);
}

.wm-header.wm-header-scrolled .slicknav_nav {
    top: 73px;
}

.wm-header .slicknav_nav ul {
    margin: 0;
}

.wm-header .slicknav_nav li {
    display: block;
    margin: 0;
    border-bottom: 1px solid #edf2f5;
}

.wm-header .slicknav_nav li:last-child {
    border-bottom: 0;
}

.wm-header .slicknav_nav a {
    padding: 14px 15px;
    margin: 0;
    color: var(--wm-dark);
    background: transparent;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 700;
    text-transform: none;
    transition:
        color 0.2s ease,
        background 0.2s ease;
}

.wm-header .slicknav_nav a:hover,
.wm-header .slicknav_nav a.active {
    color: var(--wm-primary-dark);
    background: rgba(0, 208, 132, 0.1);
    border-radius: 10px;
}

/* Focus accessibility */
.wm-logo a:focus-visible,
.wm-main-menu a:focus-visible,
.wm-header-btn:focus-visible,
.wm-header .slicknav_btn:focus-visible {
    outline: 3px solid rgba(0, 208, 132, 0.35);
    outline-offset: 4px;
}

/* Tablet */
@media (max-width: 1199px) {
    .wm-header-container {
        padding-right: 25px;
        padding-left: 25px;
    }

    .wm-main-menu #navigation {
        gap: 22px;
    }

    .wm-main-menu #navigation > li > a {
        font-size: 14px;
    }

    .wm-header-btn {
        padding-right: 18px;
        padding-left: 18px;
        font-size: 13px;
    }
}

/* Mobile */
@media (max-width: 991px) {
    :root {
        --wm-header-height: 76px;
    }

    body {
        padding-top: 76px;
    }

    .wm-navbar {
        min-height: 76px;
    }

    .wm-header-container {
        padding-right: 18px;
        padding-left: 18px;
    }

    .wm-logo-image {
        height: 44px;
    }

    .wm-logo-text {
        font-size: 22px;
    }

    .wm-mobile-menu-wrapper {
        min-height: 76px;
    }

    .wm-header .slicknav_nav {
        top: 77px;
    }

    .wm-header.wm-header-scrolled .slicknav_nav {
        top: 73px;
    }
}

/* Small mobile */
@media (max-width: 575px) {
    .wm-header-container {
        padding-right: 12px;
        padding-left: 12px;
    }

    .wm-logo a {
        gap: 8px;
    }

    .wm-logo-image {
        height: 39px;
    }

    .wm-logo-text {
        font-size: 19px;
    }

    .wm-header .slicknav_btn {
        width: 42px;
        height: 42px;
    }

    .wm-header .slicknav_nav {
        right: 10px;
        left: 10px;
    }
}

/* Very small mobile */
@media (max-width: 380px) {
    .wm-logo-text {
        display: none;
    }
}


/* =========================================================
   MOBILE NAVIGATION — FINAL CLEAN VERSION
========================================================= */

.wm-mobile-menu-wrapper {
    position: relative;

    width: 100%;
    height: var(--wm-header-height);
    min-height: var(--wm-header-height);

    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/*
 * SlickNav injects generated markup inside .mobile_menu.
 * Keep .mobile_menu inside the header itself.
 */
.mobile_menu {
    position: absolute;

    top: 0;
    right: 0;

    width: 100%;
    height: 100%;

    z-index: 999;
}

.wm-header .slicknav_menu {
    position: relative;

    width: 100%;
    height: 100%;

    padding: 0;
    margin: 0;

    background: transparent;
}

/* Hamburger button */
.wm-header .slicknav_btn {
    position: absolute !important;

    top: 50% !important;
    right: 0 !important;

    width: 42px;
    height: 42px;

    margin: 0 !important;
    padding: 0 !important;

    float: none !important;

    display: flex !important;
    align-items: center;
    justify-content: center;

    transform: translateY(-54%) !important;

    background: #f2f7f5;
    border: 1px solid var(--wm-border);
    border-radius: 12px;

    box-shadow: none;
    text-shadow: none;

    cursor: pointer;

    z-index: 1001;
}

/* Hide SlickNav "MENU" text if generated */
.wm-header .slicknav_menutxt {
    display: none !important;
}

/* Hamburger icon wrapper */
.wm-header .slicknav_icon {
    position: static !important;

    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    width: 22px !important;
    height: 18px !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* Hamburger three lines */
.wm-header .slicknav_icon-bar {
    position: static !important;

    display: block !important;

    width: 22px !important;
    height: 2px !important;

    margin: 2.5px 0 !important;

    background: #f59b23 !important;

    border-radius: 10px;

    box-shadow: none !important;
}

/* Dropdown panel */
.wm-header .slicknav_nav {
    position: fixed;

    top: 77px;
    right: 15px;
    left: 15px;

    max-height: calc(100vh - 100px);

    padding: 14px;

    overflow-y: auto;

    background: var(--wm-white);

    border: 1px solid var(--wm-border);
    border-radius: 18px;

    box-shadow:
        0 25px 55px
        rgba(20, 20, 38, 0.16);

    z-index: 1000;
}

/* Scrolled header */
.wm-header.wm-header-scrolled .wm-mobile-menu-wrapper {
    height: 72px;
    min-height: 72px;
}

.wm-header.wm-header-scrolled .slicknav_nav {
    top: 73px;
}


/* Mobile */
@media (max-width: 991px) {

    :root {
        --wm-header-height: 76px;
    }

    body {
        padding-top: 76px;
    }

    .wm-navbar {
        min-height: 76px;
    }

    .wm-header-container {
        padding-right: 18px;
        padding-left: 18px;
    }

    .wm-logo-image {
        height: 44px;
    }

    .wm-logo-text {
        font-size: 22px;
    }
}


/* Small Mobile */
@media (max-width: 575px) {

    .wm-header-container {
        padding-right: 12px;
        padding-left: 12px;
    }

    .wm-logo a {
        gap: 8px;
    }

    .wm-logo-image {
        height: 39px;
    }

    .wm-logo-text {
        font-size: 19px;
    }

    /*
     * Slightly above exact center as requested.
     * One single positioning rule only.
     */
    .wm-header .slicknav_btn {
        transform: translateY(-58%) !important;
    }

    .wm-header .slicknav_nav {
        right: 10px;
        left: 10px;
    }
}


/* Very Small Mobile */
@media (max-width: 380px) {

    .wm-logo-text {
        display: none;
    }

}


/* Desktop — mobile menu completely hidden */
@media (min-width: 992px) {

    .mobile_menu {
        display: none !important;
    }

}


/* =========================================================
   PHASE 3 — MODERN HERO SECTION
========================================================= */

.wm-hero {
    position: relative;
    min-height: calc(100vh - 84px);
    display: flex;
    align-items: center;
    padding: 95px 0 105px;
    overflow: hidden;
    background:
        linear-gradient(
            135deg,
            #f9fffc 0%,
            #f5fbff 48%,
            #f8f7ff 100%
        );
    isolation: isolate;
}

.wm-hero-container {
    position: relative;
    z-index: 5;
}


/* =========================================================
   HERO BACKGROUND EFFECTS
========================================================= */

.wm-hero-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-hero-grid {
    position: absolute;
    inset: 0;
    opacity: 0.42;
    background-image:
        linear-gradient(
            rgba(26, 58, 82, 0.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(26, 58, 82, 0.045) 1px,
            transparent 1px
        );
    background-size: 48px 48px;
    mask-image:
        linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0.8),
            transparent 88%
        );
}

.wm-hero-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    opacity: 0.72;
    animation: wmGlowFloat 9s ease-in-out infinite;
}

.wm-hero-glow-one {
    top: -180px;
    left: -160px;
    width: 560px;
    height: 560px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.26) 0%,
            rgba(0, 208, 132, 0.06) 52%,
            transparent 72%
        );
}

.wm-hero-glow-two {
    right: -220px;
    bottom: -240px;
    width: 680px;
    height: 680px;
    background:
        radial-gradient(
            circle,
            rgba(97, 87, 255, 0.18) 0%,
            rgba(79, 135, 255, 0.08) 50%,
            transparent 74%
        );
    animation-delay: -4s;
}

.wm-hero-orbit {
    position: absolute;
    display: block;
    border: 1px solid rgba(0, 208, 132, 0.14);
    border-radius: 50%;
    animation: wmOrbitRotate 22s linear infinite;
}

.wm-hero-orbit-one {
    top: 80px;
    right: 8%;
    width: 430px;
    height: 430px;
}

.wm-hero-orbit-two {
    right: 2%;
    bottom: -150px;
    width: 580px;
    height: 580px;
    border-color: rgba(26, 58, 82, 0.09);
    animation-duration: 30s;
    animation-direction: reverse;
}

.wm-hero-bottom-fade {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 110px;
    z-index: 1;
    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(255, 255, 255, 0.86)
        );
    pointer-events: none;
}


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

.wm-hero-content {
    position: relative;
    z-index: 5;
    max-width: 650px;
    padding-right: 25px;
}

.wm-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 8px 15px;
    margin-bottom: 24px;
    color: #175d48;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(0, 208, 132, 0.23);
    border-radius: 999px;
    box-shadow: 0 8px 25px rgba(26, 58, 82, 0.07);
    backdrop-filter: blur(12px);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2px;
}

.wm-badge-dot {
    position: relative;
    display: inline-block;
    width: 9px;
    height: 9px;
    flex: 0 0 9px;
    background: var(--wm-primary);
    border-radius: 50%;
}

.wm-badge-dot::after {
    position: absolute;
    inset: -5px;
    content: "";
    background: rgba(0, 208, 132, 0.18);
    border-radius: 50%;
    animation: wmBadgePulse 2s ease-out infinite;
}

.wm-hero-title {
    max-width: 650px;
    margin: 0 0 24px;
    color: var(--wm-dark);
    font-size: clamp(48px, 5.2vw, 76px);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -2.7px;
}

.wm-gradient-text {
    display: inline;
    color: var(--wm-primary);
    background:
        linear-gradient(
            90deg,
            #00a96c 0%,
            #00d084 42%,
            #438dff 100%
        );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.wm-hero-description {
    max-width: 610px;
    margin: 0 0 34px;
    color: #586a7a;
    font-size: 18px;
    line-height: 1.8;
}

.wm-hero-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-bottom: 34px;
}

.wm-hero-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 56px;
    padding: 16px 25px;
    overflow: hidden;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-hero-button::before {
    position: absolute;
    top: 0;
    left: -120%;
    width: 70%;
    height: 100%;
    content: "";
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255, 255, 255, 0.34),
            transparent
        );
    transform: skewX(-25deg);
    transition: left 0.55s ease;
}

.wm-hero-button:hover::before {
    left: 145%;
}

.wm-hero-button-primary {
    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00aa70
        );
    border: 1px solid #00bd79;
    box-shadow:
        0 16px 35px rgba(0, 208, 132, 0.26);
}

.wm-hero-button-primary:hover {
    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            #00bd79,
            #009b66
        );
    box-shadow:
        0 20px 42px rgba(0, 169, 108, 0.32);
    transform: translateY(-3px);
}

.wm-hero-button-primary i {
    font-size: 12px;
    transition: transform 0.25s ease;
}

.wm-hero-button-primary:hover i {
    transform: translateX(5px);
}

.wm-hero-button-secondary {
    color: var(--wm-dark) !important;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid rgba(26, 58, 82, 0.13);
    box-shadow:
        0 12px 30px rgba(26, 58, 82, 0.08);
    backdrop-filter: blur(12px);
}

.wm-hero-button-secondary:hover {
    color: var(--wm-dark) !important;
    background: #ffffff;
    border-color: rgba(0, 208, 132, 0.35);
    box-shadow:
        0 17px 35px rgba(26, 58, 82, 0.12);
    transform: translateY(-3px);
}

.wm-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: var(--wm-primary);
    background: rgba(0, 208, 132, 0.1);
    border-radius: 9px;
}

.wm-hero-trust {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px 22px;
}

.wm-trust-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #526475;
    font-size: 13px;
    font-weight: 700;
}

.wm-trust-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    color: #ffffff;
    background: var(--wm-primary);
    border-radius: 50%;
    font-size: 9px;
}


/* =========================================================
   PRODUCT ECOSYSTEM VISUAL
========================================================= */

.wm-hero-visual {
    position: relative;
    width: 100%;
    min-height: 610px;
    margin-left: 18px;
    perspective: 1200px;
    transform-style: preserve-3d;
}

.wm-ecosystem-window {
    position: absolute;
    top: 74px;
    right: 10px;
    width: calc(100% - 45px);
    max-width: 610px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.94);
    border-radius: 25px;
    box-shadow:
        0 40px 100px rgba(19, 38, 59, 0.2),
        0 8px 30px rgba(0, 208, 132, 0.08);
    backdrop-filter: blur(24px);
    transform:
        rotateY(-4deg)
        rotateX(2deg);
    transform-origin: center;
    transition: transform 0.25s ease-out;
}

.wm-window-header {
    display: flex;
    align-items: center;
    gap: 14px;
    height: 49px;
    padding: 0 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e8eef3;
}

.wm-window-controls {
    display: flex;
    align-items: center;
    gap: 6px;
}

.wm-window-controls span {
    display: block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.wm-window-controls span:nth-child(1) {
    background: #ff6978;
}

.wm-window-controls span:nth-child(2) {
    background: #ffc65c;
}

.wm-window-controls span:nth-child(3) {
    background: #3fd69a;
}

.wm-window-address {
    flex: 1;
    max-width: 240px;
    padding: 7px 14px;
    color: #758596;
    background: #ffffff;
    border: 1px solid #e6edf2;
    border-radius: 8px;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
}

.wm-window-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #16875d;
    font-size: 10px;
    font-weight: 800;
}

.wm-window-status::before {
    display: block;
    width: 6px;
    height: 6px;
    content: "";
    background: var(--wm-primary);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(0, 208, 132, 0.12);
}

.wm-window-body {
    display: flex;
    min-height: 420px;
}


/* Dashboard Sidebar */

.wm-dashboard-sidebar {
    position: relative;
    width: 132px;
    flex: 0 0 132px;
    padding: 20px 13px;
    color: #ffffff;
    background:
        linear-gradient(
            180deg,
            #15182c 0%,
            #1b2940 100%
        );
}

.wm-dashboard-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 26px;
    padding: 0 5px;
    font-size: 12px;
    font-weight: 800;
}

.wm-dashboard-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 27px;
    height: 27px;
    background:
        linear-gradient(
            135deg,
            #00d084,
            #3e91ff
        );
    border-radius: 8px;
    font-size: 12px;
    font-weight: 900;
}

.wm-dashboard-navigation {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.wm-dashboard-navigation span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 35px;
    padding: 8px 9px;
    color: rgba(255, 255, 255, 0.58);
    border-radius: 8px;
    font-size: 9px;
    font-weight: 700;
}

.wm-dashboard-navigation span.active {
    color: #ffffff;
    background: rgba(0, 208, 132, 0.16);
}

.wm-dashboard-navigation i {
    width: 13px;
    color: var(--wm-primary);
    text-align: center;
}

.wm-sidebar-progress {
    position: absolute;
    right: 13px;
    bottom: 19px;
    left: 13px;
    padding: 11px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 10px;
}

.wm-sidebar-progress > span {
    display: block;
    margin-bottom: 7px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 8px;
}

.wm-progress-track {
    height: 4px;
    margin-bottom: 7px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.13);
    border-radius: 20px;
}

.wm-progress-value {
    width: 92%;
    height: 100%;
    background:
        linear-gradient(
            90deg,
            #00d084,
            #64eeb6
        );
    border-radius: inherit;
    animation: wmProgressLoad 3.5s ease-in-out infinite alternate;
}

.wm-sidebar-progress strong {
    color: rgba(255, 255, 255, 0.8);
    font-size: 7px;
}


/* Dashboard Main Content */

.wm-dashboard-content {
    flex: 1;
    min-width: 0;
    padding: 20px;
    background: #f7fafc;
}

.wm-dashboard-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}

.wm-dashboard-topbar span {
    display: block;
    margin-bottom: 2px;
    color: #83909e;
    font-size: 8px;
    font-weight: 700;
}

.wm-dashboard-topbar h3 {
    margin: 0;
    color: #192438;
    font-size: 16px;
    line-height: 1.2;
}

.wm-dashboard-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #00d084,
            #408cf7
        );
    border-radius: 9px;
    font-size: 9px;
    font-weight: 900;
}

.wm-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
    margin-bottom: 12px;
}

.wm-stat-card {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 11px;
    background: #ffffff;
    border: 1px solid #e8eef3;
    border-radius: 11px;
    box-shadow: 0 5px 15px rgba(19, 38, 59, 0.04);
}

.wm-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    color: var(--wm-primary);
    background: rgba(0, 208, 132, 0.1);
    border-radius: 9px;
    font-size: 11px;
}

.wm-stat-card small {
    display: block;
    overflow: hidden;
    margin-bottom: 1px;
    color: #83909e;
    font-size: 7px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wm-stat-card strong {
    color: #1a2437;
    font-size: 14px;
    font-weight: 900;
}

.wm-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.8fr);
    gap: 11px;
}

.wm-activity-card,
.wm-product-list-card {
    min-width: 0;
    padding: 14px;
    background: #ffffff;
    border: 1px solid #e8eef3;
    border-radius: 12px;
}

.wm-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 13px;
}

.wm-card-heading span {
    display: block;
    margin-bottom: 2px;
    color: #8996a3;
    font-size: 7px;
}

.wm-card-heading strong {
    display: block;
    color: #1a2437;
    font-size: 10px;
}

.wm-card-heading > i {
    color: #a3adb7;
    font-size: 9px;
}

.wm-chart-area {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    height: 105px;
    padding: 0 5px;
    background-image:
        linear-gradient(
            to bottom,
            #eef2f5 1px,
            transparent 1px
        );
    background-size: 100% 26px;
}

.wm-chart-line {
    display: block;
    width: 9%;
    min-width: 9px;
    background:
        linear-gradient(
            to top,
            #00bd79,
            #6de6b8
        );
    border-radius: 5px 5px 2px 2px;
    transform-origin: bottom;
    animation: wmChartGrow 2.5s ease-in-out infinite alternate;
}

.wm-chart-line.line-one {
    height: 38%;
}

.wm-chart-line.line-two {
    height: 58%;
    animation-delay: -0.4s;
}

.wm-chart-line.line-three {
    height: 46%;
    animation-delay: -0.9s;
}

.wm-chart-line.line-four {
    height: 78%;
    animation-delay: -1.3s;
}

.wm-chart-line.line-five {
    height: 65%;
    animation-delay: -0.7s;
}

.wm-chart-line.line-six {
    height: 88%;
    animation-delay: -1.7s;
}

.wm-chart-line.line-seven {
    height: 72%;
    animation-delay: -1.1s;
}

.wm-chart-labels {
    display: flex;
    justify-content: space-between;
    padding-top: 6px;
}

.wm-chart-labels span {
    color: #9aa5af;
    font-size: 6px;
}

.wm-mini-product {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 0;
    border-bottom: 1px solid #edf1f4;
}

.wm-mini-product:last-child {
    border-bottom: 0;
}

.wm-mini-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    color: var(--wm-primary);
    background: rgba(0, 208, 132, 0.09);
    border-radius: 8px;
    font-size: 9px;
}

.wm-mini-product > div {
    min-width: 0;
    flex: 1;
}

.wm-mini-product strong {
    display: block;
    overflow: hidden;
    color: #1a2437;
    font-size: 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wm-mini-product small {
    display: block;
    overflow: hidden;
    color: #929da8;
    font-size: 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wm-product-status {
    display: block;
    width: 6px;
    height: 6px;
    flex: 0 0 6px;
    background: var(--wm-primary);
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(0, 208, 132, 0.1);
}


/* =========================================================
   FLOATING PRODUCT CARDS
========================================================= */

.wm-floating-product {
    position: absolute;
    z-index: 8;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 155px;
    padding: 12px 14px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(255, 255, 255, 0.96);
    border-radius: 14px;
    box-shadow:
        0 18px 40px rgba(24, 43, 66, 0.14);
    backdrop-filter: blur(16px);
    animation: wmCardFloat 5.5s ease-in-out infinite;
}

.wm-floating-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00a76b
        );
    border-radius: 11px;
    box-shadow:
        0 8px 16px rgba(0, 208, 132, 0.24);
    font-size: 14px;
}

.wm-floating-product span {
    display: block;
    margin-bottom: 1px;
    color: #8b98a5;
    font-size: 7px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.wm-floating-product strong {
    display: block;
    color: #1a2437;
    font-size: 11px;
    font-weight: 900;
}

.wm-product-school {
    top: 18px;
    left: 6px;
    animation-delay: -1s;
}

.wm-product-notiq {
    top: 88px;
    right: -15px;
    animation-delay: -2.1s;
}

.wm-product-rag {
    bottom: 64px;
    left: -8px;
    animation-delay: -3.2s;
}

.wm-product-accounting {
    right: 20px;
    bottom: 15px;
    animation-delay: -4.1s;
}

.wm-product-notiq .wm-floating-icon {
    background:
        linear-gradient(
            135deg,
            #6388ff,
            #7162e8
        );
    box-shadow:
        0 8px 16px rgba(99, 136, 255, 0.23);
}

.wm-product-rag .wm-floating-icon {
    background:
        linear-gradient(
            135deg,
            #9a65ff,
            #6554df
        );
    box-shadow:
        0 8px 16px rgba(127, 91, 236, 0.24);
}

.wm-product-accounting .wm-floating-icon {
    background:
        linear-gradient(
            135deg,
            #ffad45,
            #ef7d3e
        );
    box-shadow:
        0 8px 16px rgba(255, 157, 69, 0.24);
}


/* =========================================================
   CODE CARD
========================================================= */

.wm-code-card {
    position: absolute;
    right: 50px;
    bottom: 66px;
    z-index: 9;
    width: 178px;
    padding: 12px 14px;
    background: rgba(19, 23, 41, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 13px;
    box-shadow:
        0 18px 40px rgba(19, 23, 41, 0.23);
    backdrop-filter: blur(14px);
    animation: wmCodeFloat 5s ease-in-out infinite;
}

.wm-code-card-header {
    display: flex;
    gap: 5px;
    margin-bottom: 10px;
}

.wm-code-card-header span {
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

.wm-code-card-header span:nth-child(1) {
    background: #ff6978;
}

.wm-code-card-header span:nth-child(2) {
    background: #ffc65c;
}

.wm-code-card-header span:nth-child(3) {
    background: #3fd69a;
}

.wm-code-line {
    color: #d9e1ee;
    font-family: Consolas, Monaco, monospace;
    font-size: 8px;
    line-height: 1.9;
    white-space: nowrap;
}

.wm-code-purple {
    color: #c889ff;
}

.wm-code-blue {
    color: #72b7ff;
}

.wm-code-green {
    color: #68e5ab;
}


/* =========================================================
   HERO ANIMATIONS
========================================================= */

@keyframes wmBadgePulse {
    0% {
        opacity: 0.8;
        transform: scale(0.7);
    }

    70% {
        opacity: 0;
        transform: scale(1.7);
    }

    100% {
        opacity: 0;
        transform: scale(1.7);
    }
}

@keyframes wmGlowFloat {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(25px, 18px, 0) scale(1.06);
    }
}

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

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

@keyframes wmCardFloat {
    0%,
    100% {
        transform: translateY(0);
    }

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

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

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

@keyframes wmProgressLoad {
    from {
        width: 70%;
    }

    to {
        width: 96%;
    }
}

@keyframes wmChartGrow {
    from {
        transform: scaleY(0.78);
        opacity: 0.78;
    }

    to {
        transform: scaleY(1);
        opacity: 1;
    }
}


/* =========================================================
   HERO RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-hero {
        padding-top: 80px;
        padding-bottom: 90px;
    }

    .wm-hero-title {
        font-size: 57px;
        letter-spacing: -2px;
    }

    .wm-hero-visual {
        min-height: 560px;
        margin-left: 0;
    }

    .wm-ecosystem-window {
        width: calc(100% - 20px);
    }

    .wm-product-notiq {
        right: -5px;
    }
}

@media (max-width: 991px) {
    .wm-hero {
        min-height: auto;
        padding: 80px 0 75px;
    }

    .wm-hero-content {
        max-width: 760px;
        padding-right: 0;
        text-align: center;
    }

    .wm-hero-title {
        max-width: 760px;
        margin-right: auto;
        margin-left: auto;
        font-size: 54px;
    }

    .wm-hero-description {
        margin-right: auto;
        margin-left: auto;
    }

    .wm-hero-actions,
    .wm-hero-trust {
        justify-content: center;
    }

    .wm-hero-visual {
        width: 100%;
        max-width: 690px;
        min-height: 595px;
        margin: 60px auto 0;
    }

    .wm-ecosystem-window {
        right: 25px;
        width: calc(100% - 50px);
    }

    .wm-product-school {
        left: 0;
    }

    .wm-product-notiq {
        right: 0;
    }

    .wm-product-rag {
        left: 0;
    }

    .wm-product-accounting {
        right: 8px;
    }
}

@media (max-width: 767px) {
    .wm-hero {
        padding-top: 65px;
        padding-bottom: 55px;
    }

    .wm-hero-badge {
        font-size: 11px;
    }

    .wm-hero-title {
        font-size: 43px;
        line-height: 1.08;
        letter-spacing: -1.5px;
    }

    .wm-hero-description {
        font-size: 16px;
        line-height: 1.75;
    }

    .wm-hero-visual {
        min-height: 510px;
        margin-top: 45px;
    }

    .wm-ecosystem-window {
        top: 55px;
        right: 0;
        width: 100%;
        transform: none;
    }

    .wm-dashboard-sidebar {
        width: 105px;
        flex-basis: 105px;
        padding-right: 9px;
        padding-left: 9px;
    }

    .wm-dashboard-navigation span {
        padding-right: 6px;
        padding-left: 6px;
    }

    .wm-dashboard-content {
        padding: 14px;
    }

    .wm-dashboard-stats {
        gap: 6px;
    }

    .wm-stat-card {
        padding: 8px;
    }

    .wm-stat-icon {
        display: none;
    }

    .wm-code-card {
        right: 15px;
        bottom: 20px;
    }

    .wm-floating-product {
        min-width: 135px;
        padding: 9px 10px;
    }

    .wm-floating-icon {
        width: 31px;
        height: 31px;
        flex-basis: 31px;
        font-size: 11px;
    }

    .wm-product-school {
        top: 4px;
        left: 5px;
    }

    .wm-product-notiq {
        top: 8px;
        right: 5px;
    }

    .wm-product-rag {
        bottom: 30px;
        left: 5px;
    }

    .wm-product-accounting {
        display: none;
    }
}

@media (max-width: 575px) {
    .wm-hero-title {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .wm-hero-actions {
        width: 100%;
    }

    .wm-hero-button {
        width: 100%;
    }

    .wm-hero-trust {
        gap: 10px 14px;
    }

    .wm-trust-item {
        font-size: 11px;
    }

    .wm-hero-visual {
        min-height: 460px;
    }

    .wm-window-header {
        height: 42px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .wm-window-address {
        max-width: 145px;
        font-size: 7px;
    }

    .wm-window-body {
        min-height: 360px;
    }

    .wm-dashboard-sidebar {
        display: none;
    }

    .wm-dashboard-content {
        padding: 12px;
    }

    .wm-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .wm-product-list-card {
        display: none;
    }

    .wm-chart-area {
        height: 120px;
    }

    .wm-floating-product {
        min-width: 120px;
    }

    .wm-floating-product span {
        font-size: 6px;
    }

    .wm-floating-product strong {
        font-size: 9px;
    }

    .wm-product-rag {
        bottom: 12px;
    }

    .wm-code-card {
        right: 8px;
        bottom: 10px;
        width: 150px;
    }
}

@media (max-width: 400px) {
    .wm-hero-title {
        font-size: 32px;
    }

    .wm-hero-badge {
        padding-right: 11px;
        padding-left: 11px;
        font-size: 9px;
    }

    .wm-hero-visual {
        min-height: 420px;
    }

    .wm-floating-product {
        min-width: auto;
        padding: 8px;
    }

    .wm-floating-product > div:last-child {
        display: none;
    }

    .wm-product-school {
        left: 2px;
    }

    .wm-product-notiq {
        right: 2px;
    }
}


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

@media (prefers-reduced-motion: reduce) {
    .wm-hero-glow,
    .wm-hero-orbit,
    .wm-badge-dot::after,
    .wm-floating-product,
    .wm-code-card,
    .wm-progress-value,
    .wm-chart-line {
        animation: none !important;
    }

    .wm-ecosystem-window {
transform: translateY(-7px) !important;
    }
}


/* =========================================================
   PHASE 4 — PROFESSIONAL PRODUCTS SECTION
========================================================= */

.wm-products-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    background: #ffffff;
    isolation: isolate;
}

.wm-products-container {
    position: relative;
    z-index: 4;
}


/* =========================================================
   PRODUCTS BACKGROUND
========================================================= */

.wm-products-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-products-pattern {
    position: absolute;
    inset: 0;
    opacity: 0.42;
    background-image:
        radial-gradient(
            circle at center,
            rgba(26, 58, 82, 0.08) 1px,
            transparent 1px
        );
    background-size: 26px 26px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            rgba(0, 0, 0, 0.75) 18%,
            rgba(0, 0, 0, 0.75) 82%,
            transparent
        );
}

.wm-products-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(5px);
}

.wm-products-glow-one {
    top: 120px;
    left: -260px;
    width: 560px;
    height: 560px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.11),
            transparent 70%
        );
}

.wm-products-glow-two {
    right: -260px;
    bottom: 80px;
    width: 600px;
    height: 600px;
    background:
        radial-gradient(
            circle,
            rgba(92, 111, 255, 0.09),
            transparent 70%
        );
}


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

.wm-products-heading {
    max-width: 850px;
    margin: 0 auto 65px;
}

.wm-section-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 15px;
    margin-bottom: 20px;
    color: #157755;
    background: rgba(0, 208, 132, 0.09);
    border: 1px solid rgba(0, 208, 132, 0.18);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.25px;
}

.wm-section-badge i {
    color: var(--wm-primary);
    font-size: 12px;
}

.wm-products-heading h2 {
    max-width: 820px;
    margin: 0 auto 20px;
    color: var(--wm-dark);
    font-size: clamp(38px, 4vw, 56px);
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -1.8px;
}

.wm-products-heading h2 span {
    color: var(--wm-primary);
}

.wm-products-heading p {
    max-width: 760px;
    margin: 0 auto;
    color: #647384;
    font-size: 17px;
    line-height: 1.8;
}


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

.wm-products-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 24px;
}

.wm-product-card {
    position: relative;
    grid-column: span 2;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 100%;
    padding: 28px;
    overflow: hidden;
    background:
        linear-gradient(
            160deg,
            rgba(255, 255, 255, 0.98),
            rgba(248, 251, 253, 0.96)
        );
    border: 1px solid #e5ecf1;
    border-radius: 24px;
    box-shadow:
        0 12px 35px rgba(23, 40, 61, 0.06);
    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.wm-product-card:nth-child(4),
.wm-product-card:nth-child(5) {
    grid-column: span 3;
}

.wm-product-card::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    content: "";
    background:
        linear-gradient(
            90deg,
            var(--wm-primary),
            #56a1ff
        );
    opacity: 0;
    transition: opacity 0.3s ease;
}

.wm-product-card::after {
    position: absolute;
    top: -90px;
    right: -90px;
    width: 210px;
    height: 210px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.1),
            transparent 68%
        );
    border-radius: 50%;
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.4s ease;
}

.wm-product-card:hover {
    border-color: rgba(0, 208, 132, 0.28);
    box-shadow:
        0 26px 60px rgba(23, 40, 61, 0.12);
    transform: translateY(-8px);
}

.wm-product-card:hover::before,
.wm-product-card:hover::after {
    opacity: 1;
}

.wm-product-card:hover::after {
    transform: scale(1.12);
}

.wm-product-card-featured {
    background:
        linear-gradient(
            145deg,
            #172034 0%,
            #1a3045 100%
        );
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow:
        0 20px 50px rgba(20, 32, 52, 0.18);
}

.wm-product-card-featured::after {
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.2),
            transparent 68%
        );
    opacity: 1;
}

.wm-product-card-featured:hover {
    border-color: rgba(0, 208, 132, 0.35);
    box-shadow:
        0 28px 65px rgba(20, 32, 52, 0.26);
}


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

.wm-product-card-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 25px;
}

.wm-product-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    color: #ffffff;
    border-radius: 17px;
    box-shadow:
        0 12px 24px rgba(23, 40, 61, 0.15);
    font-size: 22px;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.wm-product-card:hover .wm-product-icon {
    box-shadow:
        0 16px 30px rgba(23, 40, 61, 0.21);
    transform: translateY(-3px) rotate(-3deg);
}

.wm-product-icon-school {
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00a96c
        );
}

.wm-product-icon-notiq {
    background:
        linear-gradient(
            135deg,
            #5d83ff,
            #765be4
        );
}

.wm-product-icon-rag {
    background:
        linear-gradient(
            135deg,
            #9d63f4,
            #624ad8
        );
}

.wm-product-icon-accounting {
    background:
        linear-gradient(
            135deg,
            #ffb347,
            #ed7d32
        );
}

.wm-product-icon-lms {
    background:
        linear-gradient(
            135deg,
            #27b7d8,
            #2676dc
        );
}

.wm-product-tags {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 7px;
}

.wm-product-tag {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 6px 10px;
    color: #596b7d;
    background: #f1f5f7;
    border: 1px solid #e5ebef;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.25px;
    text-transform: uppercase;
}

.wm-product-tag-primary {
    color: #147b56;
    background: rgba(0, 208, 132, 0.11);
    border-color: rgba(0, 208, 132, 0.19);
}

.wm-product-tag-ai {
    color: #6845c4;
    background: rgba(129, 88, 229, 0.1);
    border-color: rgba(129, 88, 229, 0.17);
}

.wm-product-card-featured .wm-product-tag {
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.1);
}

.wm-product-card-featured .wm-product-tag-primary {
    color: #7ff1bd;
    background: rgba(0, 208, 132, 0.13);
    border-color: rgba(0, 208, 132, 0.24);
}


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

.wm-product-content {
    position: relative;
    z-index: 2;
    flex: 1;
}

.wm-product-category {
    display: block;
    margin-bottom: 8px;
    color: var(--wm-primary-dark);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.65px;
    text-transform: uppercase;
}

.wm-product-card-featured .wm-product-category {
    color: #71eab2;
}

.wm-product-content h3 {
    margin: 0 0 13px;
    color: var(--wm-dark);
    font-size: 28px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.7px;
}

.wm-product-card-featured .wm-product-content h3 {
    color: #ffffff;
}

.wm-product-content > p {
    min-height: 82px;
    margin: 0 0 21px;
    color: #647384;
    font-size: 14px;
    line-height: 1.75;
}

.wm-product-card-featured .wm-product-content > p {
    color: rgba(255, 255, 255, 0.68);
}

.wm-product-features {
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 0;
    margin: 0 0 28px;
    list-style: none;
}

.wm-product-features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #435466;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.wm-product-features li > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin-top: 1px;
    color: #ffffff;
    background: var(--wm-primary);
    border-radius: 50%;
    font-size: 8px;
}

.wm-product-card-featured .wm-product-features li {
    color: rgba(255, 255, 255, 0.78);
}

.wm-product-card-featured .wm-product-features li > span {
    color: #101f2c;
    background: #74efb8;
}


/* =========================================================
   CARD FOOTER
========================================================= */

.wm-product-card-footer {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding-top: 21px;
    border-top: 1px solid #e7edf1;
}

.wm-product-card-featured .wm-product-card-footer {
    border-top-color: rgba(255, 255, 255, 0.1);
}

.wm-product-platforms {
    display: flex;
    align-items: center;
    gap: 7px;
}

.wm-product-platforms span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 31px;
    height: 31px;
    color: #647586;
    background: #f2f6f8;
    border: 1px solid #e5ebef;
    border-radius: 9px;
    font-size: 11px;
    transition:
        color 0.25s ease,
        background 0.25s ease,
        border-color 0.25s ease,
        transform 0.25s ease;
}

.wm-product-platforms span:hover {
    color: var(--wm-primary-dark);
    background: rgba(0, 208, 132, 0.09);
    border-color: rgba(0, 208, 132, 0.2);
    transform: translateY(-2px);
}

.wm-product-card-featured .wm-product-platforms span {
    color: rgba(255, 255, 255, 0.68);
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.1);
}

.wm-product-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: var(--wm-dark);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 0.25s ease,
        gap 0.25s ease;
}

.wm-product-link:hover {
    gap: 13px;
    color: var(--wm-primary-dark);
}

.wm-product-link i {
    color: var(--wm-primary);
    font-size: 10px;
}

.wm-product-card-featured .wm-product-link {
    color: #ffffff;
}

.wm-product-card-featured .wm-product-link:hover {
    color: #7ff1bd;
}


/* =========================================================
   BOTTOM CUSTOMIZATION CTA
========================================================= */

.wm-products-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 25px 29px;
    margin-top: 30px;
    background:
        linear-gradient(
            135deg,
            #f5fbf8,
            #f5f8ff
        );
    border: 1px solid #dfebe6;
    border-radius: 20px;
}

.wm-products-bottom-content {
    display: flex;
    align-items: center;
    gap: 17px;
}

.wm-products-bottom-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 49px;
    height: 49px;
    flex: 0 0 49px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            var(--wm-primary),
            #3c92f2
        );
    border-radius: 14px;
    box-shadow:
        0 11px 22px rgba(0, 208, 132, 0.18);
    font-size: 17px;
}

.wm-products-bottom h3 {
    margin: 0 0 5px;
    color: var(--wm-dark);
    font-size: 18px;
    font-weight: 800;
}

.wm-products-bottom p {
    margin: 0;
    color: #687889;
    font-size: 13px;
    line-height: 1.55;
}

.wm-products-bottom-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 46px;
    padding: 13px 18px;
    color: #ffffff !important;
    background: var(--wm-dark);
    border-radius: 12px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition:
        background 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-products-bottom-link:hover {
    color: #ffffff !important;
    background: var(--wm-primary-dark);
    box-shadow:
        0 13px 25px rgba(0, 169, 108, 0.2);
    transform: translateY(-2px);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-products-section {
        padding: 100px 0;
    }

    .wm-product-card {
        padding: 24px;
    }

    .wm-product-content h3 {
        font-size: 25px;
    }
}

@media (max-width: 991px) {
    .wm-products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wm-product-card,
    .wm-product-card:nth-child(4),
    .wm-product-card:nth-child(5) {
        grid-column: span 1;
    }

    .wm-product-card:last-child {
        grid-column: 1 / -1;
    }

    .wm-product-content > p {
        min-height: auto;
    }

    .wm-products-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767px) {
    .wm-products-section {
        padding: 80px 0;
    }

    .wm-products-heading {
        margin-bottom: 45px;
    }

    .wm-products-heading h2 {
        font-size: 39px;
        letter-spacing: -1.2px;
    }

    .wm-products-heading p {
        font-size: 15px;
    }

    .wm-products-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .wm-product-card,
    .wm-product-card:last-child {
        grid-column: auto;
    }

    .wm-products-bottom {
        padding: 22px;
    }
}

@media (max-width: 575px) {
    .wm-products-section {
        padding: 65px 0;
    }

    .wm-products-heading h2 {
        font-size: 33px;
        letter-spacing: -0.8px;
    }

    .wm-product-card {
        padding: 21px;
        border-radius: 19px;
    }

    .wm-product-card-top {
        margin-bottom: 21px;
    }

    .wm-product-icon {
        width: 51px;
        height: 51px;
        flex-basis: 51px;
        border-radius: 14px;
        font-size: 19px;
    }

    .wm-product-tags {
        gap: 5px;
    }

    .wm-product-tag {
        padding: 5px 8px;
        font-size: 7px;
    }

    .wm-product-content h3 {
        font-size: 24px;
    }

    .wm-product-content > p {
        font-size: 13px;
    }

    .wm-product-card-footer {
        align-items: flex-start;
        flex-direction: column;
    }

    .wm-product-link {
        width: 100%;
        justify-content: space-between;
        padding-top: 5px;
    }

    .wm-products-bottom-content {
        align-items: flex-start;
    }

    .wm-products-bottom-link {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 380px) {
    .wm-section-badge {
        font-size: 10px;
    }

    .wm-products-heading h2 {
        font-size: 29px;
    }

    .wm-product-tags {
        justify-content: flex-start;
    }

    .wm-product-card-top {
        flex-direction: column;
    }
}

/* =========================================================
   PATCH 4 — CUSTOM APPLICATION SECTION
========================================================= */

.wm-custom-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #101426 0%,
            #14283a 55%,
            #102b32 100%
        );
    isolation: isolate;
}

.wm-custom-container {
    position: relative;
    z-index: 4;
}


/* =========================================================
   BACKGROUND EFFECTS
========================================================= */

.wm-custom-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-custom-grid-pattern {
    position: absolute;
    inset: 0;
    opacity: 0.22;
    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.04) 1px,
            transparent 1px
        );
    background-size: 45px 45px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 20%,
            #000 80%,
            transparent
        );
}

.wm-custom-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(10px);
    animation: wmCustomGlow 10s ease-in-out infinite;
}

.wm-custom-glow-one {
    top: -280px;
    left: -240px;
    width: 650px;
    height: 650px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.22),
            rgba(0, 208, 132, 0.04) 55%,
            transparent 72%
        );
}

.wm-custom-glow-two {
    right: -280px;
    bottom: -300px;
    width: 720px;
    height: 720px;
    background:
        radial-gradient(
            circle,
            rgba(78, 106, 255, 0.2),
            rgba(78, 106, 255, 0.03) 55%,
            transparent 72%
        );
    animation-delay: -5s;
}


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

.wm-custom-heading {
    max-width: 760px;
    margin-bottom: 58px;
}

.wm-custom-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 8px 14px;
    margin-bottom: 20px;
    color: #83efbd;
    background: rgba(0, 208, 132, 0.1);
    border: 1px solid rgba(0, 208, 132, 0.2);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.35px;
}

.wm-custom-heading h2 {
    max-width: 730px;
    margin: 0 0 20px;
    color: #ffffff;
    font-size: clamp(40px, 4.5vw, 60px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -2px;
}

.wm-custom-heading h2 span {
    color: #69e9b0;
}

.wm-custom-heading p {
    max-width: 700px;
    margin: 0;
    color: rgba(255, 255, 255, 0.66);
    font-size: 17px;
    line-height: 1.8;
}

.wm-custom-header-action {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 58px;
}

.wm-custom-main-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 54px;
    padding: 16px 22px;
    color: #10201a !important;
    background:
        linear-gradient(
            135deg,
            #79f1ba,
            #00d084
        );
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 14px;
    box-shadow:
        0 15px 35px rgba(0, 208, 132, 0.2);
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.wm-custom-main-button:hover {
    color: #10201a !important;
    box-shadow:
        0 19px 42px rgba(0, 208, 132, 0.3);
    transform: translateY(-3px);
}

.wm-custom-main-button i {
    font-size: 11px;
    transition: transform 0.25s ease;
}

.wm-custom-main-button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   CUSTOM LAYOUT
========================================================= */

.wm-custom-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1.45fr);
    gap: 25px;
}


/* =========================================================
   FEATURED CARD
========================================================= */

.wm-custom-featured-card {
    position: relative;
    min-height: 100%;
    padding: 36px;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.1),
            rgba(255, 255, 255, 0.045)
        );
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 27px;
    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(20px);
}

.wm-custom-featured-card::before {
    position: absolute;
    top: -130px;
    right: -130px;
    width: 320px;
    height: 320px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.2),
            transparent 68%
        );
    border-radius: 50%;
}

.wm-custom-featured-content {
    position: relative;
    z-index: 3;
}

.wm-custom-featured-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 63px;
    height: 63px;
    margin-bottom: 24px;
    color: #10231b;
    background:
        linear-gradient(
            135deg,
            #7bf3bd,
            #00d084
        );
    border-radius: 18px;
    box-shadow:
        0 15px 30px rgba(0, 208, 132, 0.2);
    font-size: 24px;
}

.wm-custom-service-label {
    display: block;
    margin-bottom: 10px;
    color: #70e8b0;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.wm-custom-featured-card h3 {
    max-width: 450px;
    margin: 0 0 17px;
    color: #ffffff;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -1px;
}

.wm-custom-featured-card p {
    max-width: 530px;
    margin: 0 0 25px;
    color: rgba(255, 255, 255, 0.66);
    font-size: 14px;
    line-height: 1.75;
}

.wm-custom-feature-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 0;
    margin: 0 0 29px;
    list-style: none;
}

.wm-custom-feature-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
}

.wm-custom-feature-list li > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin-top: 1px;
    color: #10231b;
    background: #6eeaaf;
    border-radius: 50%;
    font-size: 8px;
}

.wm-custom-featured-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #79efb8 !important;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    transition:
        gap 0.25s ease,
        color 0.25s ease;
}

.wm-custom-featured-link:hover {
    gap: 15px;
    color: #ffffff !important;
}


/* =========================================================
   CODE WINDOW
========================================================= */

.wm-custom-code-window {
    position: relative;
    z-index: 3;
    margin-top: 34px;
    overflow: hidden;
    background: rgba(8, 12, 24, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 17px;
    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.28);
}

.wm-custom-window-header {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 43px;
    padding: 0 15px;
    background: rgba(255, 255, 255, 0.04);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.wm-custom-window-dots {
    display: flex;
    align-items: center;
    gap: 5px;
}

.wm-custom-window-dots span {
    display: block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.wm-custom-window-dots span:nth-child(1) {
    background: #ff6879;
}

.wm-custom-window-dots span:nth-child(2) {
    background: #ffc45c;
}

.wm-custom-window-dots span:nth-child(3) {
    background: #4bdda1;
}

.wm-custom-window-title {
    color: rgba(255, 255, 255, 0.5);
    font-family: Consolas, Monaco, monospace;
    font-size: 9px;
}

.wm-custom-window-body {
    padding: 18px 15px;
}

.wm-code-row {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    min-height: 27px;
    font-family: Consolas, Monaco, monospace;
    font-size: 10px;
    line-height: 1.7;
}

.wm-code-number {
    width: 16px;
    flex: 0 0 16px;
    color: rgba(255, 255, 255, 0.22);
    user-select: none;
}

.wm-code-row code {
    color: #cdd6e3;
    background: transparent;
}

.wm-code-keyword {
    color: #d092ff;
}

.wm-code-function {
    color: #65baff;
}

.wm-code-value {
    color: #65e7aa;
}

.wm-custom-window-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 34px;
    padding: 0 15px;
    color: rgba(255, 255, 255, 0.38);
    background: rgba(255, 255, 255, 0.03);
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 8px;
}

.wm-custom-window-footer span:first-child {
    display: flex;
    align-items: center;
    gap: 6px;
}

.wm-custom-window-footer i {
    color: #47d797;
    font-size: 6px;
}


/* =========================================================
   SERVICE CARDS
========================================================= */

.wm-custom-services-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.wm-custom-service-card {
    position: relative;
    min-height: 100%;
    padding: 24px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 20px;
    backdrop-filter: blur(14px);
    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.wm-custom-service-card::after {
    position: absolute;
    right: -65px;
    bottom: -65px;
    width: 150px;
    height: 150px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.14),
            transparent 68%
        );
    border-radius: 50%;
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.wm-custom-service-card:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(0, 208, 132, 0.27);
    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.17);
    transform: translateY(-6px);
}

.wm-custom-service-card:hover::after {
    opacity: 1;
    transform: scale(1.15);
}

.wm-custom-service-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
}

.wm-custom-service-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 49px;
    height: 49px;
    color: #ffffff;
    border-radius: 14px;
    box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.18);
    font-size: 17px;
    transition: transform 0.3s ease;
}

.wm-custom-service-card:hover .wm-custom-service-icon {
    transform: rotate(-4deg) translateY(-2px);
}

.wm-service-web {
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00a36a
        );
}

.wm-service-mobile {
    background:
        linear-gradient(
            135deg,
            #4d9cff,
            #4966df
        );
}

.wm-service-saas {
    background:
        linear-gradient(
            135deg,
            #8a65f3,
            #6044cf
        );
}

.wm-service-erp {
    background:
        linear-gradient(
            135deg,
            #f1a944,
            #dc7130
        );
}

.wm-service-api {
    background:
        linear-gradient(
            135deg,
            #23b7cd,
            #19809b
        );
}

.wm-service-modern {
    background:
        linear-gradient(
            135deg,
            #e8699d,
            #b9487d
        );
}

.wm-custom-service-number {
    color: rgba(255, 255, 255, 0.15);
    font-size: 24px;
    font-weight: 900;
    line-height: 1;
}

.wm-custom-service-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 12px;
    color: #ffffff;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
}

.wm-custom-service-card p {
    position: relative;
    z-index: 2;
    min-height: 88px;
    margin: 0 0 18px;
    color: rgba(255, 255, 255, 0.59);
    font-size: 12px;
    line-height: 1.7;
}

.wm-custom-service-tags {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.wm-custom-service-tags span {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 9px;
    color: rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 999px;
    font-size: 8px;
    font-weight: 700;
}


/* =========================================================
   TECHNOLOGY STRIP
========================================================= */

.wm-custom-tech-strip {
    display: flex;
    align-items: center;
    gap: 25px;
    padding: 20px 24px;
    margin-top: 26px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 17px;
    backdrop-filter: blur(12px);
}

.wm-custom-tech-title {
    flex: 0 0 auto;
    color: rgba(255, 255, 255, 0.42);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.wm-custom-tech-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 11px;
}

.wm-custom-tech-list span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 31px;
    padding: 7px 11px;
    color: rgba(255, 255, 255, 0.68);
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 9px;
    font-size: 9px;
    font-weight: 700;
}

.wm-custom-tech-list i {
    color: #69e8af;
    font-size: 11px;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes wmCustomGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(25px, -15px, 0) scale(1.06);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-custom-section {
        padding: 100px 0;
    }

    .wm-custom-layout {
        grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.4fr);
    }

    .wm-custom-featured-card {
        padding: 30px;
    }

    .wm-custom-service-card {
        padding: 21px;
    }
}

@media (max-width: 991px) {
    .wm-custom-header-action {
        justify-content: flex-start;
        padding-bottom: 45px;
    }

    .wm-custom-heading {
        margin-bottom: 28px;
    }

    .wm-custom-layout {
        grid-template-columns: 1fr;
    }

    .wm-custom-featured-card {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: 25px;
        align-items: center;
    }

    .wm-custom-code-window {
        margin-top: 0;
    }

    .wm-custom-tech-strip {
        align-items: flex-start;
        flex-direction: column;
        gap: 14px;
    }
}

@media (max-width: 767px) {
    .wm-custom-section {
        padding: 80px 0;
    }

    .wm-custom-heading h2 {
        font-size: 41px;
        letter-spacing: -1.3px;
    }

    .wm-custom-heading p {
        font-size: 15px;
    }

    .wm-custom-featured-card {
        display: block;
    }

    .wm-custom-code-window {
        margin-top: 32px;
    }

    .wm-custom-services-grid {
        grid-template-columns: 1fr;
    }

    .wm-custom-service-card p {
        min-height: auto;
    }
}

@media (max-width: 575px) {
    .wm-custom-section {
        padding: 65px 0;
    }

    .wm-custom-heading h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .wm-custom-header-action {
        padding-bottom: 35px;
    }

    .wm-custom-main-button {
        width: 100%;
    }

    .wm-custom-featured-card {
        padding: 23px;
        border-radius: 21px;
    }

    .wm-custom-featured-card h3 {
        font-size: 28px;
    }

    .wm-custom-code-window {
        display: none;
    }

    .wm-custom-service-card {
        padding: 21px;
        border-radius: 17px;
    }

    .wm-custom-tech-strip {
        padding: 18px;
    }

    .wm-custom-tech-list {
        gap: 8px;
    }
}

@media (max-width: 380px) {
    .wm-custom-heading h2 {
        font-size: 30px;
    }

    .wm-custom-badge {
        font-size: 9px;
    }

    .wm-custom-featured-card h3 {
        font-size: 25px;
    }

    .wm-custom-service-top {
        flex-direction: column;
        gap: 12px;
    }
}


/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .wm-custom-glow {
        animation: none !important;
    }
}

/* =========================================================
   PATCH 5 — WHY BITMINT LAB SECTION
========================================================= */

.wm-why-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #f9fcfb 0%,
            #f6f9fd 52%,
            #f8fbff 100%
        );
    isolation: isolate;
}

.wm-why-container {
    position: relative;
    z-index: 4;
}


/* =========================================================
   BACKGROUND DECORATION
========================================================= */

.wm-why-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-why-grid {
    position: absolute;
    inset: 0;
    opacity: 0.36;
    background-image:
        linear-gradient(
            rgba(27, 54, 75, 0.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(27, 54, 75, 0.04) 1px,
            transparent 1px
        );
    background-size: 48px 48px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 18%,
            #000 82%,
            transparent
        );
}

.wm-why-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    animation: wmWhyGlow 10s ease-in-out infinite;
}

.wm-why-glow-one {
    top: -220px;
    right: -220px;
    width: 580px;
    height: 580px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.13),
            transparent 70%
        );
}

.wm-why-glow-two {
    bottom: -260px;
    left: -240px;
    width: 620px;
    height: 620px;
    background:
        radial-gradient(
            circle,
            rgba(76, 112, 255, 0.1),
            transparent 70%
        );
    animation-delay: -5s;
}


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

.wm-why-heading {
    max-width: 760px;
    margin-bottom: 58px;
}

.wm-why-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 36px;
    padding: 8px 14px;
    margin-bottom: 20px;
    color: #157754;
    background: rgba(0, 208, 132, 0.09);
    border: 1px solid rgba(0, 208, 132, 0.18);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.35px;
}

.wm-why-badge i {
    color: var(--wm-primary);
}

.wm-why-heading h2 {
    max-width: 730px;
    margin: 0 0 20px;
    color: var(--wm-dark);
    font-size: clamp(40px, 4.5vw, 59px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -2px;
}

.wm-why-heading h2 span {
    color: var(--wm-primary-dark);
}

.wm-why-heading p {
    max-width: 700px;
    margin: 0;
    color: #637486;
    font-size: 17px;
    line-height: 1.8;
}

.wm-why-header-note {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 19px;
    margin-bottom: 58px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid #e2ebe7;
    border-radius: 16px;
    box-shadow:
        0 14px 35px rgba(24, 43, 66, 0.06);
    backdrop-filter: blur(12px);
}

.wm-why-note-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            var(--wm-primary),
            var(--wm-primary-dark)
        );
    border-radius: 10px;
    font-size: 11px;
}

.wm-why-header-note p {
    margin: 0;
    color: #526576;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.65;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.wm-why-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.45fr);
    gap: 24px;
}


/* =========================================================
   MAIN HIGHLIGHT CARD
========================================================= */

.wm-why-main-card {
    position: relative;
    min-height: 100%;
    padding: 35px;
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #151c30 0%,
            #183249 58%,
            #123b3a 100%
        );
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 26px;
    box-shadow:
        0 25px 65px rgba(20, 34, 52, 0.18);
}

.wm-why-main-card::before {
    position: absolute;
    top: -120px;
    right: -120px;
    width: 300px;
    height: 300px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.24),
            transparent 68%
        );
    border-radius: 50%;
}

.wm-why-main-card::after {
    position: absolute;
    right: -80px;
    bottom: -90px;
    width: 230px;
    height: 230px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(74, 118, 255, 0.17),
            transparent 68%
        );
    border-radius: 50%;
}

.wm-why-main-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 27px;
}

.wm-why-main-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    color: #10251c;
    background:
        linear-gradient(
            135deg,
            #80f3c0,
            #00d084
        );
    border-radius: 17px;
    box-shadow:
        0 14px 28px rgba(0, 208, 132, 0.23);
    font-size: 21px;
}

.wm-why-main-label {
    color: #79efba;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.wm-why-main-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 17px;
    color: #ffffff;
    font-size: 32px;
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -1px;
}

.wm-why-main-card > p {
    position: relative;
    z-index: 2;
    margin: 0 0 27px;
    color: rgba(255, 255, 255, 0.67);
    font-size: 14px;
    line-height: 1.75;
}

.wm-why-main-points {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 29px;
}

.wm-why-main-point {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px;
    background: rgba(255, 255, 255, 0.055);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 13px;
}

.wm-why-main-point > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    flex: 0 0 37px;
    color: #75edb6;
    background: rgba(0, 208, 132, 0.11);
    border-radius: 11px;
    font-size: 13px;
}

.wm-why-main-point strong {
    display: block;
    margin-bottom: 2px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 800;
}

.wm-why-main-point small {
    display: block;
    color: rgba(255, 255, 255, 0.51);
    font-size: 9px;
    line-height: 1.5;
}

.wm-why-main-link {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #79efba !important;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
    transition:
        gap 0.25s ease,
        color 0.25s ease;
}

.wm-why-main-link:hover {
    gap: 15px;
    color: #ffffff !important;
}


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

.wm-why-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.wm-why-feature-card {
    position: relative;
    min-height: 100%;
    padding: 26px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid #e3eae7;
    border-radius: 21px;
    box-shadow:
        0 12px 35px rgba(23, 41, 61, 0.055);
    backdrop-filter: blur(14px);
    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.wm-why-feature-card::after {
    position: absolute;
    right: -70px;
    bottom: -70px;
    width: 160px;
    height: 160px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.12),
            transparent 68%
        );
    border-radius: 50%;
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.wm-why-feature-card:hover {
    border-color: rgba(0, 208, 132, 0.28);
    box-shadow:
        0 23px 52px rgba(23, 41, 61, 0.1);
    transform: translateY(-7px);
}

.wm-why-feature-card:hover::after {
    opacity: 1;
    transform: scale(1.15);
}

.wm-why-card-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 21px;
}

.wm-why-card-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 51px;
    height: 51px;
    color: #ffffff;
    border-radius: 15px;
    box-shadow:
        0 12px 25px rgba(20, 36, 54, 0.16);
    font-size: 18px;
    transition: transform 0.3s ease;
}

.wm-why-feature-card:hover .wm-why-card-icon {
    transform: translateY(-3px) rotate(-4deg);
}

.wm-why-icon-modular {
    background:
        linear-gradient(
            135deg,
            #00d084,
            #00a368
        );
}

.wm-why-icon-custom {
    background:
        linear-gradient(
            135deg,
            #5e87ff,
            #5d5ee0
        );
}

.wm-why-icon-scale {
    background:
        linear-gradient(
            135deg,
            #9364ed,
            #5d48cc
        );
}

.wm-why-icon-support {
    background:
        linear-gradient(
            135deg,
            #f2a544,
            #dd7132
        );
}

.wm-why-card-number {
    color: #d9e1e5;
    font-size: 25px;
    font-weight: 900;
    line-height: 1;
}

.wm-why-feature-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 12px;
    color: var(--wm-dark);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
}

.wm-why-feature-card > p {
    position: relative;
    z-index: 2;
    min-height: 75px;
    margin: 0 0 17px;
    color: #647586;
    font-size: 12px;
    line-height: 1.7;
}

.wm-why-feature-card ul {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wm-why-feature-card li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #45596a;
    font-size: 10px;
    font-weight: 700;
}

.wm-why-feature-card li i {
    color: var(--wm-primary-dark);
    font-size: 8px;
}


/* =========================================================
   VALUE STRIP
========================================================= */

.wm-why-value-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 22px 26px;
    margin-top: 27px;
    background: rgba(255, 255, 255, 0.83);
    border: 1px solid #e2eae6;
    border-radius: 18px;
    box-shadow:
        0 13px 35px rgba(24, 43, 66, 0.055);
    backdrop-filter: blur(12px);
}

.wm-why-value-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.wm-why-value-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 41px;
    height: 41px;
    flex: 0 0 41px;
    color: var(--wm-primary-dark);
    background: rgba(0, 208, 132, 0.09);
    border-radius: 12px;
    font-size: 14px;
}

.wm-why-value-item strong {
    display: block;
    margin-bottom: 2px;
    color: var(--wm-dark);
    font-size: 11px;
    font-weight: 800;
}

.wm-why-value-item small {
    display: block;
    color: #788795;
    font-size: 8px;
}

.wm-why-value-divider {
    width: 1px;
    height: 39px;
    flex: 0 0 1px;
    background: #e0e8e5;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes wmWhyGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(24px, -18px, 0) scale(1.06);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-why-section {
        padding: 100px 0;
    }

    .wm-why-main-card {
        padding: 30px;
    }

    .wm-why-feature-card {
        padding: 23px;
    }
}

@media (max-width: 991px) {
    .wm-why-heading {
        margin-bottom: 25px;
    }

    .wm-why-header-note {
        max-width: 500px;
        margin-bottom: 45px;
    }

    .wm-why-layout {
        grid-template-columns: 1fr;
    }

    .wm-why-main-card {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        column-gap: 30px;
        align-items: start;
    }

    .wm-why-main-top,
    .wm-why-main-card h3,
    .wm-why-main-card > p,
    .wm-why-main-link {
        grid-column: 1;
    }

    .wm-why-main-points {
        grid-column: 2;
        grid-row: 1 / span 4;
        margin-bottom: 0;
    }

    .wm-why-value-strip {
        flex-wrap: wrap;
    }

    .wm-why-value-item {
        width: calc(50% - 20px);
    }

    .wm-why-value-divider {
        display: none;
    }
}

@media (max-width: 767px) {
    .wm-why-section {
        padding: 80px 0;
    }

    .wm-why-heading h2 {
        font-size: 41px;
        letter-spacing: -1.3px;
    }

    .wm-why-heading p {
        font-size: 15px;
    }

    .wm-why-main-card {
        display: block;
    }

    .wm-why-main-points {
        margin-bottom: 29px;
    }

    .wm-why-feature-grid {
        grid-template-columns: 1fr;
    }

    .wm-why-feature-card > p {
        min-height: auto;
    }
}

@media (max-width: 575px) {
    .wm-why-section {
        padding: 65px 0;
    }

    .wm-why-heading h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .wm-why-header-note {
        margin-bottom: 35px;
    }

    .wm-why-main-card {
        padding: 23px;
        border-radius: 21px;
    }

    .wm-why-main-card h3 {
        font-size: 27px;
    }

    .wm-why-feature-card {
        padding: 21px;
        border-radius: 17px;
    }

    .wm-why-value-strip {
        align-items: flex-start;
        flex-direction: column;
        padding: 20px;
    }

    .wm-why-value-item {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .wm-why-heading h2 {
        font-size: 30px;
    }

    .wm-why-badge {
        font-size: 9px;
    }

    .wm-why-main-card h3 {
        font-size: 24px;
    }
}


/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .wm-why-glow {
        animation: none !important;
    }
}

/* =========================================================
   PATCH 6 — DEVELOPMENT PROCESS SECTION
========================================================= */

.wm-process-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f7fbf9 48%,
            #f6f9ff 100%
        );
    isolation: isolate;
}

.wm-process-container {
    position: relative;
    z-index: 4;
}


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

.wm-process-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-process-grid {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    background-image:
        radial-gradient(
            circle,
            rgba(28, 55, 76, 0.07) 1px,
            transparent 1px
        );
    background-size: 28px 28px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 15%,
            #000 85%,
            transparent
        );
}

.wm-process-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    animation: wmProcessGlow 11s ease-in-out infinite;
}

.wm-process-glow-one {
    top: -230px;
    left: -220px;
    width: 580px;
    height: 580px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.13),
            transparent 70%
        );
}

.wm-process-glow-two {
    right: -250px;
    bottom: -260px;
    width: 650px;
    height: 650px;
    background:
        radial-gradient(
            circle,
            rgba(77, 109, 255, 0.1),
            transparent 70%
        );
    animation-delay: -5s;
}


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

.wm-process-heading {
    max-width: 850px;
    margin: 0 auto 72px;
}

.wm-process-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 37px;
    padding: 8px 15px;
    margin-bottom: 20px;
    color: #147954;
    background: rgba(0, 208, 132, 0.09);
    border: 1px solid rgba(0, 208, 132, 0.18);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.35px;
}

.wm-process-badge i {
    color: var(--wm-primary);
}

.wm-process-heading h2 {
    max-width: 800px;
    margin: 0 auto 20px;
    color: var(--wm-dark);
    font-size: clamp(40px, 4.5vw, 59px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -2px;
}

.wm-process-heading h2 span {
    color: var(--wm-primary-dark);
}

.wm-process-heading p {
    max-width: 720px;
    margin: 0 auto;
    color: #657587;
    font-size: 17px;
    line-height: 1.8;
}


/* =========================================================
   TIMELINE
========================================================= */

.wm-process-timeline {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 72px 24px;
}

.wm-process-line {
    position: absolute;
    top: 28px;
    right: 8%;
    left: 8%;
    z-index: 0;
    height: 3px;
    overflow: hidden;
    background: #dfe9e5;
    border-radius: 999px;
}

.wm-process-line-progress {
    display: block;
    width: 100%;
    height: 100%;
    background:
        linear-gradient(
            90deg,
            #00d084 0%,
            #37d6a2 35%,
            #5d8cff 70%,
            #775ee8 100%
        );
    border-radius: inherit;
    transform-origin: left;
    animation: wmProcessLine 3.5s ease-in-out infinite alternate;
}

.wm-process-step {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    min-width: 0;
}

.wm-process-step-marker {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin: 0 auto 25px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            var(--wm-primary),
            var(--wm-primary-dark)
        );
    border: 7px solid #f8fcfa;
    border-radius: 50%;
    box-shadow:
        0 9px 22px rgba(0, 208, 132, 0.22);
}

.wm-process-step-marker span {
    font-size: 11px;
    font-weight: 900;
}

.wm-process-card {
    position: relative;

    flex: 1;
    min-height: 0;

    padding: 27px;
    overflow: hidden;

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

    border: 1px solid #e3ebe7;
    border-radius: 22px;

    box-shadow:
        0 13px 36px rgba(22, 41, 60, 0.065);

    backdrop-filter: blur(14px);

    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.wm-process-card::after {
    position: absolute;
    right: -70px;
    bottom: -70px;
    width: 160px;
    height: 160px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.12),
            transparent 68%
        );
    border-radius: 50%;
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.wm-process-step:hover .wm-process-card {
    border-color: rgba(0, 208, 132, 0.28);
    box-shadow:
        0 25px 55px rgba(22, 41, 60, 0.11);
    transform: translateY(-8px);
}

.wm-process-step:hover .wm-process-card::after {
    opacity: 1;
    transform: scale(1.15);
}

.wm-process-step:hover .wm-process-step-marker {
    box-shadow:
        0 13px 28px rgba(0, 208, 132, 0.3);
}


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

.wm-process-icon {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 53px;
    height: 53px;
    margin-bottom: 20px;
    color: #ffffff;
    border-radius: 15px;
    box-shadow:
        0 12px 25px rgba(20, 38, 57, 0.17);
    font-size: 18px;
    transition: transform 0.3s ease;
}

.wm-process-step:hover .wm-process-icon {
    transform: translateY(-3px) rotate(-4deg);
}

.wm-process-icon-discover {
    background:
        linear-gradient(
            135deg,
            #00d084,
            #009f67
        );
}

.wm-process-icon-plan {
    background:
        linear-gradient(
            135deg,
            #48b2e8,
            #2879cf
        );
}

.wm-process-icon-design {
    background:
        linear-gradient(
            135deg,
            #8b6ae9,
            #6145ca
        );
}

.wm-process-icon-develop {
    background:
        linear-gradient(
            135deg,
            #506fff,
            #424bc4
        );
}

.wm-process-icon-test {
    background:
        linear-gradient(
            135deg,
            #f2a745,
            #dd7131
        );
}

.wm-process-icon-deploy {
    background:
        linear-gradient(
            135deg,
            #e9689b,
            #b84678
        );
}

.wm-process-label {
    position: relative;
    z-index: 2;
    display: block;
    margin-bottom: 7px;
    color: var(--wm-primary-dark);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.75px;
    text-transform: uppercase;
}

.wm-process-card h3 {
    position: relative;
    z-index: 2;
    margin: 0 0 12px;
    color: var(--wm-dark);
    font-size: 23px;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: -0.5px;
}

.wm-process-card > p {
    position: relative;
    z-index: 2;
    min-height: 92px;
    margin: 0 0 18px;
    color: #647586;
    font-size: 12px;
    line-height: 1.72;
}

.wm-process-card ul {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wm-process-card li {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #485a6c;
    font-size: 10px;
    font-weight: 700;
}

.wm-process-card li i {
    color: var(--wm-primary-dark);
    font-size: 8px;
}


/* =========================================================
   SUMMARY CTA
========================================================= */

.wm-process-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 25px 28px;
    margin-top: 44px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #152036 0%,
            #19374a 60%,
            #153c39 100%
        );
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 21px;
    box-shadow:
        0 22px 55px rgba(20, 35, 54, 0.17);
}

.wm-process-summary-content {
    display: flex;
    align-items: center;
    gap: 17px;
}

.wm-process-summary-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 53px;
    height: 53px;
    flex: 0 0 53px;
    color: #10241c;
    background:
        linear-gradient(
            135deg,
            #7cf2bd,
            #00d084
        );
    border-radius: 15px;
    box-shadow:
        0 13px 27px rgba(0, 208, 132, 0.2);
    font-size: 18px;
}

.wm-process-summary-label {
    display: block;
    margin-bottom: 4px;
    color: #76edb7;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.wm-process-summary h3 {
    margin: 0 0 5px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}

.wm-process-summary p {
    margin: 0;
    color: rgba(255, 255, 255, 0.6);
    font-size: 11px;
    line-height: 1.55;
}

.wm-process-summary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 49px;
    padding: 14px 20px;
    color: #10221b !important;
    background:
        linear-gradient(
            135deg,
            #7bf1ba,
            #00d084
        );
    border-radius: 13px;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
    transition:
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-process-summary-button:hover {
    color: #10221b !important;
    box-shadow:
        0 14px 30px rgba(0, 208, 132, 0.25);
    transform: translateY(-3px);
}

.wm-process-summary-button i {
    font-size: 10px;
    transition: transform 0.25s ease;
}

.wm-process-summary-button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes wmProcessGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(25px, -17px, 0) scale(1.06);
    }
}

@keyframes wmProcessLine {
    from {
        transform: scaleX(0.35);
        opacity: 0.45;
    }

    to {
        transform: scaleX(1);
        opacity: 1;
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-process-section {
        padding: 100px 0;
    }

    .wm-process-card {
        padding: 23px;
    }

    .wm-process-card > p {
        min-height: 105px;
    }
}

@media (max-width: 991px) {
    .wm-process-timeline {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 60px 22px;
    }

    .wm-process-line {
        display: none;
    }

    .wm-process-step-marker {
        margin-left: 23px;
    }

    .wm-process-card > p {
        min-height: 82px;
    }

    .wm-process-summary {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767px) {
    .wm-process-section {
        padding: 80px 0;
    }

    .wm-process-heading {
        margin-bottom: 50px;
    }

    .wm-process-heading h2 {
        font-size: 41px;
        letter-spacing: -1.3px;
    }

    .wm-process-heading p {
        font-size: 15px;
    }

    .wm-process-timeline {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .wm-process-step {
        display: grid;
        grid-template-columns: 58px minmax(0, 1fr);
        gap: 15px;
        align-items: start;
    }

    .wm-process-step-marker {
        margin: 15px 0 0;
    }

    .wm-process-step::before {
        position: absolute;
        top: 73px;
        bottom: -25px;
        left: 28px;
        z-index: 0;
        width: 2px;
        content: "";
        background:
            linear-gradient(
                to bottom,
                rgba(0, 208, 132, 0.48),
                rgba(83, 107, 238, 0.18)
            );
    }

    .wm-process-step:last-child::before {
        display: none;
    }

    .wm-process-card > p {
        min-height: auto;
    }
}

@media (max-width: 575px) {
    .wm-process-section {
        padding: 65px 0;
    }

    .wm-process-heading h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .wm-process-step {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 12px;
    }

    .wm-process-step-marker {
        width: 48px;
        height: 48px;
        border-width: 6px;
    }

    .wm-process-step::before {
        top: 63px;
        left: 23px;
    }

    .wm-process-card {
        padding: 21px;
        border-radius: 18px;
    }

    .wm-process-icon {
        width: 48px;
        height: 48px;
        border-radius: 13px;
        font-size: 16px;
    }

    .wm-process-summary {
        padding: 21px;
    }

    .wm-process-summary-content {
        align-items: flex-start;
    }

    .wm-process-summary-button {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .wm-process-heading h2 {
        font-size: 30px;
    }

    .wm-process-badge {
        font-size: 9px;
    }

    .wm-process-step {
        display: block;
    }

    .wm-process-step-marker {
        margin: 0 0 14px;
    }

    .wm-process-step::before {
        display: none;
    }
}


/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .wm-process-glow,
    .wm-process-line-progress {
        animation: none !important;
    }
}

/* =========================================================
   PHASE 7 — INDUSTRIES WE SERVE
========================================================= */

.wm-industries-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #f9fcfb 0%,
            #ffffff 45%,
            #f6f9ff 100%
        );
    isolation: isolate;
}

.wm-industries-container {
    position: relative;
    z-index: 4;
}


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

.wm-industries-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-industries-pattern {
    position: absolute;
    inset: 0;
    opacity: 0.32;
    background-image:
        radial-gradient(
            circle,
            rgba(24, 53, 74, 0.07) 1px,
            transparent 1px
        );
    background-size: 29px 29px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 16%,
            #000 84%,
            transparent
        );
}

.wm-industries-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    animation: wmIndustriesGlow 11s ease-in-out infinite;
}

.wm-industries-glow-one {
    top: -250px;
    right: -230px;
    width: 620px;
    height: 620px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.13),
            transparent 70%
        );
}

.wm-industries-glow-two {
    bottom: -280px;
    left: -250px;
    width: 680px;
    height: 680px;
    background:
        radial-gradient(
            circle,
            rgba(78, 107, 255, 0.1),
            transparent 70%
        );
    animation-delay: -5s;
}


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

.wm-industries-heading {
    max-width: 760px;
    margin-bottom: 58px;
}

.wm-industries-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 37px;
    padding: 8px 15px;
    margin-bottom: 20px;
    color: #147954;
    background: rgba(0, 208, 132, 0.09);
    border: 1px solid rgba(0, 208, 132, 0.18);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.35px;
}

.wm-industries-badge i {
    color: var(--wm-primary);
}

.wm-industries-heading h2 {
    max-width: 730px;
    margin: 0 0 20px;
    color: var(--wm-dark);
    font-size: clamp(40px, 4.5vw, 59px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -2px;
}

.wm-industries-heading h2 span {
    color: var(--wm-primary-dark);
}

.wm-industries-heading p {
    max-width: 700px;
    margin: 0;
    color: #637486;
    font-size: 17px;
    line-height: 1.8;
}

.wm-industries-header-action {
    display: flex;
    justify-content: flex-end;
    padding-bottom: 58px;
}

.wm-industries-main-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    min-height: 52px;
    padding: 15px 21px;
    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            var(--wm-dark),
            #243d54
        );
    border-radius: 14px;
    box-shadow:
        0 14px 32px rgba(20, 35, 54, 0.17);
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
    transition:
        background 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-industries-main-button:hover {
    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            var(--wm-primary-dark),
            var(--wm-primary)
        );
    box-shadow:
        0 17px 38px rgba(0, 169, 108, 0.22);
    transform: translateY(-3px);
}

.wm-industries-main-button i {
    font-size: 10px;
    transition: transform 0.25s ease;
}

.wm-industries-main-button:hover i {
    transform: translateX(5px);
}


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

.wm-industries-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 23px;
}

.wm-industry-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 100%;
    padding: 29px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e2eae7;
    border-radius: 23px;
    box-shadow:
        0 13px 37px rgba(22, 41, 60, 0.06);
    backdrop-filter: blur(14px);
    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

.wm-industry-card::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    content: "";
    background:
        linear-gradient(
            90deg,
            var(--wm-primary),
            #5794ff
        );
    opacity: 0;
    transition: opacity 0.3s ease;
}

.wm-industry-card::after {
    position: absolute;
    right: -80px;
    bottom: -80px;
    width: 190px;
    height: 190px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.12),
            transparent 68%
        );
    border-radius: 50%;
    opacity: 0;
    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.wm-industry-card:hover {
    border-color: rgba(0, 208, 132, 0.29);
    box-shadow:
        0 26px 58px rgba(22, 41, 60, 0.11);
    transform: translateY(-8px);
}

.wm-industry-card:hover::before,
.wm-industry-card:hover::after {
    opacity: 1;
}

.wm-industry-card:hover::after {
    transform: scale(1.15);
}

.wm-industry-card-featured {
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #151d31 0%,
            #18334a 58%,
            #123a39 100%
        );
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow:
        0 22px 55px rgba(20, 34, 53, 0.19);
}

.wm-industry-card-featured::after {
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.23),
            transparent 68%
        );
    opacity: 1;
}


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

.wm-industry-card-header {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 23px;
}

.wm-industry-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    color: #ffffff;
    border-radius: 17px;
    box-shadow:
        0 13px 27px rgba(22, 39, 58, 0.17);
    font-size: 21px;
    transition: transform 0.3s ease;
}

.wm-industry-card:hover .wm-industry-icon {
    transform: translateY(-3px) rotate(-4deg);
}

.wm-industry-icon-school {
    color: #10261d;
    background:
        linear-gradient(
            135deg,
            #7df1bd,
            #00d084
        );
}

.wm-industry-icon-sme {
    background:
        linear-gradient(
            135deg,
            #507cff,
            #4c55d1
        );
}

.wm-industry-icon-training {
    background:
        linear-gradient(
            135deg,
            #8d67ed,
            #6247cd
        );
}

.wm-industry-icon-service {
    background:
        linear-gradient(
            135deg,
            #27b4d1,
            #21809b
        );
}

.wm-industry-icon-retail {
    background:
        linear-gradient(
            135deg,
            #f2aa45,
            #de7131
        );
}

.wm-industry-icon-startup {
    background:
        linear-gradient(
            135deg,
            #e96a9e,
            #b74879
        );
}

.wm-industry-number {
    color: #d8e0e4;
    font-size: 25px;
    font-weight: 900;
    line-height: 1;
}

.wm-industry-card-featured .wm-industry-number {
    color: rgba(255, 255, 255, 0.15);
}


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

.wm-industry-category {
    position: relative;
    z-index: 2;
    display: block;
    margin-bottom: 8px;
    color: var(--wm-primary-dark);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.75px;
    text-transform: uppercase;
}

.wm-industry-card-featured .wm-industry-category {
    color: #74ecb5;
}

.wm-industry-card h3 {
    position: relative;
    z-index: 2;
    min-height: 60px;
    margin: 0 0 13px;
    color: var(--wm-dark);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.3;
    letter-spacing: -0.5px;
}

.wm-industry-card-featured h3 {
    color: #ffffff;
}

.wm-industry-card > p {
    position: relative;
    z-index: 2;
    min-height: 92px;
    margin: 0 0 20px;
    color: #647586;
    font-size: 12px;
    line-height: 1.72;
}

.wm-industry-card-featured > p {
    color: rgba(255, 255, 255, 0.66);
}

.wm-industry-features {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 0;
    margin: 0 0 23px;
    list-style: none;
}

.wm-industry-features li {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #475a6c;
    font-size: 10px;
    font-weight: 700;
}

.wm-industry-features i {
    color: var(--wm-primary-dark);
    font-size: 8px;
}

.wm-industry-card-featured .wm-industry-features li {
    color: rgba(255, 255, 255, 0.78);
}

.wm-industry-card-featured .wm-industry-features i {
    color: #72ecb4;
}


/* =========================================================
   SOLUTION TAGS
========================================================= */

.wm-industry-solutions {
    position: relative;
    z-index: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    padding-top: 20px;
    margin-top: auto;
    border-top: 1px solid #e6ece9;
}

.wm-industry-solutions span {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 6px 10px;
    color: #586b7b;
    background: #f2f6f4;
    border: 1px solid #e4ebe7;
    border-radius: 999px;
    font-size: 8px;
    font-weight: 800;
}

.wm-industry-card-featured .wm-industry-solutions {
    border-top-color: rgba(255, 255, 255, 0.1);
}

.wm-industry-card-featured .wm-industry-solutions span {
    color: rgba(255, 255, 255, 0.69);
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.09);
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.wm-industries-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding: 27px 29px;
    margin-top: 30px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #151f34 0%,
            #19374a 58%,
            #153d3a 100%
        );
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 21px;
    box-shadow:
        0 22px 55px rgba(20, 35, 54, 0.17);
}

.wm-industries-bottom-content {
    display: flex;
    align-items: center;
    gap: 17px;
}

.wm-industries-bottom-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 55px;
    flex: 0 0 55px;
    color: #10231b;
    background:
        linear-gradient(
            135deg,
            #7df2bd,
            #00d084
        );
    border-radius: 16px;
    box-shadow:
        0 13px 27px rgba(0, 208, 132, 0.2);
    font-size: 19px;
}

.wm-industries-bottom-label {
    display: block;
    margin-bottom: 4px;
    color: #75edb7;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.wm-industries-bottom h3 {
    margin: 0 0 5px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
}

.wm-industries-bottom p {
    max-width: 680px;
    margin: 0;
    color: rgba(255, 255, 255, 0.59);
    font-size: 11px;
    line-height: 1.55;
}

.wm-industries-bottom-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 49px;
    padding: 14px 20px;
    color: #10221b !important;
    background:
        linear-gradient(
            135deg,
            #7bf1ba,
            #00d084
        );
    border-radius: 13px;
    font-size: 12px;
    font-weight: 900;
    text-decoration: none;
    white-space: nowrap;
    transition:
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-industries-bottom-button:hover {
    color: #10221b !important;
    box-shadow:
        0 14px 30px rgba(0, 208, 132, 0.25);
    transform: translateY(-3px);
}

.wm-industries-bottom-button i {
    font-size: 10px;
    transition: transform 0.25s ease;
}

.wm-industries-bottom-button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes wmIndustriesGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(25px, -18px, 0) scale(1.06);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-industries-section {
        padding: 100px 0;
    }

    .wm-industry-card {
        padding: 25px;
    }
}

@media (max-width: 991px) {
    .wm-industries-heading {
        margin-bottom: 28px;
    }

    .wm-industries-header-action {
        justify-content: flex-start;
        padding-bottom: 45px;
    }

    .wm-industries-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wm-industry-card h3,
    .wm-industry-card > p {
        min-height: auto;
    }

    .wm-industries-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 767px) {
    .wm-industries-section {
        padding: 80px 0;
    }

    .wm-industries-heading h2 {
        font-size: 41px;
        letter-spacing: -1.3px;
    }

    .wm-industries-heading p {
        font-size: 15px;
    }

    .wm-industries-grid {
        grid-template-columns: 1fr;
        gap: 19px;
    }
}

@media (max-width: 575px) {
    .wm-industries-section {
        padding: 65px 0;
    }

    .wm-industries-heading h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .wm-industries-main-button {
        width: 100%;
    }

    .wm-industry-card {
        padding: 22px;
        border-radius: 19px;
    }

    .wm-industries-bottom {
        padding: 22px;
    }

    .wm-industries-bottom-content {
        align-items: flex-start;
    }

    .wm-industries-bottom-button {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .wm-industries-heading h2 {
        font-size: 30px;
    }

    .wm-industries-badge {
        font-size: 9px;
    }

    .wm-industry-card-header {
        flex-direction: column;
        gap: 13px;
    }
}


/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .wm-industries-glow {
        animation: none !important;
    }
}

/* =========================================================
   PATCH 8 — FINAL CTA
========================================================= */

.wm-final-cta {
    position: relative;
    padding: 105px 0;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #f8fcfa 0%,
            #f6f9ff 100%
        );
    isolation: isolate;
}

.wm-final-cta-container {
    position: relative;
    z-index: 4;
}


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

.wm-final-cta-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-final-cta-grid {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    background-image:
        linear-gradient(
            rgba(24, 53, 74, 0.045) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(24, 53, 74, 0.045) 1px,
            transparent 1px
        );
    background-size: 46px 46px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 20%,
            #000 80%,
            transparent
        );
}

.wm-final-cta-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    animation: wmFinalCtaGlow 10s ease-in-out infinite;
}

.wm-final-cta-glow-one {
    top: -240px;
    left: -220px;
    width: 620px;
    height: 620px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.15),
            transparent 70%
        );
}

.wm-final-cta-glow-two {
    right: -260px;
    bottom: -260px;
    width: 680px;
    height: 680px;
    background:
        radial-gradient(
            circle,
            rgba(77, 105, 255, 0.12),
            transparent 70%
        );
    animation-delay: -5s;
}

.wm-final-cta-orbit {
    position: absolute;
    display: block;
    border: 1px solid rgba(0, 208, 132, 0.12);
    border-radius: 50%;
    animation: wmFinalCtaOrbit 26s linear infinite;
}

.wm-final-cta-orbit-one {
    top: 60px;
    right: 9%;
    width: 360px;
    height: 360px;
}

.wm-final-cta-orbit-two {
    right: 2%;
    bottom: -140px;
    width: 520px;
    height: 520px;
    border-color: rgba(78, 105, 255, 0.1);
    animation-duration: 34s;
    animation-direction: reverse;
}


/* =========================================================
   CTA BOX
========================================================= */

.wm-final-cta-box {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    gap: 45px;
    align-items: center;
    min-height: 470px;
    padding: 55px;
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #141b2e 0%,
            #19344a 58%,
            #123c39 100%
        );
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 32px;
    box-shadow:
        0 35px 90px rgba(20, 35, 53, 0.22);
}

.wm-final-cta-box::before {
    position: absolute;
    top: -160px;
    right: -140px;
    width: 420px;
    height: 420px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.22),
            transparent 68%
        );
    border-radius: 50%;
}

.wm-final-cta-box::after {
    position: absolute;
    bottom: -180px;
    left: -120px;
    width: 400px;
    height: 400px;
    content: "";
    background:
        radial-gradient(
            circle,
            rgba(75, 104, 255, 0.16),
            transparent 68%
        );
    border-radius: 50%;
}


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

.wm-final-cta-content {
    position: relative;
    z-index: 3;
    max-width: 690px;
}

.wm-final-cta-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 38px;
    padding: 8px 15px;
    margin-bottom: 22px;
    color: #7cf0b9;
    background: rgba(0, 208, 132, 0.11);
    border: 1px solid rgba(0, 208, 132, 0.21);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.35px;
}

.wm-final-cta-content h2 {
    max-width: 680px;
    margin: 0 0 21px;
    color: #ffffff;
    font-size: clamp(42px, 4.7vw, 64px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -2.2px;
}

.wm-final-cta-content h2 span {
    color: #73edb5;
}

.wm-final-cta-content p {
    max-width: 640px;
    margin: 0 0 31px;
    color: rgba(255, 255, 255, 0.65);
    font-size: 16px;
    line-height: 1.8;
}

.wm-final-cta-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
}

.wm-final-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 54px;
    padding: 16px 22px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-decoration: none;
    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-final-cta-button-primary {
    color: #10221b !important;
    background:
        linear-gradient(
            135deg,
            #7df2bd,
            #00d084
        );
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow:
        0 15px 34px rgba(0, 208, 132, 0.24);
}

.wm-final-cta-button-primary:hover {
    color: #10221b !important;
    box-shadow:
        0 20px 42px rgba(0, 208, 132, 0.32);
    transform: translateY(-3px);
}

.wm-final-cta-button-primary i {
    font-size: 10px;
    transition: transform 0.25s ease;
}

.wm-final-cta-button-primary:hover i {
    transform: translateX(5px);
}

.wm-final-cta-button-secondary {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(12px);
}

.wm-final-cta-button-secondary:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(0, 208, 132, 0.24);
    transform: translateY(-3px);
}


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

.wm-final-cta-visual {
    position: relative;
    z-index: 3;
    min-height: 350px;
}

.wm-final-cta-core {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 5;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    width: 155px;
    height: 155px;
    padding: 20px;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.14),
            rgba(255, 255, 255, 0.06)
        );
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 34px;
    box-shadow:
        0 25px 55px rgba(0, 0, 0, 0.22);
    backdrop-filter: blur(18px);
    text-align: center;
    transform: translate(-50%, -50%) rotate(-3deg);
}

.wm-final-cta-core-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 25px;
    height: 25px;
    margin-bottom: 12px;

    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0;

    overflow: visible;
}

.wm-final-cta-core-logo-image {
    display: block;
    width: 46px;
    height: 46px;
    object-fit: contain;
    background: transparent;
}

.wm-final-cta-core strong {
    display: block;
    margin-bottom: 4px;
    font-size: 15px;
    font-weight: 900;
}

.wm-final-cta-core small {
    display: block;
    color: rgba(255, 255, 255, 0.5);
    font-size: 8px;
}

.wm-final-cta-item {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 145px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    box-shadow:
        0 17px 38px rgba(0, 0, 0, 0.17);
    backdrop-filter: blur(14px);
    animation: wmFinalCtaFloat 5.5s ease-in-out infinite;
}

.wm-final-cta-item > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    color: #10231b;
    background:
        linear-gradient(
            135deg,
            #7cf1ba,
            #00d084
        );
    border-radius: 11px;
    font-size: 14px;
}

.wm-final-cta-item small {
    display: block;
    margin-bottom: 2px;
    color: rgba(255, 255, 255, 0.45);
    font-size: 7px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.wm-final-cta-item strong {
    display: block;
    color: #ffffff;
    font-size: 10px;
    font-weight: 800;
}

.wm-final-cta-item-one {
    top: 20px;
    left: 0;
    animation-delay: -1s;
}

.wm-final-cta-item-two {
    top: 35px;
    right: 0;
    animation-delay: -2s;
}

.wm-final-cta-item-three {
    bottom: 26px;
    left: 7px;
    animation-delay: -3s;
}

.wm-final-cta-item-four {
    right: 7px;
    bottom: 20px;
    animation-delay: -4s;
}

.wm-final-cta-item-two > span {
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #657eff,
            #6b55dd
        );
}

.wm-final-cta-item-three > span {
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #9a66ef,
            #6148ca
        );
}

.wm-final-cta-item-four > span {
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #f0a747,
            #d86e31
        );
}

.wm-final-cta-line {
    position: absolute;
    z-index: 2;
    display: block;
    height: 1px;
    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(0, 208, 132, 0.6),
            transparent
        );
    transform-origin: left;
}

.wm-final-cta-line-one {
    top: 108px;
    left: 98px;
    width: 105px;
    transform: rotate(24deg);
}

.wm-final-cta-line-two {
    top: 115px;
    right: 95px;
    width: 105px;
    transform: rotate(-25deg);
}

.wm-final-cta-line-three {
    bottom: 105px;
    left: 102px;
    width: 105px;
    transform: rotate(-25deg);
}

.wm-final-cta-line-four {
    right: 99px;
    bottom: 105px;
    width: 105px;
    transform: rotate(25deg);
}


/* =========================================================
   ANIMATIONS
========================================================= */

@keyframes wmFinalCtaGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(24px, -17px, 0) scale(1.06);
    }
}

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

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

@keyframes wmFinalCtaFloat {
    0%,
    100% {
        transform: translateY(0);
    }

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


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-final-cta {
        padding: 95px 0;
    }

    .wm-final-cta-box {
        gap: 30px;
        padding: 45px;
    }

    .wm-final-cta-item {
        min-width: 132px;
    }
}

@media (max-width: 991px) {
    .wm-final-cta-box {
        grid-template-columns: 1fr;
    }

    .wm-final-cta-content {
        max-width: 760px;
        text-align: center;
    }

    .wm-final-cta-content h2,
    .wm-final-cta-content p {
        margin-right: auto;
        margin-left: auto;
    }

    .wm-final-cta-actions {
        justify-content: center;
    }

    .wm-final-cta-visual {
        width: 100%;
        max-width: 520px;
        margin: 10px auto 0;
    }
}

@media (max-width: 767px) {
    .wm-final-cta {
        padding: 80px 0;
    }

    .wm-final-cta-box {
        padding: 36px 28px;
        border-radius: 26px;
    }

    .wm-final-cta-content h2 {
        font-size: 42px;
        letter-spacing: -1.4px;
    }

    .wm-final-cta-content p {
        font-size: 15px;
    }

    .wm-final-cta-visual {
        min-height: 320px;
    }
}

@media (max-width: 575px) {
    .wm-final-cta {
        padding: 65px 0;
    }

    .wm-final-cta-box {
        padding: 29px 20px;
        border-radius: 22px;
    }

    .wm-final-cta-content h2 {
        font-size: 34px;
        letter-spacing: -0.9px;
    }

    .wm-final-cta-actions {
        width: 100%;
    }

    .wm-final-cta-button {
        width: 100%;
    }

    .wm-final-cta-visual {
        min-height: 280px;
    }

    .wm-final-cta-core {
        width: 130px;
        height: 130px;
    }

    .wm-final-cta-item {
        min-width: 0;
        padding: 9px;
    }

    .wm-final-cta-item > div {
        display: none;
    }

    .wm-final-cta-item > span {
        width: 36px;
        height: 36px;
    }

    .wm-final-cta-line {
        display: none;
    }
}

@media (max-width: 380px) {
    .wm-final-cta-content h2 {
        font-size: 30px;
    }

    .wm-final-cta-badge {
        font-size: 9px;
    }

    .wm-final-cta-visual {
        min-height: 250px;
    }

    .wm-final-cta-item-one {
        left: 5px;
    }

    .wm-final-cta-item-two {
        right: 5px;
    }

    .wm-final-cta-item-three {
        left: 5px;
    }

    .wm-final-cta-item-four {
        right: 5px;
    }
}


/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .wm-final-cta-glow,
    .wm-final-cta-orbit,
    .wm-final-cta-item {
        animation: none !important;
    }
}

/* =========================================================
   PHASE 9 — CONTACT SECTION
========================================================= */

.wm-contact-section {
    position: relative;
    padding: 115px 0;
    overflow: hidden;
    background:
        linear-gradient(
            145deg,
            #f8fcfa 0%,
            #ffffff 50%,
            #f5f8ff 100%
        );
    isolation: isolate;
}

.wm-contact-container {
    position: relative;
    z-index: 4;
}

.wm-contact-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    pointer-events: none;
}

.wm-contact-grid {
    position: absolute;
    inset: 0;
    opacity: 0.34;
    background-image:
        linear-gradient(
            rgba(25, 53, 73, 0.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(25, 53, 73, 0.04) 1px,
            transparent 1px
        );
    background-size: 47px 47px;
    mask-image:
        linear-gradient(
            to bottom,
            transparent,
            #000 18%,
            #000 82%,
            transparent
        );
}

.wm-contact-glow {
    position: absolute;
    display: block;
    border-radius: 50%;
    filter: blur(8px);
    animation: wmContactGlow 10s ease-in-out infinite;
}

.wm-contact-glow-one {
    top: -250px;
    left: -230px;
    width: 630px;
    height: 630px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.14),
            transparent 70%
        );
}

.wm-contact-glow-two {
    right: -260px;
    bottom: -280px;
    width: 680px;
    height: 680px;
    background:
        radial-gradient(
            circle,
            rgba(77, 105, 255, 0.11),
            transparent 70%
        );
    animation-delay: -5s;
}


/* Contact Heading */

.wm-contact-heading {
    max-width: 850px;
    margin: 0 auto 65px;
}

.wm-contact-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    min-height: 37px;
    padding: 8px 15px;
    margin-bottom: 20px;
    color: #147954;
    background: rgba(0, 208, 132, 0.09);
    border: 1px solid rgba(0, 208, 132, 0.18);
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
}

.wm-contact-heading h2 {
    margin: 0 auto 20px;
    color: var(--wm-dark);
    font-size: clamp(40px, 4.5vw, 59px);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -2px;
}

.wm-contact-heading h2 span {
    color: var(--wm-primary-dark);
}

.wm-contact-heading p {
    max-width: 720px;
    margin: 0 auto;
    color: #647586;
    font-size: 17px;
    line-height: 1.8;
}


/* Contact Layout */

.wm-contact-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.25fr);
    gap: 28px;
}

.wm-contact-info {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.wm-contact-method {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 95px;
    padding: 19px;
    color: inherit;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e1e9e6;
    border-radius: 18px;
    box-shadow:
        0 12px 34px rgba(22, 41, 60, 0.055);
    text-decoration: none;
    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}

a.wm-contact-method:hover {
    border-color: rgba(0, 208, 132, 0.3);
    box-shadow:
        0 22px 48px rgba(22, 41, 60, 0.1);
    transform: translateY(-5px);
}

.wm-contact-method-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    color: #ffffff;
    border-radius: 15px;
    box-shadow:
        0 12px 24px rgba(22, 39, 58, 0.16);
    font-size: 19px;
}

.wm-contact-method-whatsapp .wm-contact-method-icon {
    background:
        linear-gradient(
            135deg,
            #35d972,
            #13a951
        );
}

.wm-contact-method-phone .wm-contact-method-icon {
    background:
        linear-gradient(
            135deg,
            #4d8dff,
            #4a5dd6
        );
}

.wm-contact-method-email .wm-contact-method-icon {
    background:
        linear-gradient(
            135deg,
            #9364ed,
            #6247cd
        );
}

.wm-contact-method-location .wm-contact-method-icon {
    background:
        linear-gradient(
            135deg,
            #f1a645,
            #dd7131
        );
}

.wm-contact-method-content {
    min-width: 0;
    flex: 1;
}

.wm-contact-method-label {
    display: block;
    margin-bottom: 3px;
    color: var(--wm-primary-dark);
    font-size: 9px;
    font-weight: 900;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.wm-contact-method-content strong {
    display: block;
    overflow-wrap: anywhere;
    margin-bottom: 3px;
    color: var(--wm-dark);
    font-size: 16px;
    font-weight: 800;
}

.wm-contact-method-content small {
    display: block;
    color: #7a8895;
    font-size: 10px;
}

.wm-contact-method-arrow {
    color: var(--wm-primary-dark);
    font-size: 11px;
    transition: transform 0.25s ease;
}

a.wm-contact-method:hover .wm-contact-method-arrow {
    transform: translateX(5px);
}


/* Contact Social */

.wm-contact-social-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #151d31,
            #19364a,
            #143c39
        );
    border-radius: 19px;
    box-shadow:
        0 20px 48px rgba(20, 35, 54, 0.16);
}

.wm-contact-social-label {
    display: block;
    margin-bottom: 4px;
    color: #75edb7;
    font-size: 8px;
    font-weight: 900;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.wm-contact-social-box h3 {
    margin: 0;
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
}

.wm-contact-social-links {
    display: flex;
    align-items: center;
    gap: 8px;
}

.wm-contact-social-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 11px;
    font-size: 13px;
    transition:
        background 0.25s ease,
        transform 0.25s ease;
}

.wm-contact-social-links a:hover {
    color: #10231b;
    background: var(--wm-primary);
    transform: translateY(-3px);
}


/* Contact Form */

.wm-contact-form-wrapper {
    padding: 34px;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid #e0e9e5;
    border-radius: 25px;
    box-shadow:
        0 23px 65px rgba(22, 41, 60, 0.1);
    backdrop-filter: blur(15px);
}

.wm-contact-form-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-bottom: 23px;
    margin-bottom: 24px;
    border-bottom: 1px solid #e6ece9;
}

.wm-contact-form-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    color: #10231b;
    background:
        linear-gradient(
            135deg,
            #7cf1ba,
            #00d084
        );
    border-radius: 15px;
    font-size: 18px;
}

.wm-contact-form-header > div > span {
    display: block;
    margin-bottom: 3px;
    color: var(--wm-primary-dark);
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
}

.wm-contact-form-icon i {
    display: block;
    margin: 0;
    font-size: 18px;
    line-height: 1;
    color: #10231b;
}

.wm-contact-form-header h3 {
    margin: 0;
    color: var(--wm-dark);
    font-size: 22px;
    font-weight: 800;
}

.wm-form-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 17px;
}

.wm-form-group {
    margin-bottom: 18px;
}

.wm-form-group label {
    display: block;
    margin-bottom: 8px;
    color: #35495b;
    font-size: 11px;
    font-weight: 800;
}

.wm-form-group label span {
    color: #e1516f;
}

.wm-form-control {
    position: relative;
}

.wm-form-control > i {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 2;
    color: #93a0ab;
    font-size: 12px;
    transform: translateY(-50%);
    pointer-events: none;
}

.wm-form-control input,
.wm-form-control select,
.wm-form-control textarea {
    width: 100%;
    color: var(--wm-dark);
    background: #f8fafb;
    border: 1px solid #dfe7e4;
    border-radius: 12px;
    outline: none;
    font-family: inherit;
    font-size: 12px;
    transition:
        background 0.25s ease,
        border-color 0.25s ease,
        box-shadow 0.25s ease;
}

.wm-form-control input,
.wm-form-control select {
    height: 52px;
    padding: 0 15px 0 43px;
}

.wm-form-control textarea {
    min-height: 135px;
    padding: 16px 15px 16px 43px;
    resize: vertical;
}

.wm-form-textarea-control > i {
    top: 20px;
    transform: none;
}

.wm-form-control input:focus,
.wm-form-control select:focus,
.wm-form-control textarea:focus {
    background: #ffffff;
    border-color: rgba(0, 208, 132, 0.55);
    box-shadow:
        0 0 0 4px rgba(0, 208, 132, 0.09);
}

.wm-contact-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    width: 100%;
    min-height: 54px;
    padding: 15px 22px;
    color: #10231b;
    background:
        linear-gradient(
            135deg,
            #7cf1ba,
            #00d084
        );
    border: 0;
    border-radius: 14px;
    box-shadow:
        0 14px 30px rgba(0, 208, 132, 0.22);
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 900;
    transition:
        box-shadow 0.25s ease,
        transform 0.25s ease;
}

.wm-contact-submit:hover {
    box-shadow:
        0 19px 38px rgba(0, 208, 132, 0.3);
    transform: translateY(-3px);
}

.wm-contact-form-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 13px 0 0;
    color: #84919c;
    font-size: 9px;
    text-align: center;
}

.wm-contact-form-note i {
    color: var(--wm-primary-dark);
}


/* =========================================================
   FOOTER
========================================================= */

.wm-footer {
    position: relative;
    overflow: hidden;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            #0e1425 0%,
            #15293c 58%,
            #103332 100%
        );
    isolation: isolate;
}

.wm-footer-background {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.wm-footer-grid {
    position: absolute;
    inset: 0;
    opacity: 0.2;
    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.04) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.04) 1px,
            transparent 1px
        );
    background-size: 44px 44px;
}

.wm-footer-glow {
    position: absolute;
    right: -230px;
    bottom: -260px;
    width: 630px;
    height: 630px;
    background:
        radial-gradient(
            circle,
            rgba(0, 208, 132, 0.16),
            transparent 70%
        );
    border-radius: 50%;
}

.wm-footer-container {
    position: relative;
    z-index: 3;
}

.wm-footer-main {
    display: grid;
    grid-template-columns:
        minmax(0, 1.6fr)
        repeat(3, minmax(0, 0.72fr))
        minmax(0, 1fr);
    gap: 38px;
    padding: 78px 0 60px;
}

.wm-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 20px;
    color: #ffffff;
    text-decoration: none;
}

.wm-footer-logo img {
    width: auto;
    height: 48px;
    object-fit: contain;
    border-radius: 8px;
}

.wm-footer-logo > span {
    font-size: 23px;
    font-weight: 800;
}

.wm-footer-logo strong {
    color: var(--wm-primary);
}

.wm-footer-brand > p {
    max-width: 360px;
    margin: 0 0 22px;
    color: rgba(255, 255, 255, 0.58);
    font-size: 12px;
    line-height: 1.75;
}

.wm-footer-contact-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.wm-footer-contact-list a,
.wm-footer-contact-list span {
    display: flex;
    align-items: center;
    gap: 9px;
    color: rgba(255, 255, 255, 0.69);
    font-size: 10px;
    text-decoration: none;
}

.wm-footer-contact-list i {
    width: 15px;
    color: #6cebb2;
    text-align: center;
}

.wm-footer-column h3 {
    margin: 4px 0 20px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
}

.wm-footer-column ul {
    display: flex;
    flex-direction: column;
    gap: 11px;
    padding: 0;
    margin: 0;
    list-style: none;
}

.wm-footer-column li {
    line-height: 1.4;
}

.wm-footer-column a {
    color: rgba(255, 255, 255, 0.58);
    font-size: 10px;
    text-decoration: none;
    transition:
        color 0.25s ease,
        padding-left 0.25s ease;
}

.wm-footer-column li a:hover {
    padding-left: 4px;
    color: #72edb6;
}

.wm-footer-connect > p {
    margin: 0 0 18px;
    color: rgba(255, 255, 255, 0.55);
    font-size: 10px;
    line-height: 1.7;
}

.wm-footer-social-links {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
}

.wm-footer-social-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    font-size: 12px;
}

.wm-footer-social-links a:hover {
    padding-left: 0;
    color: #10231b;
    background: var(--wm-primary);
}

.wm-footer-whatsapp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 42px;
    padding: 11px 14px;
    color: #10231b !important;
    background:
        linear-gradient(
            135deg,
            #7cf1ba,
            #00d084
        );
    border-radius: 11px;
    font-size: 10px !important;
    font-weight: 900;
}

.wm-footer-whatsapp:hover {
    padding-left: 14px !important;
    box-shadow:
        0 12px 25px rgba(0, 208, 132, 0.2);
    transform: translateY(-2px);
}

.wm-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    padding: 23px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.wm-footer-bottom p {
    margin: 0;
    color: rgba(255, 255, 255, 0.48);
    font-size: 9px;
}

.wm-footer-legal-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 17px;
}

.wm-footer-legal-links a {
    color: rgba(255, 255, 255, 0.5);
    font-size: 9px;
    text-decoration: none;
}

.wm-footer-legal-links a:hover {
    color: #72edb6;
}


/* =========================================================
   ANIMATION
========================================================= */

@keyframes wmContactGlow {
    0%,
    100% {
        transform: translate3d(0, 0, 0) scale(1);
    }

    50% {
        transform: translate3d(24px, -17px, 0) scale(1.06);
    }
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1199px) {
    .wm-contact-section {
        padding: 100px 0;
    }

    .wm-footer-main {
        grid-template-columns:
            minmax(0, 1.4fr)
            repeat(2, minmax(0, 0.75fr))
            minmax(0, 1fr);
    }

    .wm-footer-column:nth-child(4) {
        display: none;
    }
}

@media (max-width: 991px) {
    .wm-contact-layout {
        grid-template-columns: 1fr;
    }

    .wm-contact-info {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wm-contact-social-box {
        grid-column: 1 / -1;
    }

    .wm-footer-main {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wm-footer-brand {
        grid-column: 1 / -1;
    }

    .wm-footer-column:nth-child(4) {
        display: block;
    }
}

@media (max-width: 767px) {
    .wm-contact-section {
        padding: 80px 0;
    }

    .wm-contact-heading h2 {
        font-size: 41px;
        letter-spacing: -1.3px;
    }

    .wm-contact-heading p {
        font-size: 15px;
    }

    .wm-contact-info {
        grid-template-columns: 1fr;
    }

    .wm-contact-social-box {
        grid-column: auto;
    }

    .wm-form-row {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .wm-footer-main {
        gap: 32px;
        padding-top: 60px;
    }
}

@media (max-width: 575px) {
    .wm-contact-section {
        padding: 65px 0;
    }

    .wm-contact-heading h2 {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .wm-contact-form-wrapper {
        padding: 23px;
        border-radius: 20px;
    }

    .wm-contact-social-box {
        align-items: flex-start;
        flex-direction: column;
    }

    .wm-footer-main {
        grid-template-columns: 1fr;
    }

    .wm-footer-brand {
        grid-column: auto;
    }

    .wm-footer-bottom {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 380px) {
    .wm-contact-heading h2 {
        font-size: 30px;
    }

    .wm-contact-badge {
        font-size: 9px;
    }

    .wm-contact-method {
        align-items: flex-start;
    }

    .wm-contact-method-arrow {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .wm-contact-glow {
        animation: none !important;
    }
}


/* =========================================================
   BACK TO TOP
========================================================= */

#back-top {
    position: fixed;

    right: 28px;
    bottom: 24px;

    z-index: 999;

    display: block;

    width: 48px;
    height: 48px;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform:
        translate3d(0, 14px, 0)
        scale(0.92);

    border-radius: 50%;

    background: var(--wm-primary);

    box-shadow:
        0 12px 30px
        rgba(0, 208, 132, 0.3);

    transition:
        opacity 0.25s ease,
        visibility 0.25s ease,
        transform 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;

    will-change:
        opacity,
        transform;
}

#back-top.wm-back-top-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform:
        translate3d(0, 0, 0)
        scale(1);
}

#back-top.wm-back-top-visible:hover {
    transform:
        translate3d(0, -4px, 0)
        scale(1);

    background:
        var(--wm-primary-dark);

    box-shadow:
        0 16px 35px
        rgba(0, 208, 132, 0.38);
}

#back-top:hover {
    transform:
        translateY(-4px);

    background:
        var(--wm-primary-dark);

    box-shadow:
        0 16px 35px
        rgba(0, 208, 132, 0.38);
}

#back-top a {
    display: flex;

    width: 100%;
    height: 100%;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    font-size: 18px;
}

#back-top a:hover {
    color: #ffffff;
}

@media (max-width: 575px) {

    #back-top {
        right: 16px;
        bottom: 16px;

        width: 44px;
        height: 44px;
    }

}


/* =========================================================
   FEATURED PRODUCT — PREMIUM SCHOOL ERP DASHBOARD
========================================================= */
#featured-product {
    position: relative;
    overflow: hidden;
}

#featured-product::before {
    content: "";
    position: absolute;
    width: 520px;
    height: 520px;
    top: -300px;
    left: -220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 208, 132, 0.09), transparent 68%);
    pointer-events: none;
}

.featured-product-visual {
    position: relative;
    min-height: 430px;
    padding: 28px;
    border-radius: 30px;
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 12%, rgba(0, 208, 132, 0.18), transparent 30%),
        linear-gradient(145deg, #121426 0%, #17364d 100%);
    box-shadow: 0 28px 65px rgba(20, 20, 38, 0.16);
}

.featured-product-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-image:
        linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
    background-size: 28px 28px;
    pointer-events: none;
}

.featured-visual-topbar {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.featured-live-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 11px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 999px;
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.78);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
}

.featured-live-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--wm-primary);
    box-shadow: 0 0 0 5px rgba(0,208,132,.12);
}

.featured-dashboard-shell {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 128px minmax(0, 1fr);
    min-height: 315px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 22px;
    background: rgba(248, 251, 253, .98);
    box-shadow: 0 20px 42px rgba(4, 12, 24, .22);
    transform: perspective(1000px) rotateX(.7deg) rotateY(-1deg);
    transform-origin: center;
    transition: transform .45s ease, box-shadow .45s ease;
}

.featured-product-visual:hover .featured-dashboard-shell {
    transform: perspective(1000px) rotateX(0) rotateY(0) translateY(-3px);
    box-shadow: 0 25px 48px rgba(4, 12, 24, .28);
}

.featured-dashboard-sidebar {
    padding: 17px 12px;
    background: #111c2d;
    color: rgba(255,255,255,.72);
}

.featured-dashboard-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    white-space: nowrap;
}

.featured-dashboard-logo {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    flex: 0 0 27px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--wm-primary), #26e6b0);
    color: #0c2430;
}

.featured-dashboard-nav {
    display: grid;
    gap: 6px;
    margin-top: 26px;
}

.featured-dashboard-nav span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 31px;
    padding: 0 9px;
    border-radius: 8px;
    font-size: 9px;
}

.featured-dashboard-nav span.is-active {
    background: rgba(0,208,132,.14);
    color: #fff;
}

.featured-dashboard-nav i {
    width: 14px;
    color: var(--wm-primary);
    text-align: center;
}

.featured-dashboard-nav b {
    font-weight: 700;
}

.featured-dashboard-main {
    min-width: 0;
    padding: 17px;
    background: #f7fafc;
}

.featured-dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.featured-dashboard-header > div {
    display: grid;
    gap: 2px;
}

.featured-dashboard-header small,
.featured-card-heading small,
.featured-dashboard-stats small {
    color: #7d8b9c;
    font-size: 8px;
}

.featured-dashboard-header strong {
    color: #17263a;
    font-size: 13px;
}

.featured-dashboard-avatar {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: #e5f9f2;
    color: #008c5d;
    font-size: 9px;
    font-weight: 900;
}

.featured-dashboard-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 9px;
    margin-top: 16px;
}

.featured-dashboard-stats article {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    padding: 11px;
    border: 1px solid #e9eef3;
    border-radius: 12px;
    background: #fff;
}

.featured-dashboard-stats article > span {
    display: grid;
    place-items: center;
    width: 29px;
    height: 29px;
    flex: 0 0 29px;
    border-radius: 9px;
    background: #e9faf4;
    color: #00a96c;
    font-size: 11px;
}

.featured-dashboard-stats article div {
    display: grid;
    min-width: 0;
}

.featured-dashboard-stats strong {
    color: #17263a;
    font-size: 13px;
    line-height: 1.15;
}

.featured-dashboard-content {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 9px;
    margin-top: 9px;
}

.featured-chart-card,
.featured-activity-card {
    min-width: 0;
    padding: 12px;
    border: 1px solid #e9eef3;
    border-radius: 12px;
    background: #fff;
}

.featured-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.featured-card-heading > div {
    display: grid;
}

.featured-card-heading strong {
    color: #26384d;
    font-size: 9px;
}

.featured-card-heading > span {
    color: #00a96c;
    font-size: 10px;
    font-weight: 900;
}

.featured-mini-chart {
    display: flex;
    align-items: end;
    gap: 7px;
    height: 72px;
    margin-top: 12px;
    padding: 0 3px;
    border-bottom: 1px solid #edf1f5;
}

.featured-mini-chart i {
    display: block;
    width: 100%;
    height: var(--bar);
    min-height: 12px;
    border-radius: 4px 4px 1px 1px;
    background: linear-gradient(180deg, #10d99a, #00a96c);
    opacity: .88;
    transform-origin: bottom;
    animation: featuredBarGrow .8s cubic-bezier(.2,.75,.25,1) both;
}

.featured-mini-chart i:nth-child(2) { animation-delay: .06s; }
.featured-mini-chart i:nth-child(3) { animation-delay: .12s; }
.featured-mini-chart i:nth-child(4) { animation-delay: .18s; }
.featured-mini-chart i:nth-child(5) { animation-delay: .24s; }
.featured-mini-chart i:nth-child(6) { animation-delay: .3s; }

@keyframes featuredBarGrow {
    from { transform: scaleY(.12); opacity: .35; }
    to { transform: scaleY(1); opacity: .88; }
}

.featured-module-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 7px;
    margin-top: 12px;
}

.featured-module-grid span {
    display: grid;
    place-items: center;
    gap: 5px;
    min-height: 47px;
    padding: 6px;
    border-radius: 9px;
    background: #f5f8fb;
    color: #42566e;
    font-size: 7px;
    font-weight: 800;
    text-align: center;
}

.featured-module-grid i {
    color: #00a96c;
    font-size: 11px;
}

@media (max-width: 1199px) {
    .featured-dashboard-shell {
        grid-template-columns: 112px minmax(0,1fr);
    }

    .featured-dashboard-sidebar {
        padding-inline: 10px;
    }
}

@media (max-width: 991px) {
    .featured-product-visual {
        max-width: 720px;
        margin-inline: auto;
    }

    .featured-product-copy {
        max-width: 720px;
        margin: 12px auto 0;
    }
}

@media (max-width: 575px) {
    .featured-product-visual {
        min-height: 0;
        padding: 20px;
        border-radius: 24px;
    }

    .featured-visual-topbar {
        margin-bottom: 15px;
    }

    .featured-live-pill {
        padding: 6px 9px;
        font-size: 9px;
    }

    .featured-dashboard-shell {
        grid-template-columns: 48px minmax(0,1fr);
        min-height: 285px;
        border-radius: 17px;
        transform: none;
    }

    .featured-product-visual:hover .featured-dashboard-shell {
        transform: none;
    }

    .featured-dashboard-sidebar {
        padding: 12px 7px;
    }

    .featured-dashboard-brand {
        justify-content: center;
    }

    .featured-dashboard-brand > span:last-child,
    .featured-dashboard-nav b {
        display: none;
    }

    .featured-dashboard-nav {
        margin-top: 21px;
    }

    .featured-dashboard-nav span {
        justify-content: center;
        padding: 0;
    }

    .featured-dashboard-main {
        padding: 12px;
    }

    .featured-dashboard-header strong {
        font-size: 11px;
    }

    .featured-dashboard-stats {
        gap: 6px;
        margin-top: 12px;
    }

    .featured-dashboard-stats article {
        justify-content: center;
        padding: 8px 5px;
    }

    .featured-dashboard-stats article > span {
        display: none;
    }

    .featured-dashboard-stats strong {
        font-size: 10px;
    }

    .featured-dashboard-stats small {
        font-size: 6px;
    }

    .featured-dashboard-content {
        grid-template-columns: 1fr;
    }

    .featured-activity-card {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .featured-mini-chart i {
        animation: none !important;
    }
}


/* =========================================================
   DEVELOPMENT PROCESS — ANIMATED 1 → 6 FLOW
========================================================= */

@media (min-width: 992px) {

    .wm-process-timeline {
        position: relative;

        display: grid;

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

        grid-template-rows:
            repeat(2, auto);

        gap: 90px 28px;
    }


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

       01 → 02 → 03
                 ↓
       06 ← 05 ← 04
    ========================================= */

    .wm-process-step:nth-of-type(1) {
        grid-column: 1;
        grid-row: 1;
    }

    .wm-process-step:nth-of-type(2) {
        grid-column: 2;
        grid-row: 1;
    }

    .wm-process-step:nth-of-type(3) {
        grid-column: 3;
        grid-row: 1;
    }

    .wm-process-step:nth-of-type(4) {
        grid-column: 3;
        grid-row: 2;
    }

    .wm-process-step:nth-of-type(5) {
        grid-column: 2;
        grid-row: 2;
    }

    .wm-process-step:nth-of-type(6) {
        grid-column: 1;
        grid-row: 2;
    }


    /* Disable old line */

    .wm-process-line {
        display: none !important;
    }


    /* =========================================
       FLOW LAYER
    ========================================= */

    .wm-process-flow {
        position: absolute;

        inset: 0;

        z-index: 1;

        pointer-events: none;
    }


    .wm-flow-segment {
        position: absolute;

        display: block;

        overflow: hidden;

        background:
            rgba(25, 70, 74, 0.12);

        border-radius: 999px;
    }


    /* Animated colored fill */

    .wm-flow-segment::after {
        position: absolute;

        inset: 0;

        content: "";

        background:
            linear-gradient(
                90deg,
                #00d084,
                #52e5af,
                #559cff
            );

        border-radius: inherit;

        box-shadow:
            0 0 18px
            rgba(0, 208, 132, 0.34);

        transform: scaleX(0);

        transform-origin:
            left center;

        transition:
            transform 0.55s
            cubic-bezier(.22, 1, .36, 1);
    }


    /* 01 → 02 */

    .wm-flow-1 {
        top: 28px;

        left: 17%;

        width: 23%;

        height: 3px;
    }


    /* 02 → 03 */

    .wm-flow-2 {
        top: 28px;

        left: 50%;

        width: 23%;

        height: 3px;
    }


    /* 03 ↓ 04 */

    .wm-flow-3 {
        top: 29px;

        right: calc(16.7% - 1px);

        width: 3px;

        height:
            calc(50% + 46px);
    }


    .wm-flow-3::after {
        background:
            linear-gradient(
                180deg,
                #559cff,
                #705ee8,
                #00d084
            );

        transform:
            scaleY(0);

        transform-origin:
            center top;
    }


    /* 04 → 05 — visually right to left */

    .wm-flow-4 {
        top:
            calc(50% + 73px);

        left: 50%;

        width: 23%;

        height: 3px;
    }


    .wm-flow-4::after {
        transform-origin:
            right center;
    }


    /* 05 → 06 */

    .wm-flow-5 {
        top:
            calc(50% + 73px);

        left: 17%;

        width: 23%;

        height: 3px;
    }


    .wm-flow-5::after {
        transform-origin:
            right center;
    }


    /* =========================================
       ACTIVE FLOW
    ========================================= */

    .wm-process-timeline[data-flow-step="1"]
    .wm-flow-1::after,

    .wm-process-timeline[data-flow-step="2"]
    .wm-flow-1::after,

    .wm-process-timeline[data-flow-step="3"]
    .wm-flow-1::after,

    .wm-process-timeline[data-flow-step="4"]
    .wm-flow-1::after,

    .wm-process-timeline[data-flow-step="5"]
    .wm-flow-1::after {

        transform:
            scaleX(1);
    }


    .wm-process-timeline[data-flow-step="2"]
    .wm-flow-2::after,

    .wm-process-timeline[data-flow-step="3"]
    .wm-flow-2::after,

    .wm-process-timeline[data-flow-step="4"]
    .wm-flow-2::after,

    .wm-process-timeline[data-flow-step="5"]
    .wm-flow-2::after {

        transform:
            scaleX(1);
    }


    .wm-process-timeline[data-flow-step="3"]
    .wm-flow-3::after,

    .wm-process-timeline[data-flow-step="4"]
    .wm-flow-3::after,

    .wm-process-timeline[data-flow-step="5"]
    .wm-flow-3::after {

        transform:
            scaleY(1);
    }


    .wm-process-timeline[data-flow-step="4"]
    .wm-flow-4::after,

    .wm-process-timeline[data-flow-step="5"]
    .wm-flow-4::after {

        transform:
            scaleX(1);
    }


    .wm-process-timeline[data-flow-step="5"]
    .wm-flow-5::after {

        transform:
            scaleX(1);
    }


    /* =========================================
       MOVING GLOW PARTICLE
    ========================================= */

    .wm-process-runner {
        position: absolute;

        z-index: 5;

        top: 21px;
        left: calc(16.7% - 7px);

        width: 16px;
        height: 16px;

        background:
            #ffffff;

        border:
            4px solid
            #00d084;

        border-radius: 50%;

        box-shadow:
            0 0 0 7px
            rgba(0, 208, 132, 0.1),

            0 0 25px
            rgba(0, 208, 132, 0.75);

        opacity: 0;

        transform:
            scale(.8);

        transition:
            top .65s
            cubic-bezier(.22, 1, .36, 1),

            left .65s
            cubic-bezier(.22, 1, .36, 1),

            opacity .25s ease,

            transform .35s ease;
    }


    .wm-process-timeline[data-flow-step]
    .wm-process-runner {

        opacity: 1;

        transform:
            scale(1);
    }


    /* Step 01 */

    .wm-process-timeline[data-flow-step="0"]
    .wm-process-runner {

        left:
            calc(16.7% - 7px);

        top: 21px;
    }


    /* Step 02 */

    .wm-process-timeline[data-flow-step="1"]
    .wm-process-runner {

        left:
            calc(50% - 8px);

        top: 21px;
    }


    /* Step 03 */

    .wm-process-timeline[data-flow-step="2"]
    .wm-process-runner {

        left:
            calc(83.3% - 8px);

        top: 21px;
    }


    /* Step 04 */

    .wm-process-timeline[data-flow-step="3"]
    .wm-process-runner {

        left:
            calc(83.3% - 8px);

        top:
            calc(50% + 66px);
    }


    /* Step 05 */

    .wm-process-timeline[data-flow-step="4"]
    .wm-process-runner {

        left:
            calc(50% - 8px);

        top:
            calc(50% + 66px);
    }


    /* Step 06 */

    .wm-process-timeline[data-flow-step="5"]
    .wm-process-runner {

        left:
            calc(16.7% - 7px);

        top:
            calc(50% + 66px);
    }


    /* =========================================
       STEP ACTIVE MOTION
    ========================================= */

    .wm-process-step {
        position: relative;

        z-index: 3;
    }


    .wm-process-step-marker {

        transition:
            transform .45s
            cubic-bezier(.22, 1, .36, 1),

            box-shadow .45s ease,

            background .45s ease;
    }


    .wm-process-card {

        transition:
            transform .45s
            cubic-bezier(.22, 1, .36, 1),

            border-color .4s ease,

            box-shadow .4s ease;
    }


    .wm-process-step.is-active
    .wm-process-step-marker {

        transform:
            scale(1.12);

        box-shadow:
            0 0 0 8px
            rgba(0, 208, 132, 0.09),

            0 13px 32px
            rgba(0, 208, 132, 0.3);
    }


    .wm-process-step.is-active
    .wm-process-card {

        transform:
            translateY(-7px);

        border-color:
            rgba(0, 208, 132, 0.34);

        box-shadow:
            0 23px 55px
            rgba(18, 46, 62, 0.13);
    }


    .wm-process-step.is-active
    .wm-process-icon {

        animation:
            wmProcessIconPop
            .55s
            cubic-bezier(.22, 1, .36, 1);
    }


    @keyframes wmProcessIconPop {

        0% {
            transform:
                scale(.82);
        }

        60% {
            transform:
                scale(1.1);
        }

        100% {
            transform:
                scale(1);
        }

    }

}