/* iOSS homepage — below-the-fold section styles, deferred for LCP.
   Extracted verbatim from the inline <style> in Page id=3 body_content.
   Loaded non-blocking via media=print onload in the homepage <head>. */
            .feature-card {
                height: 100%;
                padding: 3px;
                background-color: var(--color-bg);
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-md);
                transition: box-shadow 0.2s ease, transform 0.2s ease;
            }

            .feature-card:hover {
                transform: translateY(-4px);
                box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
            }

            .feature-card-img {
                border-radius: var(--radius-sm);
                overflow: hidden;
                aspect-ratio: 11 / 10;
            }

            .feature-card-img img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }

            .feature-card-title {
                font-family: var(--font-body);
                font-size: 18px;
                font-weight: 600;
                letter-spacing: -0.3px;
                line-height: 1.4em;
                margin: 20px 10px 8px;
            }

            .feature-card-text {
                color: var(--color-text-muted);
                font-size: 14px;
                line-height: 1.7em;
                margin: 0 10px 10px;
            }

            .feature-card-mock-card .feature-card-title {
                margin: 18px 10px 8px;
            }

            .feature-mock {
                position: relative;
                aspect-ratio: 11 / 10;
                border-radius: var(--radius-sm);
                overflow: hidden;
                padding: 16px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                transition: transform 0.3s ease;
            }

            .feature-card-mock-card:hover .feature-mock {
                transform: translateY(-2px);
            }

            .feature-mock-code {
                background: linear-gradient(150deg, rgba(70, 108, 243, 0.12), rgba(70, 108, 243, 0.03));
            }

            .feature-mock-strategy {
                background: linear-gradient(150deg, rgba(248, 61, 105, 0.1), rgba(248, 61, 105, 0.03));
            }

            .feature-mock-chat {
                background: linear-gradient(150deg, rgba(33, 204, 238, 0.12), rgba(33, 204, 238, 0.03));
                gap: 8px;
            }

            .feature-mock-analytics {
                background: linear-gradient(150deg, rgba(124, 92, 255, 0.12), rgba(124, 92, 255, 0.03));
            }

            .bar {
                display: block;
                height: 7px;
                border-radius: 4px;
                background: rgba(24, 24, 24, 0.14);
            }

            .w-20 {
                width: 20%;
            }

            .w-24 {
                width: 24%;
            }

            .w-28 {
                width: 28%;
            }

            .w-32 {
                width: 32%;
            }

            .w-36 {
                width: 36%;
            }

            .w-40 {
                width: 40%;
            }

            .w-44 {
                width: 44%;
            }

            .w-50 {
                width: 50%;
            }

            .w-52 {
                width: 52%;
            }

            .w-60 {
                width: 60%;
            }

            .w-70 {
                width: 70%;
            }

            .w-85 {
                width: 85%;
            }

            .mock-window {
                background: #fff;
                border-radius: 10px;
                box-shadow: 0 10px 26px rgba(24, 24, 24, 0.1);
                overflow: hidden;
            }

            .mock-window-bar {
                display: flex;
                align-items: center;
                gap: 5px;
                padding: 8px 10px;
                border-bottom: 1px solid var(--color-border-soft);
            }

            .mock-dot {
                width: 7px;
                height: 7px;
                border-radius: 50%;
            }

            .mock-dot-red {
                background: #ff5f57;
            }

            .mock-dot-yellow {
                background: #febc2e;
            }

            .mock-dot-green {
                background: #28c840;
            }

            .mock-window-title {
                margin-left: 6px;
                font-size: 9px;
                color: var(--color-text-muted);
                font-family: var(--font-body);
            }

            .mock-code-body {
                padding: 10px 11px 12px;
                display: flex;
                flex-direction: column;
                gap: 4px;
                font-family: "SFMono-Regular", "Geist Mono", Consolas, "Courier New", monospace;
                font-size: 10px;
                line-height: 1.5;
            }

            .code-line {
                display: flex;
                align-items: baseline;
                gap: 8px;
                white-space: nowrap;
            }

            .code-line .ln {
                font-size: 9px;
                color: rgba(24, 24, 24, 0.28);
                width: 8px;
                text-align: right;
                flex-shrink: 0;
            }

            .code-line code {
                color: var(--color-text);
            }

            .code-line code.ind {
                padding-left: 14px;
            }

            .c-key {
                color: #a855f7;
            }

            .c-mod {
                color: var(--color-accent);
            }

            .c-fn {
                color: #1470ef;
            }

            .c-var {
                color: #e0792b;
            }

            .c-arg {
                color: var(--color-pink);
            }

            .c-num {
                color: #16a34a;
            }

            .cursor {
                display: inline-block;
                width: 5px;
                height: 11px;
                margin-left: 1px;
                transform: translateY(1px);
                background: var(--color-accent);
                animation: mockBlink 1.1s step-end infinite;
            }

            @keyframes mockBlink {

                0%,
                100% {
                    opacity: 1;
                }

                50% {
                    opacity: 0;
                }
            }

            .mock-panel {
                background: #fff;
                border-radius: 12px;
                padding: 12px 14px;
                box-shadow: 0 10px 26px rgba(24, 24, 24, 0.08);
            }

            .mock-panel-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                margin-bottom: 12px;
            }

            .mock-panel-title {
                font-size: 11px;
                font-weight: 600;
                font-family: var(--font-body);
                color: var(--color-text);
            }

            .mock-tag {
                font-size: 9px;
                font-weight: 600;
                padding: 2px 7px;
                border-radius: var(--radius-pill);
            }

            .mock-tag-pink {
                color: var(--color-pink);
                background: rgba(248, 61, 105, 0.12);
            }

            .mock-steps {
                list-style: none;
                margin: 0;
                padding: 0;
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .mock-step {
                display: flex;
                align-items: center;
                gap: 9px;
                position: relative;
            }

            .mock-step:not(:last-child)::before {
                content: "";
                position: absolute;
                left: 4px;
                top: 13px;
                width: 1.5px;
                height: 18px;
                background: var(--color-border);
            }

            .step-node {
                width: 9px;
                height: 9px;
                border-radius: 50%;
                border: 2px solid var(--color-border);
                background: #fff;
                flex-shrink: 0;
                z-index: 1;
            }

            .mock-step.done .step-node {
                border-color: var(--color-pink);
                background: var(--color-pink);
            }

            .mock-step.active .step-node {
                border-color: var(--color-pink);
                box-shadow: 0 0 0 3px rgba(248, 61, 105, 0.16);
            }

            .step-label {
                font-size: 10px;
                font-weight: 500;
                font-family: var(--font-body);
                color: var(--color-text);
                flex: 1;
            }

            .mock-step:not(.done):not(.active) .step-label {
                color: var(--color-text-muted);
            }

            .step-meta {
                font-size: 8.5px;
                font-weight: 600;
                color: var(--color-text-muted);
                opacity: 0.7;
            }

            .mock-step.done .step-meta {
                color: var(--color-pink);
                opacity: 1;
            }

            .step-meta-active {
                color: var(--color-pink);
                background: rgba(248, 61, 105, 0.12);
                padding: 1px 6px;
                border-radius: var(--radius-pill);
                opacity: 1;
            }

            .chat-bubble {
                max-width: 82%;
                padding: 8px 11px;
                border-radius: 14px;
                box-shadow: 0 6px 16px rgba(24, 24, 24, 0.06);
                font-family: var(--font-body);
                font-size: 10.5px;
                line-height: 1.4;
            }

            .chat-in {
                align-self: flex-start;
                background: #fff;
                color: var(--color-text);
                border-bottom-left-radius: 4px;
            }

            .chat-out {
                align-self: flex-end;
                background: var(--color-cyan);
                color: #06363f;
                border-bottom-right-radius: 4px;
            }

            .chat-chips {
                display: flex;
                gap: 4px;
                margin-top: 6px;
            }

            .chat-chip {
                font-size: 8px;
                font-weight: 600;
                padding: 2px 6px;
                border-radius: var(--radius-pill);
            }

            .chat-chip-pos {
                background: rgba(255, 255, 255, 0.85);
                color: #0a7d2e;
            }

            .chat-typing {
                display: flex;
                flex-direction: row;
                gap: 4px;
                padding: 11px;
            }

            .typing-dot {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: rgba(24, 24, 24, 0.3);
                animation: typingBounce 1.2s infinite ease-in-out;
            }

            .typing-dot:nth-child(2) {
                animation-delay: 0.2s;
            }

            .typing-dot:nth-child(3) {
                animation-delay: 0.4s;
            }

            @keyframes typingBounce {

                0%,
                60%,
                100% {
                    transform: translateY(0);
                    opacity: 0.4;
                }

                30% {
                    transform: translateY(-3px);
                    opacity: 1;
                }
            }

            .mock-panel-head-col {
                flex-direction: column;
                align-items: flex-start;
                gap: 3px;
                margin-bottom: 10px;
            }

            .mock-eyebrow {
                font-size: 9px;
                font-weight: 500;
                font-family: var(--font-body);
                color: var(--color-text-muted);
            }

            .mock-stat-row {
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .feature-mock-analytics .mock-stat {
                font-size: 17px;
                font-weight: 700;
                font-family: var(--font-head);
                letter-spacing: -0.5px;
                color: var(--color-text);
            }

            .mock-trend {
                font-size: 9px;
                font-weight: 600;
                color: #16a34a;
                background: rgba(40, 200, 100, 0.12);
                padding: 2px 7px;
                border-radius: var(--radius-pill);
            }

            .mock-chart {
                display: flex;
                align-items: flex-end;
                justify-content: space-between;
                gap: 6px;
                height: 54px;
                margin-top: 4px;
            }

            .mock-chart-axis {
                display: flex;
                justify-content: space-between;
                gap: 6px;
                margin-top: 6px;
            }

            .mock-chart-axis span {
                flex: 1;
                text-align: center;
                font-size: 7.5px;
                font-family: var(--font-body);
                color: var(--color-text-muted);
                opacity: 0.7;
            }

            .chart-bar {
                flex: 1;
                border-radius: 4px 4px 2px 2px;
                background: rgba(124, 92, 255, 0.28);
                transition: height 0.3s ease;
            }

            .chart-bar-hi {
                background: #7c5cff;
                box-shadow: 0 4px 12px rgba(124, 92, 255, 0.4);
            }

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

                .blink,
                .typing-dot {
                    animation: none;
                }
            }

            #power-pack {
                background: var(--bg-1);
            }

            /* ABOUT iOSS — dark curved panel (white + red on black) */
            .about-section {
                position: relative;
                z-index: 2;
                height: 320vh;
            }

            @media (max-width: 767.98px) {
                .about-section {
                    height: 170vh;
                }
            }

            .about-panel {
                position: relative;
                padding: 0 30px;
                overflow: hidden;
            }

            .about-bg {
                position: absolute;
                inset: 0 24px;
                background: var(--color-text);
                border-radius: 32px;
                overflow: hidden;
                z-index: 0;
            }

            .about-inner {
                position: relative;
                z-index: 2;
                padding: 66px 0;
            }

            /* VIDEO TAKEOVER — when the About top pins, the screen fades to black, the
                       video pops up from the bottom and fills it while the content shrinks
                       back behind. Holds full-screen, then exits full-screen on unpin. */
            .about-pin {
                position: sticky;
                top: 0;
                min-height: 100vh;
                height: auto;
                overflow: hidden;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .about-content {
                position: relative;
                z-index: 1;
                width: 100%;
                transform-origin: 50% 50%;
                will-change: transform, opacity;
            }

            .about-black {
                position: absolute;
                inset: 0;
                background: #000;
                opacity: 0;
                z-index: 2;
                pointer-events: none;
            }

            .about-video {
                position: absolute;
                inset: 0;
                z-index: 3;
                overflow: hidden;
                background: #000;
                transform: translateY(100%) scale(0.4);
                transform-origin: 50% 100%;
                will-change: transform;
            }

            .about-video video {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                border: 0;
                border-radius: inherit;
                pointer-events: none;
            }

            .about-video iframe {
                position: absolute;
                top: 50%;
                left: 50%;
                width: 177.78vh;
                height: 56.25vw;
                min-width: 100%;
                min-height: 100%;
                transform: translate(-50%, -50%) scale(1.32);
                border: 0;
                pointer-events: none;
            }

            .about-layout {
                display: flex;
                align-items: center;
                gap: 56px;
            }

            .about-main {
                flex: 1.1 1 0;
                min-width: 0;
            }

            .about-main .section-title {
                font-size: 40px;
                margin-bottom: 16px;
                color: #fff;
            }

            .about-main .section-title .primary-text {
                color: var(--color-accent-2);
            }

            .about-main .section-subtitle {
                margin-bottom: 28px;
                color: rgba(255, 255, 255, 0.72);
            }

            .about-visual {
                flex: 0.95 1 0;
                min-width: 0;
                display: flex;
                flex-direction: column;
                gap: 12px;
            }

            /* Modern glass bento — frosted tiles, gradient numbers, one accent hero tile */
            .about-bento {
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 14px;
            }

            .about-tile {
                position: relative;
                display: flex;
                flex-direction: column;
                justify-content: center;
                min-height: 152px;
                padding: 24px;
                border-radius: 22px;
                overflow: hidden;
                background: rgba(255, 255, 255, 0.045);
                border: 1px solid rgba(255, 255, 255, 0.08);
                backdrop-filter: blur(16px) saturate(140%);
                -webkit-backdrop-filter: blur(16px) saturate(140%);
                box-shadow: 0 2px 16px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
                transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.35s ease, border-color 0.35s ease;
            }

            /* Corner accent glow removed per request — stat tiles are flat now. */
            .about-tile:not(.about-tile--img):not(.about-tile--pink)::before {
                content: none;
            }

            .about-tile:hover {
                transform: translateY(-4px);
                border-color: rgba(225, 70, 70, 0.35);
                box-shadow: 0 20px 44px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.09);
            }

            .about-tile .t-num {
                position: relative;
                font-family: var(--font-head);
                font-size: 46px;
                font-weight: 700;
                letter-spacing: -2px;
                line-height: 1;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                -webkit-background-clip: text;
                background-clip: text;
                -webkit-text-fill-color: transparent;
            }

            .about-tile .t-lbl {
                position: relative;
                margin-top: 10px;
                font-size: 13px;
                font-weight: 500;
                letter-spacing: 0.2px;
                line-height: 1.45;
                color: rgba(255, 255, 255, 0.6);
            }

            /* Hero accent tile — gradient fill instead of the old flat pink block */
            .about-tile--pink {
                background: linear-gradient(150deg, var(--color-accent-2), var(--color-accent));
                border-color: transparent;
                box-shadow: 0 12px 34px rgba(225, 70, 70, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.18);
            }

            .about-tile--pink::after {
                content: "";
                position: absolute;
                inset: 0;
                background: radial-gradient(circle at 28% 0%, rgba(255, 255, 255, 0.28), transparent 58%);
                pointer-events: none;
            }

            .about-tile--pink .t-num {
                background: none;
                -webkit-text-fill-color: #fff;
                color: #fff;
            }

            .about-tile--pink .t-lbl {
                color: rgba(255, 255, 255, 0.92);
            }

            /* former "light"/"dark" tiles now share the unified glass look */
            .about-tile--img {
                padding: 0;
                border-color: rgba(255, 255, 255, 0.1);
            }

            .about-tile--img img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
                transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
            }

            .about-tile--img:hover img {
                transform: scale(1.06);
            }

            .about-tile--img::after {
                content: "";
                position: absolute;
                inset: 0;
                background: linear-gradient(180deg, rgba(14, 14, 16, 0) 40%, rgba(14, 14, 16, 0.45));
                pointer-events: none;
            }

            .about-badges {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;
            }

            .about-badge {
                display: flex;
                align-items: center;
                gap: 13px;
                padding: 16px;
                background: rgba(255, 255, 255, 0.04);
                border: 1.5px solid rgba(255, 255, 255, 0.12);
                border-radius: var(--radius-md);
                transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
            }

            .about-badge:hover {
                transform: translateY(-3px);
                box-shadow: 0 14px 30px rgba(0, 0, 0, 0.3);
                border-color: rgba(225, 70, 70, 0.4);
            }

            .about-badge-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 42px;
                height: 42px;
                flex-shrink: 0;
                border-radius: 12px;
                font-size: 17px;
                color: #fff;
                background: linear-gradient(140deg, var(--color-accent-2), var(--color-accent));
                box-shadow: 0 6px 14px rgba(225, 70, 70, 0.3);
            }

            .about-badge span {
                font-size: 13.5px;
                font-weight: 600;
                line-height: 1.3;
                color: #fff;
            }

            @media (max-width: 1199.98px) {
                .about-bg {
                    inset: 0 10px;
                    border-radius: 20px;
                }
            }

            @media (max-width: 991.98px) {
                .about-inner {
                    padding: 52px 0;
                }

                .about-layout {
                    flex-direction: column-reverse;
                    gap: 36px;
                    align-items: stretch;
                }

                .about-main {
                    text-align: center;
                }

                /* The heading carries .text-start (text-align:left !important);
                   re-center it on mobile so it matches the centered body copy. */
                .about-main .section-title.text-start {
                    text-align: center !important;
                }

                .about-main .key-tools-heading,
                .about-main .pill-badge {
                    justify-content: center;
                }
            }

            @media (max-width: 767.98px) {
                .about-panel {
                    padding: 0 20px;
                }

                .about-bg {
                    inset: 0 5px;
                    border-radius: 0;
                }
            }

            @media (max-width: 575.98px) {
                .about-tile {
                    padding: 22px 18px;
                }

                .about-tile .t-num {
                    /* scale the figure to the narrow tile so the trailing "+" is
                       never clipped by the tile's overflow:hidden on small phones */
                    font-size: clamp(28px, 9vw, 40px);
                    letter-spacing: -1px;
                    white-space: nowrap;
                }

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

            /* ===== History scrubber (horizontal year timeline) ===== */
            .th-scrubber {
                position: relative;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 14px;
                max-width: 880px;
                margin: 0 auto;
            }

            .th-arrow {
                flex: 0 0 auto;
                display: flex;
                align-items: center;
                justify-content: center;
                width: 48px;
                height: 48px;
                border-radius: 50%;
                border: 1.5px solid var(--color-border);
                background: var(--color-bg);
                color: var(--color-accent);
                cursor: pointer;
                box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
                transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease, opacity 0.25s ease;
                z-index: 3;
            }

            .th-arrow:hover:not(:disabled) {
                background: var(--color-accent);
                color: #fff;
                transform: translateY(-2px);
            }

            .th-arrow:disabled {
                cursor: default;
                opacity: 0.3;
                color: var(--color-text-muted);
                border-color: var(--color-border-soft);
                box-shadow: none;
            }

            .th-stage {
                flex: 1 1 auto;
                min-width: 0;
                text-align: center;
            }

            /* --- top: year badge --- */
            .th-head {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 8px;
                margin-bottom: 18px;
            }

            .th-badge {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                min-width: 96px;
                font-family: var(--font-head);
                font-size: 19px;
                font-weight: 700;
                letter-spacing: 0.4px;
                color: #fff;
                background: var(--color-accent);
                border-radius: var(--radius-pill);
                padding: 8px 22px;
                box-shadow: 0 10px 26px rgba(187, 45, 59, 0.28);
                transition: transform 0.3s ease;
            }

            .th-eyebrow {
                font-size: 12px;
                font-weight: 600;
                letter-spacing: 1.4px;
                text-transform: uppercase;
                color: var(--color-text-muted);
            }

            /* --- ruler --- */
            .th-ruler {
                position: relative;
                width: 100%;
                height: 116px;
                overflow: hidden;
                -webkit-user-select: none;
                user-select: none;
                cursor: grab;
                touch-action: pan-y;
            }

            .th-ruler.is-dragging {
                cursor: grabbing;
            }

            /* center highlight capsule */
            .th-cursor {
                position: absolute;
                top: 8px;
                left: 50%;
                transform: translateX(-50%);
                width: 92px;
                height: 100px;
                border-radius: 22px;
                background: var(--color-bg);
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
                border: 1.5px solid var(--color-border-soft);
                z-index: 1;
                pointer-events: none;
            }


            .th-track {
                position: absolute;
                top: 0;
                left: 0;
                height: 100%;
                display: flex;
                align-items: flex-start;
                z-index: 2;
                will-change: transform;
                transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
            }

            .th-ruler.is-dragging .th-track {
                transition: none;
            }

            .th-stop {
                position: relative;
                flex: 0 0 auto;
                width: 92px;
                display: flex;
                flex-direction: column;
                align-items: center;
                padding-top: 22px;
                pointer-events: none;
            }

            .th-stop-year {
                font-family: var(--font-head);
                font-size: 17px;
                font-weight: 600;
                color: var(--color-text-muted);
                opacity: 0.4;
                transition: color 0.3s ease, opacity 0.3s ease, transform 0.3s ease, font-size 0.3s ease;
            }

            .th-stop.is-active .th-stop-year {
                color: var(--color-text);
                opacity: 1;
                font-size: 24px;
                transform: translateY(-2px);
                font-weight: 700;
            }

            .th-stop-tick {
                margin-top: 16px;
                width: 2px;
                height: 22px;
                border-radius: 2px;
                background: var(--color-border);
                transition: height 0.3s ease, background 0.3s ease;
            }

            .th-stop.is-active .th-stop-tick {
                height: 40px;
                background: var(--color-accent);
            }

            /* edge fades */
            .th-ruler-fade {
                position: absolute;
                top: 0;
                bottom: 0;
                width: 90px;
                z-index: 3;
                pointer-events: none;
            }

            .th-ruler-fade-l {
                left: 0;
                background: linear-gradient(90deg, var(--color-bg) 10%, transparent);
            }

            .th-ruler-fade-r {
                right: 0;
                background: linear-gradient(270deg, var(--color-bg) 10%, transparent);
            }

            /* --- bottom: content --- */
            .th-content {
                max-width: 560px;
                margin: 18px auto 0;
                transition: opacity 0.3s ease, transform 0.3s ease;
            }

            .th-content.is-switching {
                opacity: 0;
                transform: translateY(8px);
            }

            .th-content-title {
                font-family: var(--font-body);
                font-size: 20px;
                font-weight: 600;
                letter-spacing: -0.3px;
                line-height: 1.3;
                margin: 0 0 8px;
            }

            .th-content-text {
                line-height: 1.65;
                color: var(--color-text-muted);
                margin: 0;
            }

            @media (max-width: 767.98px) {
                .th-scrubber {
                    gap: 6px;
                }

                .th-arrow {
                    width: 40px;
                    height: 40px;
                }

                .th-ruler {
                    height: 104px;
                }

                .th-cursor {
                    width: 78px;
                    height: 92px;
                }

                .th-stop {
                    width: 78px;
                }

                .th-ruler-fade {
                    width: 50px;
                }

                .th-content-title {
                    font-size: 18px;
                }
            }

            hr {
                border: none;
                height: 2px;
                margin: 0;
                background-color: rgb(108 111 118 / 22%);
            }

            .enterprise-layout {
                display: flex;
                align-items: stretch;
                gap: 28px;
            }

            .enterprise-main {
                flex: 1.15 1 0;
                min-width: 0;
            }

            .enterprise-main .section-title {
                font-size: 30px;
                margin-bottom: 14px;
            }

            .enterprise-main .section-subtitle {
                font-size: 15px;
            }

            .enterprise-eyebrow {
                display: block;
                margin: 26px 0 16px;
                font-size: 12px;
                font-weight: 600;
                letter-spacing: 1.5px;
                text-transform: uppercase;
                color: var(--color-text-muted);
                position: relative;
                padding-bottom: 14px;
            }

            .enterprise-eyebrow::after {
                content: "";
                position: absolute;
                left: 0;
                bottom: 0;
                width: 100%;
                height: 1px;
                background: var(--color-border-soft);
            }

            .enterprise-grid {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;
            }

            .ent-box {
                display: flex;
                align-items: flex-start;
                gap: 14px;
                padding: 16px 16px;
                background: var(--color-surface);
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-md);
                transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
            }

            .ent-box-wide {
                grid-column: 1 / -1;
            }

            .ent-box:hover {
                transform: translateY(-3px);
                box-shadow: 0 14px 30px rgba(0, 0, 0, 0.07);
                border-color: rgba(225, 70, 70, 0.25);
                background: var(--color-bg);
            }

            .ent-icon {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 40px;
                flex-shrink: 0;
                border-radius: 11px;
                color: var(--color-accent-2);
                background: linear-gradient(140deg, rgba(225, 70, 70, 0.13), rgba(225, 70, 70, 0.04));
                box-shadow: inset 0 0 0 1px rgba(225, 70, 70, 0.12);
                transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease, box-shadow 0.25s ease;
            }

            .ent-box:hover .ent-icon {
                color: #fff;
                background: linear-gradient(140deg, var(--color-accent-2), var(--color-accent));
                box-shadow: 0 8px 18px rgba(225, 70, 70, 0.3);
            }

            .ent-title {
                font-family: var(--font-body);
                font-size: 14.5px;
                font-weight: 600;
                letter-spacing: -0.2px;
                line-height: 1.3;
                margin: 0 0 3px;
            }

            .ent-text {
                color: var(--color-text-muted);
                font-size: 12.5px;
                line-height: 1.55;
                margin: 0;
            }

            .key-tools-section {
                background: var(--color-surface);
            }

            .enterprise-visual {
                position: relative;
                flex: 0.95 1 0;
                min-width: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                background: var(--color-surface);
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-lg);
                padding: 32px;
                overflow: hidden;
            }

            .enterprise-blob {
                position: absolute;
                top: -60px;
                left: -40px;
                width: 320px;
                height: 220px;
                border-radius: 50%;
                background: radial-gradient(ellipse at center, rgb(255 227 227), rgba(70, 108, 243, 0) 70%);
                filter: blur(20px);
                pointer-events: none;
            }

            .enterprise-photo {
                position: relative;
                width: 100%;
                max-width: 360px;
                aspect-ratio: 1 / 1;
                border-radius: var(--radius-lg);
                overflow: hidden;
                background: linear-gradient(150deg, #e9ecf2, #dfe3ea);
                box-shadow: 0 20px 50px rgba(14, 14, 16, 0.12);
            }

            .enterprise-photo img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                display: block;
            }

            @media (max-width: 991.98px) {
                .enterprise-layout {
                    flex-direction: column;
                }

                .enterprise-visual {
                    min-height: 300px;
                }
            }

            @media (max-width: 575.98px) {
                .enterprise-grid {
                    grid-template-columns: 1fr;
                }

                .ent-box-wide {
                    grid-column: auto;
                }

                .enterprise-main {
                    padding: 28px 22px;
                }
            }

            .why-layout {
                display: flex;
                align-items: flex-start;
                gap: 56px;
            }

            .why-intro {
                position: sticky;
                top: 110px;
                flex: 1 1 0;
                max-width: 380px;
            }

            .why-intro .section-title {
                margin-top: 4px;
            }

            .why-list {
                flex: 1.3 1 0;
                display: flex;
                flex-direction: column;
            }

            .why-item {
                position: relative;
                display: flex;
                align-items: flex-start;
                gap: 24px;
                padding: 26px 22px;
                border-top: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-lg);
                transition: background 0.3s ease, transform 0.3s ease;
            }

            .why-item:first-child {
                border-top: none;
            }

            .why-item::before {
                content: "";
                position: absolute;
                left: 0;
                top: 50%;
                width: 3px;
                height: 0;
                border-radius: 3px;
                background: var(--color-accent);
                transform: translateY(-50%);
                transition: height 0.35s var(--ease);
            }

            .why-item:hover {
                background: var(--color-surface);
                transform: translateX(4px);
            }

            .why-item:hover::before {
                height: 60%;
            }

            .why-num {
                font-family: var(--font-head);
                font-size: 34px;
                font-weight: 700;
                line-height: 1;
                letter-spacing: -1.5px;
                color: var(--color-accent);
                min-width: 52px;
                transition: transform 0.3s ease;
            }

            .why-item:hover .why-num {
                transform: scale(1.08);
            }

            .why-body {
                flex: 1;
            }

            .why-title {
                font-family: var(--font-body);
                font-size: 19px;
                font-weight: 600;
                letter-spacing: -0.3px;
                margin: 0 0 8px;
            }

            .why-text {
                color: var(--color-text-muted);
                font-size: 14px;
                line-height: 1.7;
                margin: 0;
            }

            @media (max-width: 991.98px) {
                .why-layout {
                    flex-direction: column;
                    gap: 36px;
                }

                .why-intro {
                    position: static;
                    max-width: 620px;
                }

                .why-list {
                    width: 100%;
                }
            }

            .key-tools-layout {
                display: flex;
                flex-flow: row;
                align-items: flex-start;
                gap: 44px;
                max-width: 1200px;
                margin: 0 auto;
            }

            .key-tools-intro {
                position: sticky;
                top: 110px;
                flex: 1 0 0;
                max-width: 400px;
                display: flex;
                flex-direction: column;
                gap: 56px;
            }

            .key-tools-heading {
                display: flex;
                flex-direction: column;
                align-items: flex-start;
                gap: 16px;
            }

            .key-tools-heading .section-title {
                font-size: clamp(1.8rem, 3.4vw, 1.8rem);
                margin: 0;
            }

            .text-start {
                text-align: left !important;
            }

            .key-tools-nav {
                position: relative;
                display: flex;
                flex-direction: column;
                gap: 20px;
                padding-left: 22px;
            }

            .kt-progress {
                position: absolute;
                left: 0;
                top: 0;
                bottom: 0;
                width: 2px;
                /* background-color: var(--color-border); */
                border-radius: 6px;
                overflow: hidden;
            }

            .kt-progress-fill {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 33.33%;
                background-color: var(--color-accent);
                border-radius: 6px;
                transition: transform 0.45s cubic-bezier(0.44, 0, 0.18, 1);
            }

            .kt-link {
                font-family: var(--font-body);
                font-size: 20px;
                font-weight: 500;
                line-height: 1.7em;
                color: var(--color-text-muted);
                text-decoration: none;
                transition: color 0.3s ease, opacity 0.3s ease;
                opacity: 0.55;
            }

            .kt-link:hover {
                color: var(--color-text);
            }

            .kt-link.active {
                color: var(--color-accent);
                opacity: 1;
            }

            .key-tools-cards {
                flex: none;
                width: 100%;
                max-width: 639px;
                display: flex;
                flex-direction: column;
                gap: 40px;
                padding-top: 24px;
            }

            .kt-card {
                display: flex;
                flex-direction: column;
                gap: 28px;
                padding-bottom: 48px;
                border-bottom: 1.5px solid var(--color-border-soft);
                scroll-margin-top: 120px;
            }

            .kt-card:last-child {
                border-bottom: none;
                padding-bottom: 0;
            }

            .kt-card-text {
                max-width: 472px;
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .kt-card-text h4 {
                font-size: 24px;
                font-weight: 500;
                letter-spacing: -1px;
                line-height: 1.4em;
                margin: 0;
            }

            .kt-card-text p {
                color: var(--color-text-muted);
                font-size: 16px;
                line-height: 1.7em;
                margin: 0;
            }

            .kt-card-media {
                position: relative;
                aspect-ratio: 1.40132;
                background-color: var(--color-surface);
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-md);
                overflow: hidden;
                padding: 40px 0 0 40px;
            }

            .kt-card-media img {
                display: block;
                width: 100%;
                height: 100%;
                object-fit: cover;
                object-position: left top;
                border: 1px solid var(--color-border);
                border-radius: 8px;
            }

            .kt-media-diagram {
                padding: 0;
                display: flex;
                align-items: center;
                justify-content: center;
                background: linear-gradient(150deg, #fbfbfd, #f3f4f8);
            }

            .pm {
                width: 100%;
                height: 100%;
                padding: 26px 30px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                gap: 16px;
                font-family: var(--font-body);
            }

            .pm b {
                font-weight: 700;
            }

            .pm-tags {
                display: flex;
                flex-wrap: wrap;
                gap: 7px;
                justify-content: center;
            }

            .pm-chip {
                font-size: 11px;
                font-weight: 600;
                padding: 4px 12px;
                border-radius: var(--radius-pill);
                background: #fff;
                color: var(--color-text-muted);
                border: 1.5px solid var(--color-border);
            }

            .pm-chip.is-on {
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                border-color: transparent;
                box-shadow: 0 6px 14px rgba(225, 70, 70, 0.3);
            }

            .pm-tree {
                position: relative;
                display: flex;
                flex-direction: column;
                gap: 22px;
                padding: 6px 0;
            }

            .tree-row {
                display: flex;
                justify-content: center;
                gap: 14%;
                position: relative;
            }

            .tree-row-3 {
                gap: 6%;
            }

            .tree-node {
                width: 30px;
                height: 30px;
                border-radius: 50%;
                background: #fff;
                border: 2px solid var(--color-border);
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 10px;
                font-weight: 700;
                color: var(--color-text-muted);
                z-index: 1;
            }

            .tree-node.tree-root {
                width: 44px;
                height: 44px;
                font-size: 12px;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                border-color: transparent;
                box-shadow: 0 8px 18px rgba(225, 70, 70, 0.3);
            }

            .tree-row::before {
                content: "";
                position: absolute;
                left: 25%;
                right: 25%;
                top: -16px;
                height: 16px;
                border: 2px solid var(--color-border);
                border-bottom: none;
                border-radius: 8px 8px 0 0;
            }

            .tree-row-1::before {
                display: none;
            }

            .pm-foot {
                display: flex;
                justify-content: center;
                gap: 10px;
                flex-wrap: wrap;
            }

            .pm-foot-stat {
                font-size: 11px;
                color: var(--color-text-muted);
                background: #fff;
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-pill);
                padding: 4px 12px;
            }

            .pm-foot-stat b {
                color: var(--color-text);
            }

            .pm-foot-pay b {
                color: #16a34a;
            }

            .pm-time {
                flex-direction: row;
                align-items: stretch;
                gap: 18px;
            }

            .pm-eyebrow {
                font-size: 11px;
                font-weight: 500;
                color: var(--color-text-muted);
            }

            .pm-time-main {
                flex: 1;
                background: #fff;
                border-radius: var(--radius-md);
                padding: 18px;
                box-shadow: 0 10px 24px rgba(24, 24, 24, 0.06);
                display: flex;
                flex-direction: column;
                gap: 6px;
                justify-content: center;
            }

            .pm-timer {
                font-family: var(--font-head);
                font-size: 38px;
                font-weight: 700;
                letter-spacing: -1px;
                line-height: 1;
                color: var(--color-text);
                display: inline-flex;
                align-items: center;
                gap: 10px;
            }

            .pm-timer-rec {
                width: 11px;
                height: 11px;
                border-radius: 50%;
                background: var(--color-accent-2);
                animation: pmPulse 1.5s ease-in-out infinite;
            }

            .pm-time-task {
                font-size: 12px;
                color: var(--color-text-muted);
            }

            .pm-time-side {
                flex: 1;
                background: #fff;
                border-radius: var(--radius-md);
                padding: 16px 18px;
                box-shadow: 0 10px 24px rgba(24, 24, 24, 0.06);
                display: flex;
                flex-direction: column;
                gap: 5px;
                justify-content: center;
            }

            .pm-prod-row {
                display: flex;
                justify-content: space-between;
                font-size: 11px;
                color: var(--color-text-muted);
            }

            .pm-prod-row b {
                color: var(--color-text);
            }

            .pm-meter {
                height: 6px;
                border-radius: 4px;
                background: var(--color-border);
                overflow: hidden;
                margin-bottom: 8px;
            }

            .pm-meter span {
                display: block;
                height: 100%;
                border-radius: 4px;
                background: #16a34a;
            }

            .pm-meter-amber span {
                background: #f0a020;
            }

            .pm-meter-grey span {
                background: var(--color-text-muted);
            }

            .pm-browser {
                width: 100%;
                background: #fff;
                border-radius: var(--radius-md);
                overflow: hidden;
                box-shadow: 0 12px 28px rgba(24, 24, 24, 0.08);
            }

            .pm-browser-bar {
                display: flex;
                align-items: center;
                gap: 6px;
                padding: 9px 12px;
                background: var(--color-surface);
                border-bottom: 1px solid var(--color-border-soft);
            }

            .pm-url {
                margin-left: 8px;
                font-size: 10px;
                color: var(--color-text-muted);
                background: #fff;
                border: 1px solid var(--color-border-soft);
                border-radius: var(--radius-pill);
                padding: 2px 10px;
            }

            .pm-blog-body {
                padding: 16px 18px 20px;
                display: flex;
                flex-direction: column;
                gap: 12px;
            }

            .pm-ai-badge {
                align-self: flex-start;
                font-size: 10px;
                font-weight: 600;
                color: var(--color-accent);
                background: rgba(225, 70, 70, 0.1);
                border-radius: var(--radius-pill);
                padding: 4px 11px;
            }

            .pm-blog-h {
                display: block;
                height: 12px;
                width: 65%;
                border-radius: 5px;
                background: var(--color-text);
                opacity: 0.85;
            }

            .pm-blog-cols {
                display: flex;
                gap: 14px;
            }

            .pm-blog-img {
                width: 38%;
                border-radius: 8px;
                background: linear-gradient(135deg, rgba(225, 70, 70, 0.18), rgba(20, 112, 239, 0.16));
                min-height: 56px;
            }

            .pm-blog-lines {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 8px;
                justify-content: center;
            }

            .pm-blog-lines i {
                display: block;
                height: 7px;
                border-radius: 4px;
                background: var(--color-border);
            }

            .pm-blog-lines i.sh {
                width: 70%;
            }

            .pm-bot {
                width: 100%;
                max-width: 380px;
                margin: 0 auto;
                background: #fff;
                border-radius: var(--radius-md);
                box-shadow: 0 12px 28px rgba(24, 24, 24, 0.08);
                overflow: hidden;
            }

            .pm-bot-head {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 12px 14px;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                color: #fff;
            }

            .pm-bot-avatar {
                width: 30px;
                height: 30px;
                border-radius: 50%;
                background: rgba(255, 255, 255, 0.2);
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 11px;
                font-weight: 700;
            }

            .pm-bot-name {
                display: block;
                font-size: 13px;
                font-weight: 600;
            }

            .pm-bot-status {
                display: flex;
                align-items: center;
                gap: 5px;
                font-size: 10px;
                opacity: 0.9;
            }

            .pm-bot-status i {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: #44e08a;
            }

            .pm-bot-body {
                padding: 14px;
                display: flex;
                flex-direction: column;
                gap: 9px;
                background: var(--color-surface);
            }

            .pm-msg {
                max-width: 80%;
                padding: 9px 12px;
                border-radius: 14px;
                font-size: 12px;
                line-height: 1.4;
            }

            .pm-msg-in {
                align-self: flex-start;
                background: #fff;
                color: var(--color-text);
                border-bottom-left-radius: 4px;
                box-shadow: 0 4px 12px rgba(24, 24, 24, 0.05);
            }

            .pm-msg-out {
                align-self: flex-end;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                color: #fff;
                border-bottom-right-radius: 4px;
            }

            .pm-msg-typing {
                display: flex;
                gap: 4px;
                padding: 12px;
            }

            .pm-msg-typing span {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: rgba(24, 24, 24, 0.3);
                animation: typingBounce 1.2s infinite ease-in-out;
            }

            .pm-msg-typing span:nth-child(2) {
                animation-delay: 0.2s;
            }

            .pm-msg-typing span:nth-child(3) {
                animation-delay: 0.4s;
            }

            .pm-lms {
                gap: 14px;
            }

            .pm-course {
                display: flex;
                align-items: center;
                gap: 14px;
                background: #fff;
                border-radius: var(--radius-md);
                padding: 14px 16px;
                box-shadow: 0 8px 20px rgba(24, 24, 24, 0.05);
            }

            .pm-course-thumb {
                width: 48px;
                height: 48px;
                flex-shrink: 0;
                border-radius: 10px;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                color: #fff;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 15px;
            }

            .pm-course-thumb-2 {
                background: linear-gradient(135deg, #1470ef, #6927da);
            }

            .pm-course-info {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 6px;
            }

            .pm-course-title {
                font-size: 13px;
                font-weight: 600;
                color: var(--color-text);
            }

            .pm-progress {
                height: 6px;
                border-radius: 4px;
                background: var(--color-border);
                overflow: hidden;
            }

            .pm-progress span {
                display: block;
                height: 100%;
                border-radius: 4px;
                background: linear-gradient(90deg, var(--color-accent-2), var(--color-accent));
            }

            .pm-course-meta {
                font-size: 10.5px;
                color: var(--color-text-muted);
            }

            .pm-taxi {
                gap: 0;
            }

            .pm-map {
                position: relative;
                height: 130px;
                border-radius: var(--radius-md) var(--radius-md) 0 0;
                background: linear-gradient(0deg, rgba(33, 204, 238, 0.06), rgba(33, 204, 238, 0.06)), repeating-linear-gradient(0deg, transparent 0 22px, rgba(108, 111, 118, 0.07) 22px 23px), repeating-linear-gradient(90deg, transparent 0 22px, rgba(108, 111, 118, 0.07) 22px 23px), #fff;
                border: 1.5px solid var(--color-border-soft);
                border-bottom: none;
                overflow: hidden;
            }

            .pm-route {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                color: var(--color-accent-2);
            }

            .pm-pin {
                position: absolute;
                width: 22px;
                height: 22px;
                border-radius: 50% 50% 50% 0;
                transform: rotate(-45deg);
                display: flex;
                align-items: center;
                justify-content: center;
                color: #fff;
                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
            }

            .pm-pin b {
                transform: rotate(45deg);
                font-size: 10px;
                font-weight: 700;
                line-height: 1;
            }

            .pm-pin-a {
                left: 6%;
                bottom: 12%;
                background: #1470ef;
            }

            .pm-pin-b {
                right: 6%;
                top: 8%;
                background: var(--color-accent-2);
            }

            .pm-car {
                position: absolute;
                left: 46%;
                top: 30%;
                font-size: 20px;
                transform: rotate(-12deg);
                filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.2));
            }

            .pm-ride {
                display: flex;
                justify-content: space-between;
                align-items: center;
                background: #fff;
                border: 1.5px solid var(--color-border-soft);
                border-radius: 0 0 var(--radius-md) var(--radius-md);
                padding: 12px 16px;
            }

            .pm-ride-eta {
                font-size: 12px;
                color: var(--color-text-muted);
            }

            .pm-ride-eta b {
                color: var(--color-text);
            }

            .pm-ride-fare {
                font-family: var(--font-head);
                font-size: 18px;
                font-weight: 700;
                color: var(--color-text);
            }

            .pm-flight {
                background: #fff;
                border-radius: var(--radius-md);
                box-shadow: 0 12px 28px rgba(24, 24, 24, 0.08);
                padding: 20px;
                gap: 16px;
            }

            .pm-flight-route {
                display: flex;
                align-items: center;
                gap: 12px;
            }

            .pm-airport {
                text-align: center;
            }

            .pm-airport b {
                display: block;
                font-family: var(--font-head);
                font-size: 22px;
                font-weight: 700;
                letter-spacing: -0.5px;
                color: var(--color-text);
            }

            .pm-airport span {
                font-size: 10px;
                color: var(--color-text-muted);
            }

            .pm-airport-r {
                text-align: center;
            }

            .pm-flight-path {
                flex: 1;
                position: relative;
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 6px;
            }

            .pm-flight-line {
                width: 100%;
                height: 2px;
                background: repeating-linear-gradient(90deg, var(--color-border) 0 6px, transparent 6px 11px);
                position: relative;
            }

            .pm-plane {
                color: var(--color-accent-2);
                font-size: 15px;
                transform: rotate(45deg);
            }

            .pm-flight-dur {
                font-size: 10px;
                color: var(--color-text-muted);
            }

            .pm-flight-foot {
                display: flex;
                align-items: center;
                justify-content: space-between;
                border-top: 1px solid var(--color-border-soft);
                padding-top: 14px;
            }

            .pm-airline {
                display: flex;
                align-items: center;
                gap: 7px;
                font-size: 12px;
                color: var(--color-text-muted);
            }

            .pm-airline i {
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: var(--color-accent-2);
            }

            .pm-flight-price {
                font-family: var(--font-head);
                font-size: 20px;
                font-weight: 700;
                color: #16a34a;
            }

            .pm-shop {
                gap: 14px;
            }

            .pm-shop-grid {
                display: flex;
                gap: 12px;
            }

            .pm-product {
                flex: 1;
                background: #fff;
                border-radius: var(--radius-md);
                padding: 8px;
                box-shadow: 0 8px 18px rgba(24, 24, 24, 0.05);
                display: flex;
                flex-direction: column;
                gap: 8px;
            }

            .pm-product-img {
                height: 52px;
                border-radius: 8px;
                background: linear-gradient(135deg, rgba(225, 70, 70, 0.2), rgba(225, 70, 70, 0.08));
            }

            .pm-product-img-2 {
                background: linear-gradient(135deg, rgba(20, 112, 239, 0.2), rgba(20, 112, 239, 0.08));
            }

            .pm-product-img-3 {
                background: linear-gradient(135deg, rgba(105, 39, 218, 0.2), rgba(105, 39, 218, 0.08));
            }

            .pm-product-price {
                font-size: 12px;
                font-weight: 700;
                color: var(--color-text);
                text-align: center;
            }

            .pm-cart {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
                background: #fff;
                border-radius: var(--radius-md);
                padding: 12px 16px;
                box-shadow: 0 8px 18px rgba(24, 24, 24, 0.05);
            }

            .pm-cart-label {
                font-size: 12px;
                font-weight: 600;
                color: var(--color-text);
            }

            .pm-cart-total {
                font-size: 12px;
                color: var(--color-text-muted);
            }

            .pm-cart-total b {
                color: var(--color-text);
            }

            .pm-cart-btn {
                font-size: 12px;
                font-weight: 600;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                border-radius: var(--radius-pill);
                padding: 7px 16px;
                box-shadow: 0 6px 14px rgba(225, 70, 70, 0.3);
            }

            @keyframes pmPulse {

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

                50% {
                    opacity: 0.4;
                    transform: scale(0.8);
                }
            }

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

                .pm-timer-rec,
                .pm-msg-typing span {
                    animation: none;
                }
            }

            @media (max-width: 575.98px) {
                .pm {
                    padding: 18px;
                }

                .pm-time {
                    flex-direction: column;
                }

                .pm-timer {
                    font-size: 30px;
                }
            }

            .kt-media-diagram {
                background: radial-gradient(120% 120% at 0% 0%, rgba(225, 70, 70, 0.06), transparent 45%), radial-gradient(120% 120% at 100% 100%, rgba(20, 112, 239, 0.06), transparent 45%), linear-gradient(150deg, #fbfbfd, #eef0f5);
            }

            .pm {
                justify-content: center;
                gap: 14px;
            }

            .pm-bar {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 10px;
            }

            .pm-bar-title {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                font-size: 12px;
                font-weight: 700;
                color: var(--color-text);
            }

            .pm-bar-dot {
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                box-shadow: 0 0 0 3px rgba(225, 70, 70, 0.14);
            }

            .pm-bar-date,
            .pm-streak,
            .pm-flight-q {
                font-size: 10.5px;
                font-weight: 600;
                color: var(--color-text-muted);
                background: #fff;
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-pill);
                padding: 4px 11px;
            }

            .pm-mlm-body {
                display: flex;
                align-items: center;
                gap: 18px;
            }

            .pm-tree {
                flex: 1.25;
                gap: 18px;
            }

            .tree-row {
                gap: 12%;
            }

            .tree-row-3 {
                gap: 5%;
            }

            .tree-node {
                position: relative;
                background: linear-gradient(135deg, #f3f4f8, #e8eaf0);
                color: var(--color-text);
                box-shadow: 0 4px 10px rgba(24, 24, 24, 0.07);
            }

            .tree-node.n-blue {
                background: linear-gradient(135deg, #4d8bff, #1470ef);
                color: #fff;
                border-color: transparent;
            }

            .tree-node.n-violet {
                background: linear-gradient(135deg, #8b6bff, #6927da);
                color: #fff;
                border-color: transparent;
            }

            .tree-node.n-sm {
                width: 26px;
                height: 26px;
                font-size: 9px;
            }

            .tree-node.n-add {
                background: #fff;
                color: var(--color-text-muted);
                border-style: dashed;
                font-size: 14px;
                box-shadow: none;
            }

            .node-dot {
                position: absolute;
                right: -1px;
                top: -1px;
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background: #44e08a;
                border: 1.5px solid #fff;
            }

            .pm-mlm-side {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 10px;
            }

            .pm-bv {
                background: #fff;
                border-radius: var(--radius-md);
                padding: 12px 14px;
                box-shadow: 0 8px 20px rgba(24, 24, 24, 0.06);
            }

            .pm-bv-row {
                display: flex;
                justify-content: space-between;
                font-size: 10.5px;
                color: var(--color-text-muted);
            }

            .pm-bv-row b {
                color: var(--color-text);
            }

            .pm-bv-bar {
                display: flex;
                height: 7px;
                border-radius: 4px;
                overflow: hidden;
                margin: 6px 0;
                gap: 2px;
            }

            .pm-bv-bar .bv-l {
                width: 58%;
                background: linear-gradient(90deg, #4d8bff, #1470ef);
                border-radius: 4px;
            }

            .pm-bv-bar .bv-r {
                width: 42%;
                background: linear-gradient(90deg, #8b6bff, #6927da);
                border-radius: 4px;
            }

            .pm-rankcard {
                background: linear-gradient(135deg, rgba(225, 70, 70, 0.1), rgba(225, 70, 70, 0.03));
                border: 1.5px solid rgba(225, 70, 70, 0.18);
                border-radius: var(--radius-md);
                padding: 10px 14px;
                display: flex;
                flex-direction: column;
                gap: 2px;
            }

            .pm-rank-label {
                font-size: 9.5px;
                color: var(--color-text-muted);
            }

            .pm-rank-name {
                font-size: 14px;
                font-weight: 700;
                color: var(--color-accent);
            }

            .pm-foot-stat .dot-up {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: #44e08a;
                margin-right: 5px;
                display: inline-block;
            }

            .pm-time {
                flex-direction: column;
                align-items: stretch;
                gap: 12px;
            }

            .pm-time-grid {
                display: flex;
                align-items: stretch;
                gap: 14px;
            }

            .pm-time-main,
            .pm-time-side {
                flex: 1;
            }

            .pm-time-task {
                display: inline-flex;
                align-items: center;
                gap: 6px;
            }

            .pm-time-task i {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: var(--color-accent-2);
            }

            .pm-week {
                display: flex;
                align-items: flex-end;
                gap: 5px;
                height: 46px;
                margin-top: 12px;
            }

            .pm-week span {
                flex: 1;
                border-radius: 3px;
                background: rgba(20, 112, 239, 0.22);
            }

            .pm-week span.hi {
                background: linear-gradient(180deg, var(--color-accent-2), var(--color-accent));
            }

            .pm-tasklist {
                list-style: none;
                margin: 10px 0 0;
                padding: 10px 0 0;
                border-top: 1px solid var(--color-border-soft);
                display: flex;
                flex-direction: column;
                gap: 7px;
            }

            .pm-tasklist li {
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 11px;
                color: var(--color-text-muted);
            }

            .pm-tasklist li i {
                width: 13px;
                height: 13px;
                border-radius: 4px;
                border: 1.5px solid var(--color-border);
                flex-shrink: 0;
            }

            .pm-tasklist li.done i {
                background: #16a34a;
                border-color: #16a34a;
                position: relative;
            }

            .pm-tasklist li.done i::after {
                content: "\2713";
                position: absolute;
                inset: 0;
                color: #fff;
                font-size: 9px;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .pm-tasklist li.done {
                text-decoration: line-through;
                opacity: 0.7;
            }

            .pm-wp-badge {
                margin-left: auto;
                font-size: 9px;
                font-weight: 700;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                border-radius: var(--radius-pill);
                padding: 3px 9px;
            }

            .pm-blog-transform {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 16px;
            }

            .pm-blog-raw {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 7px;
                padding: 12px;
                border-radius: 10px;
                background: var(--color-surface);
                border: 1px dashed var(--color-border);
                opacity: 0.85;
            }

            .pm-raw-label {
                font-size: 8.5px;
                font-weight: 600;
                text-transform: uppercase;
                letter-spacing: 0.5px;
                color: var(--color-text-muted);
            }

            .pm-blog-raw i {
                display: block;
                height: 5px;
                border-radius: 3px;
                background: var(--color-border);
            }

            .pm-blog-raw i.sh {
                width: 60%;
            }

            .pm-blog-arrow {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 6px;
                color: var(--color-accent);
                flex-shrink: 0;
            }

            .pm-blog-out {
                flex: 1.1;
                display: flex;
                flex-direction: column;
                gap: 8px;
                padding: 12px;
                border-radius: 10px;
                background: #fff;
                border: 1.5px solid rgba(225, 70, 70, 0.18);
                box-shadow: 0 8px 20px rgba(225, 70, 70, 0.1);
            }

            .pm-blog-out .pm-blog-h {
                width: 80%;
                height: 9px;
            }

            .pm-blog-out .pm-blog-img {
                width: 100%;
                min-height: 34px;
            }

            .pm-blog-out .pm-blog-lines i {
                height: 5px;
            }

            .pm-blog-foot {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 11px 16px;
                border-top: 1px solid var(--color-border-soft);
                background: var(--color-surface);
            }

            .pm-seo {
                font-size: 11px;
                font-weight: 600;
                color: var(--color-text-muted);
            }

            .pm-seo b {
                color: #16a34a;
                font-size: 13px;
                margin-left: 3px;
            }

            .pm-blog-meta {
                font-size: 10px;
                color: var(--color-text-muted);
            }

            .pm-bot-meta {
                display: flex;
                flex-direction: column;
            }

            .pm-bot-intent {
                margin-left: auto;
                font-size: 9px;
                font-weight: 600;
                color: #fff;
                background: rgba(255, 255, 255, 0.22);
                border-radius: var(--radius-pill);
                padding: 3px 9px;
            }

            .pm-quick {
                display: flex;
                gap: 6px;
                margin-top: 8px;
            }

            .pm-qchip {
                font-size: 10px;
                font-weight: 600;
                color: var(--color-accent);
                background: rgba(225, 70, 70, 0.08);
                border: 1px solid rgba(225, 70, 70, 0.2);
                border-radius: var(--radius-pill);
                padding: 3px 9px;
            }

            .pm-bot-foot {
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 10px 12px;
                background: #fff;
                border-top: 1px solid var(--color-border-soft);
            }

            .pm-bot-input {
                flex: 1;
                font-size: 11px;
                color: var(--color-text-muted);
                background: var(--color-surface);
                border-radius: var(--radius-pill);
                padding: 7px 12px;
            }

            .pm-bot-send {
                width: 28px;
                height: 28px;
                flex-shrink: 0;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 11px;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
            }

            .pm-lms-stats {
                display: flex;
                gap: 10px;
            }

            .pm-stat {
                flex: 1;
                background: #fff;
                border-radius: var(--radius-sm);
                padding: 10px;
                text-align: center;
                box-shadow: 0 6px 16px rgba(24, 24, 24, 0.05);
            }

            .pm-stat b {
                display: block;
                font-family: var(--font-head);
                font-size: 18px;
                font-weight: 700;
                color: var(--color-text);
                line-height: 1;
            }

            .pm-stat span {
                font-size: 9.5px;
                color: var(--color-text-muted);
            }

            .pm-course-thumb {
                font-size: 20px;
            }

            .pm-course-cta {
                font-size: 10px;
                font-weight: 600;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
                border-radius: var(--radius-pill);
                padding: 6px 12px;
                flex-shrink: 0;
            }

            .pm-course-badge {
                font-size: 10px;
                font-weight: 600;
                color: var(--color-accent);
                background: rgba(225, 70, 70, 0.1);
                border-radius: var(--radius-pill);
                padding: 5px 11px;
                flex-shrink: 0;
            }

            .pm-map {
                height: 150px;
                background: linear-gradient(160deg, #eef3ee, #e6efe9);
            }

            .pm-roads {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
            }

            .pm-live {
                position: absolute;
                top: 10px;
                left: 10px;
                display: inline-flex;
                align-items: center;
                gap: 5px;
                font-size: 9.5px;
                font-weight: 600;
                color: var(--color-text);
                background: rgba(255, 255, 255, 0.92);
                border-radius: var(--radius-pill);
                padding: 4px 9px;
                box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
            }

            .pm-live i {
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: #44e08a;
                animation: pmPulse 1.5s ease-in-out infinite;
            }

            .pm-car {
                left: 44%;
                top: 36%;
            }

            .pm-ride {
                gap: 12px;
                align-items: center;
            }

            .pm-driver-avatar {
                width: 38px;
                height: 38px;
                flex-shrink: 0;
                border-radius: 50%;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 12px;
                font-weight: 700;
                color: #fff;
                background: linear-gradient(135deg, #4d8bff, #1470ef);
            }

            .pm-driver-info {
                flex: 1;
                display: flex;
                flex-direction: column;
                gap: 2px;
            }

            .pm-driver-name {
                font-size: 12.5px;
                font-weight: 700;
                color: var(--color-text);
                display: flex;
                align-items: center;
                gap: 7px;
            }

            .pm-driver-rating {
                font-size: 10px;
                font-weight: 600;
                color: #f0a020;
            }

            .pm-driver-car {
                font-size: 10px;
                color: var(--color-text-muted);
            }

            .pm-ride-right {
                text-align: right;
                display: flex;
                flex-direction: column;
            }

            .pm-ride-right .pm-ride-eta {
                font-size: 10px;
            }

            .pm-flight {
                background: transparent;
                box-shadow: none;
                padding: 26px 30px;
                gap: 12px;
            }

            .pm-flight-card {
                background: #fff;
                border-radius: var(--radius-md);
                box-shadow: 0 12px 28px rgba(24, 24, 24, 0.08);
                padding: 18px 20px;
                display: flex;
                flex-direction: column;
                gap: 14px;
            }

            .pm-airport b {
                font-size: 24px;
            }

            .pm-airport span {
                font-size: 12px;
                font-weight: 600;
                color: var(--color-text);
            }

            .pm-flight-path {
                gap: 4px;
            }

            .pm-flight-line {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: center;
                background: none;
                height: auto;
                position: relative;
            }

            .pm-flight-line::before,
            .pm-flight-line::after {
                content: "";
                flex: 1;
                height: 2px;
                background: repeating-linear-gradient(90deg, var(--color-border) 0 6px, transparent 6px 11px);
            }

            .pm-flight-line .pm-plane {
                margin: 0 6px;
            }

            .pm-flight-cls {
                font-size: 9.5px;
                color: var(--color-text-muted);
            }

            .pm-airline-logo {
                width: 22px;
                height: 22px;
                border-radius: 7px;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                font-size: 9px;
                font-weight: 700;
                color: #fff;
                background: linear-gradient(135deg, var(--color-accent-2), var(--color-accent));
            }

            .pm-flight-pricewrap {
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .pm-best {
                font-size: 9px;
                font-weight: 700;
                color: #16a34a;
                background: rgba(40, 200, 100, 0.12);
                border-radius: var(--radius-pill);
                padding: 3px 8px;
            }

            .pm-fare-list {
                display: flex;
                align-items: center;
                gap: 8px;
                flex-wrap: wrap;
            }

            .pm-fare {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                font-size: 10.5px;
                color: var(--color-text-muted);
                background: #fff;
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-pill);
                padding: 5px 11px;
            }

            .pm-fare b {
                color: var(--color-text);
            }

            .pm-fare i {
                width: 7px;
                height: 7px;
                border-radius: 50%;
                background: #1470ef;
            }

            .pm-fare i.f2 {
                background: #6927da;
            }

            .pm-duffel {
                margin-left: auto;
                font-size: 9.5px;
                font-weight: 600;
                color: var(--color-accent);
            }

            .pm-shop-bar {
                display: flex;
                align-items: center;
                gap: 10px;
            }

            .pm-shop-logo {
                font-size: 13px;
                font-weight: 700;
                color: var(--color-accent);
            }

            .pm-shop-search {
                flex: 1;
                font-size: 10.5px;
                color: var(--color-text-muted);
                background: #fff;
                border: 1.5px solid var(--color-border-soft);
                border-radius: var(--radius-pill);
                padding: 6px 12px;
            }

            .pm-shop-cart {
                position: relative;
                font-size: 15px;
            }

            .pm-shop-cart i {
                position: absolute;
                top: -4px;
                right: -6px;
                font-size: 8px;
                font-weight: 700;
                font-style: normal;
                color: #fff;
                background: var(--color-accent-2);
                border-radius: 50%;
                width: 13px;
                height: 13px;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            .pm-product {
                gap: 6px;
            }

            .pm-product-img {
                position: relative;
                height: 46px;
            }

            .pm-prod-tag {
                position: absolute;
                top: 5px;
                left: 5px;
                font-size: 8px;
                font-weight: 700;
                font-style: normal;
                color: #fff;
                background: var(--color-accent-2);
                border-radius: var(--radius-pill);
                padding: 2px 6px;
            }

            .pm-product-name {
                font-size: 10.5px;
                font-weight: 600;
                color: var(--color-text);
            }

            .pm-product-row {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }

            .pm-product-price {
                text-align: left;
                font-size: 12px;
            }

            .pm-stars {
                font-size: 8px;
                color: #f0a020;
                letter-spacing: -1px;
            }

            .pm-cart-sales {
                font-size: 11px;
                color: var(--color-text-muted);
            }

            .pm-cart-sales b {
                display: block;
                color: #16a34a;
                font-size: 13px;
            }

            .kt-progress {
                width: 3px;
            }

            .kt-progress-fill {
                display: none;
            }

            .kt-link {
                position: relative;
            }

            .kt-link::before {
                content: "";
                position: absolute;
                left: -22px;
                top: 50%;
                transform: translateY(-50%);
                width: 3px;
                height: 1.8em;
                border-radius: 3px;
                background: transparent;
                transition: background 0.3s ease;
            }

            .kt-link.active {
                font-weight: 600;
            }

            .kt-link.active::before {
                background: var(--color-accent);
            }

            .pm-ico {
                width: 14px;
                height: 14px;
                flex-shrink: 0;
            }

            .pm-ico-xs {
                width: 11px;
                height: 11px;
                flex-shrink: 0;
            }

            .pm-rank-name,
            .pm-streak,
            .pm-bar-date,
            .pm-flight-q,
            .pm-url,
            .pm-ai-badge,
            .pm-duffel,
            .pm-shop-logo,
            .pm-shop-search {
                display: inline-flex;
                align-items: center;
                gap: 5px;
            }

            .kt-media-diagram {
                background: radial-gradient(130% 120% at 0% 0%, rgba(187, 45, 59, 0.05), transparent 50%), linear-gradient(160deg, #fcfcfd, #eceef2);
                border-color: var(--color-border);
            }

            .pm {
                justify-content: flex-start;
                gap: 12px;
            }

            .pm-mlm-body {
                flex: 1;
            }

            .tree-node {
                background: #eef0f4;
                color: #3a3d44;
                border-color: rgba(108, 111, 118, 0.18);
                box-shadow: 0 3px 8px rgba(24, 24, 24, 0.06);
            }

            .tree-node.tree-root {
                background: var(--color-accent);
                box-shadow: 0 6px 14px rgba(187, 45, 59, 0.25);
            }

            .tree-node.n-blue {
                background: #465069;
                border-color: transparent;
            }

            .tree-node.n-violet {
                background: #5d5470;
                border-color: transparent;
            }

            .pm-bv-bar .bv-l {
                background: #465069;
            }

            .pm-bv-bar .bv-r {
                background: #c2c5cd;
            }

            .pm-rankcard {
                background: linear-gradient(135deg, rgba(187, 45, 59, 0.08), rgba(187, 45, 59, 0.02));
                border-color: rgba(187, 45, 59, 0.16);
            }

            .pm-rank-name {
                color: var(--color-accent);
            }

            .pm-time-grid {
                flex: 1;
            }

            .pm-week span {
                background: rgba(70, 80, 105, 0.22);
            }

            .pm-week span.hi {
                background: var(--color-accent);
            }

            .pm-browser {
                flex: 1;
                display: flex;
                flex-direction: column;
            }

            .pm-blog-transform {
                flex: 1;
                align-items: stretch;
            }

            .pm-blog-raw,
            .pm-blog-out {
                justify-content: center;
            }

            .pm-blog-img,
            .pm-blog-out .pm-blog-img {
                background: linear-gradient(135deg, #e9ecf2, #dde2ea);
            }

            .pm-blog-out {
                border-color: rgba(187, 45, 59, 0.16);
                box-shadow: 0 8px 20px rgba(187, 45, 59, 0.07);
            }

            .pm-ai-badge {
                color: var(--color-accent);
                background: rgba(187, 45, 59, 0.08);
            }

            .pm-wp-badge {
                background: var(--color-accent);
            }

            .pm-bot {
                max-width: none;
                width: 100%;
                height: 100%;
                padding: 0;
                border-radius: 0;
                box-shadow: none;
                display: flex;
                flex-direction: column;
            }

            .pm-bot-head {
                background: var(--color-accent);
            }

            .pm-bot-body {
                flex: 1;
            }

            .pm-msg-out {
                background: var(--color-accent);
            }

            .pm-msg-in {
                border: 1px solid var(--color-border-soft);
            }

            .pm-qchip {
                color: var(--color-accent);
                background: rgba(187, 45, 59, 0.07);
                border-color: rgba(187, 45, 59, 0.18);
            }

            .pm-bot-send {
                background: var(--color-accent);
            }

            .pm-lms .pm-course {
                flex: 1;
            }

            .pm-course-thumb {
                background: #eef0f4;
                color: #465069;
            }

            .pm-course-thumb-2 {
                background: #eef0f4;
                color: #5d5470;
            }

            .pm-progress span {
                background: var(--color-accent);
            }

            .pm-course-cta {
                background: var(--color-accent);
            }

            .pm-course-badge {
                color: var(--color-accent);
                background: rgba(187, 45, 59, 0.08);
            }

            .pm-map {
                flex: 1;
                height: auto;
                min-height: 150px;
                background: linear-gradient(160deg, #eef1ee, #e6ebe7);
            }

            .pm-route {
                color: var(--color-accent);
            }

            .pm-pin-a {
                background: #465069;
            }

            .pm-pin-b {
                background: var(--color-accent);
            }

            .pm-car {
                color: #f4b400;
                filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.25));
                line-height: 0;
            }

            .pm-driver-avatar {
                background: #465069;
            }

            .pm-driver-rating {
                color: #e0922b;
            }

            .pm-flight-card {
                flex: 1;
                justify-content: center;
            }

            .pm-airline-logo {
                background: var(--color-accent);
            }

            .pm-plane {
                color: var(--color-accent);
                line-height: 0;
            }

            .pm-flight-price {
                color: var(--color-text);
            }

            .pm-best {
                color: var(--color-accent);
                background: rgba(187, 45, 59, 0.09);
            }

            .pm-duffel {
                color: var(--color-accent);
            }

            .pm-shop {
                gap: 12px;
            }

            .pm-shop-logo {
                color: var(--color-accent);
            }

            .pm-shop-grid {
                flex: 1;
            }

            .pm-product {
                justify-content: flex-start;
            }

            .pm-product-img {
                flex: 1;
                min-height: 56px;
                background: linear-gradient(135deg, #edeff3, #e1e4ea);
            }

            .pm-product-img-2 {
                background: linear-gradient(135deg, #eaedf2, #dfe3ea);
            }

            .pm-product-img-3 {
                background: linear-gradient(135deg, #eeedf3, #e3e2ec);
            }

            .pm-prod-tag {
                background: var(--color-accent);
            }

            .pm-stars {
                color: #e0922b;
            }

            .pm-shop-cart i {
                background: var(--color-accent);
            }

            .pm-cart-btn {
                background: var(--color-accent);
                box-shadow: 0 6px 14px rgba(187, 45, 59, 0.22);
            }

            .pm-cart-sales b {
                color: #16a34a;
            }

/* KEY TOOLS — mobile (<=767.98px): the sticky "deck" (cards pile up as you
   scroll) is the intended behaviour and is defined in the home body's inline
   mobile CSS. A previous override here flattened the cards to normal flow
   (position:static) which killed the stacking — removed per request to bring
   the sticky cards back. */


