/* Homepage styles — cache-bust v=20260621235900 */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        html {
            scroll-behavior: smooth;
            --font-sans: 'Cairo', 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;
        }

        html[lang="en"],
html[lang="bg"],
html[lang="pt"] {
            --font-sans: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
        }

        /* Literal font stacks on body: some browsers fail font-family: var(--font-sans) even when the var resolves */
        body {
            font-family: 'Cairo', 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;
            line-height: 1.6;
            color: #1a202c;
            background: #ffffff;
        }

        html[lang="en"] body,
html[lang="bg"] body,
html[lang="pt"] body {
            font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
        }
        
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }
        
        /* Header: transparent at top; frosted bar after scroll */
        header {
            color: #1a202c;
            padding: 15px 0;
            position: sticky;
            top: 0;
            z-index: 1000;
            overflow: visible;
            border-bottom: 1px solid transparent;
            transition: background-color 0.22s ease, border-color 0.22s ease, backdrop-filter 0.22s ease;
        }

        header.header--scrolled {
            background: rgba(250, 245, 255, 0.95);
            backdrop-filter: blur(10px);
            border-bottom-color: #e9d5ff;
        }

        header .container {
            max-width: 1200px;
        }
        
        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .logo {
            font-size: 28px;
            font-weight: 400;
            color: #7c3aed;
            display: flex;
            align-items: center;
            gap: 8px;
            text-decoration: none;
        }
        
        .logo-img {
            width: 40px;
            height: 40px;
            border-radius: 10px;
        }
        
        .footer-logo-img {
            width: 32px;
            height: 32px;
            border-radius: 8px;
            vertical-align: middle;
            margin-left: 8px;
        }
        
        .cta-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%);
            color: white;
            padding: var(--header-action-pad-y, 12px) var(--header-action-pad-x, 28px);
            border-radius: 11px;
            text-decoration: none;
            font-weight: 700;
            font-size: var(--header-action-font-size, 16px);
            line-height: 1.2;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(147, 51, 234, 0.3);
        }

        .header-actions {
            display: flex;
            align-items: stretch;
            gap: 16px;
            overflow: visible;
            --header-action-pad-y: 12px;
            --header-action-pad-x: 28px;
            --header-action-font-size: 16px;
        }
        
        .header-link {
            color: #475569;
            text-decoration: none;
            font-weight: 600;
            font-size: 15px;
            transition: color 0.2s;
        }
        
        .header-link:hover {
            color: #9333ea;
        }

        .homepage-subheader {
            background: rgba(255, 255, 255, 0.98);
            border-bottom: 1px solid #ede9fe;
            box-shadow: 0 14px 38px rgba(15, 23, 42, 0.06);
        }

        .homepage-subheader__grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            gap: 24px;
            padding: 18px 0 20px;
        }

        .homepage-subheader__group {
            min-width: 0;
        }

        .homepage-subheader__title {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-size: 15px;
            font-weight: 400;
            color: #0f172a;
            margin-bottom: 10px;
        }

        .homepage-subheader__list {
            display: grid;
            gap: 8px;
        }

        .homepage-subheader__link {
            display: block;
            text-decoration: none;
            color: #334155;
            font-size: 14px;
            line-height: 1.5;
            transition: color 0.2s ease, transform 0.2s ease;
        }

        .homepage-subheader__link:hover {
            color: #a78bfa;
            transform: translateX(-2px);
        }

        /* Hero mesh: same drift/shape motion as before; colors are Adly purple only (no brown / MOGUL orange) */
        .top-aurora-wrap {
            position: relative;
            background: #0a0518;
        }

        /* Pricing band: same animated mesh + base as hero. Taller than hero → add ambient wash + lift so it doesn’t read darker. */
        .pricing-aurora-wrap {
            position: relative;
            background: #0a0518;
            overflow: hidden;
        }

        .pricing-aurora-wrap::before {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            background: linear-gradient(
                180deg,
                rgba(233, 213, 255, 0.11) 0%,
                rgba(124, 58, 237, 0.07) 22%,
                rgba(196, 181, 253, 0.09) 48%,
                rgba(147, 51, 234, 0.08) 72%,
                rgba(233, 213, 255, 0.1) 100%
            );
        }

        .pricing-aurora-wrap .top-aurora-layers {
            z-index: 1;
            filter: brightness(1.12) saturate(1.05);
        }

        .top-aurora-layers {
            position: absolute;
            inset: 0;
            z-index: 0;
            pointer-events: none;
            overflow: hidden;
        }

        .mesh-blob {
            position: absolute;
            pointer-events: none;
            border-radius: 50%;
            will-change: transform, opacity;
            mix-blend-mode: normal;
        }

        .mesh-blob::before {
            content: "";
            position: absolute;
            left: -28%;
            top: -28%;
            width: 156%;
            height: 156%;
            border-radius: inherit;
            filter: blur(92px);
            transform: translateZ(0);
        }

        .mesh-blob--1 {
            width: 78vmax;
            height: 78vmax;
            left: -32%;
            top: -48%;
            animation: mesh-orbit-1 18.7s ease-in-out infinite;
        }

        .mesh-blob--1::before {
            background: radial-gradient(circle at 42% 38%,
                rgba(233, 213, 255, 0.55) 0%,
                rgba(124, 58, 237, 0.4) 24%,
                rgba(76, 29, 149, 0.28) 46%,
                rgba(15, 5, 28, 0) 72%);
        }

        .mesh-blob--2 {
            width: 68vmax;
            height: 68vmax;
            right: -36%;
            top: -22%;
            animation: mesh-orbit-2 22.1s ease-in-out infinite;
            animation-delay: -3.4s;
        }

        .mesh-blob--2::before {
            background: radial-gradient(circle at 55% 48%,
                rgba(147, 51, 234, 0.48) 0%,
                rgba(90, 24, 154, 0.3) 40%,
                rgba(60, 9, 108, 0.18) 58%,
                rgba(0, 0, 0, 0) 76%);
        }

        .mesh-blob--3 {
            width: 52vmax;
            height: 52vmax;
            left: 8%;
            bottom: -38%;
            animation: mesh-orbit-3 15.3s ease-in-out infinite;
            animation-delay: -5.95s;
            mix-blend-mode: screen;
        }

        .mesh-blob--3::before {
            background: radial-gradient(circle at 48% 42%,
                rgba(196, 181, 253, 0.45) 0%,
                rgba(124, 58, 237, 0.26) 38%,
                rgba(76, 29, 149, 0.2) 55%,
                rgba(0, 0, 0, 0) 72%);
        }

        .mesh-blob--4 {
            width: 56vmax;
            height: 44vmax;
            right: -5%;
            top: 12%;
            border-radius: 42% 48% 52% 44%;
            animation: mesh-orbit-4 20.4s ease-in-out infinite;
            animation-delay: -1.7s;
        }

        .mesh-blob--4::before {
            border-radius: inherit;
            background: radial-gradient(ellipse 70% 58% at 40% 45%,
                rgba(233, 213, 255, 0.42) 0%,
                rgba(109, 40, 217, 0.24) 42%,
                rgba(35, 15, 60, 0) 72%);
        }

        .mesh-blob--5 {
            width: 38vmax;
            height: 38vmax;
            left: 28%;
            top: 5%;
            animation: mesh-orbit-5 11.9s ease-in-out infinite;
            animation-delay: -7.65s;
            opacity: 0.9;
        }

        .mesh-blob--5::before {
            background: radial-gradient(circle at 50% 50%,
                rgba(124, 58, 237, 0.5) 0%,
                rgba(76, 29, 149, 0.26) 48%,
                rgba(26, 0, 51, 0) 76%);
        }

        .mesh-blob--6 {
            width: 85vmax;
            height: 50vmax;
            left: -40%;
            top: 20%;
            border-radius: 50%;
            animation: mesh-orbit-6 23.8s ease-in-out infinite;
            animation-delay: -9.35s;
            mix-blend-mode: soft-light;
            opacity: 0.88;
        }

        .mesh-blob--6::before {
            background: radial-gradient(ellipse 80% 52% at 60% 48%,
                rgba(45, 20, 80, 0.38) 0%,
                rgba(147, 51, 234, 0.18) 36%,
                rgba(196, 181, 253, 0.1) 52%,
                rgba(0, 0, 0, 0) 78%);
        }

        @keyframes mesh-orbit-1 {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.45; }
            18% { transform: translate(12vw, 8vh) scale(1.14); opacity: 0.88; }
            38% { transform: translate(22vw, -4vh) scale(0.9); opacity: 0.35; }
            58% { transform: translate(6vw, 14vh) scale(1.08); opacity: 0.75; }
            78% { transform: translate(-8vw, 6vh) scale(0.95); opacity: 0.5; }
        }

        @keyframes mesh-orbit-2 {
            0%, 100% { transform: translate(0, 0) scale(1) rotate(0deg); opacity: 0.4; }
            22% { transform: translate(-14vw, 10vh) scale(1.12) rotate(-3deg); opacity: 0.82; }
            48% { transform: translate(-6vw, -12vh) scale(0.88) rotate(2deg); opacity: 0.28; }
            72% { transform: translate(-20vw, 4vh) scale(1.06) rotate(-1deg); opacity: 0.68; }
        }

        @keyframes mesh-orbit-3 {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.25; }
            25% { transform: translate(10vw, -16vh) scale(1.18); opacity: 0.72; }
            50% { transform: translate(-12vw, -6vh) scale(0.82); opacity: 0.9; }
            75% { transform: translate(4vw, 8vh) scale(1.05); opacity: 0.38; }
        }

        @keyframes mesh-orbit-4 {
            0%, 100% { transform: translate(0, 0) scale(1) rotate(0deg); opacity: 0.35; }
            30% { transform: translate(-18vw, 12vh) scale(1.15) rotate(5deg); opacity: 0.78; }
            55% { transform: translate(10vw, -8vh) scale(0.92) rotate(-4deg); opacity: 0.22; }
            80% { transform: translate(4vw, 18vh) scale(1.08) rotate(2deg); opacity: 0.62; }
        }

        @keyframes mesh-orbit-5 {
            0%, 100% { transform: translate(0, 0) scale(0.95); opacity: 0.15; }
            35% { transform: translate(16vw, 20vh) scale(1.25); opacity: 0.85; }
            65% { transform: translate(-10vw, 6vh) scale(0.8); opacity: 0.2; }
        }

        @keyframes mesh-orbit-6 {
            0%, 100% { transform: translate(0, 0) scale(1); opacity: 0.5; }
            33% { transform: translate(18vw, -10vh) scale(1.1); opacity: 0.35; }
            66% { transform: translate(-12vw, 12vh) scale(0.92); opacity: 0.65; }
        }

        @media (prefers-reduced-motion: reduce) {
            .mesh-blob {
                animation: none !important;
                opacity: 0.55;
            }
        }

        /*
         * Mobile: static aurora — mid-screen purple burst, darker toward the outer radius.
         */
        @media (max-width: 768px) {
            header.header--scrolled {
                backdrop-filter: none !important;
                -webkit-backdrop-filter: none !important;
            }

            .top-aurora-wrap {
                background: #080412;
            }

            .top-aurora-layers .mesh-blob {
                display: none !important;
            }

            .top-aurora-layers {
                background:
                    radial-gradient(circle at 52% 34%,
                        rgba(196, 181, 253, 0.26) 0%,
                        rgba(147, 51, 234, 0.32) 16%,
                        rgba(109, 40, 217, 0.22) 32%,
                        rgba(76, 29, 149, 0.14) 48%,
                        rgba(45, 16, 90, 0.08) 62%,
                        rgba(10, 5, 24, 0) 78%),
                    linear-gradient(180deg, #0d071a 0%, #090513 55%, #060209 100%);
            }

            .pricing-aurora-wrap {
                background: #090513;
            }

            .pricing-aurora-wrap::before {
                background: linear-gradient(
                    180deg,
                    rgba(233, 213, 255, 0.1) 0%,
                    rgba(124, 58, 237, 0.09) 18%,
                    rgba(196, 181, 253, 0.1) 38%,
                    rgba(147, 51, 234, 0.08) 58%,
                    rgba(124, 58, 237, 0.09) 78%,
                    rgba(196, 181, 253, 0.08) 100%
                );
            }

            .pricing-aurora-wrap .top-aurora-layers {
                filter: none;
                background:
                    /* plan cards — upper */
                    radial-gradient(ellipse 95% 48% at 50% 18%,
                        rgba(196, 181, 253, 0.2) 0%,
                        rgba(147, 51, 234, 0.22) 22%,
                        rgba(109, 40, 217, 0.12) 42%,
                        rgba(45, 16, 90, 0.04) 62%,
                        rgba(8, 4, 18, 0) 78%),
                    /* social proof / mid-pricing */
                    radial-gradient(ellipse 90% 44% at 52% 48%,
                        rgba(168, 85, 247, 0.16) 0%,
                        rgba(124, 58, 237, 0.18) 24%,
                        rgba(90, 24, 154, 0.1) 46%,
                        rgba(45, 16, 90, 0.05) 64%,
                        rgba(8, 4, 18, 0) 80%),
                    /* compare plans — lower */
                    radial-gradient(ellipse 88% 42% at 48% 78%,
                        rgba(196, 181, 253, 0.16) 0%,
                        rgba(147, 51, 234, 0.17) 22%,
                        rgba(109, 40, 217, 0.11) 44%,
                        rgba(76, 29, 149, 0.07) 62%,
                        rgba(8, 4, 18, 0) 78%),
                    linear-gradient(180deg, #0d071a 0%, #0a0518 35%, #0b061a 68%, #0a0518 100%);
            }

            .portfolio-track {
                will-change: auto;
            }
        }

        /*
         * Homepage: fixed bar stays visible for the full scroll (sticky breaks inside tall wrappers / overflow).
         * Unscrolled: fully transparent over the aurora. Scrolled: .header--scrolled fills/bar from JS.
         */
        body.homepage {
            --homepage-header-pad-y: 15px;
        }

        @media (max-width: 600px) {
            body.homepage {
                --homepage-header-pad-y: 10px;
            }
        }

        .homepage .top-aurora-wrap {
            padding-top: calc(
                (var(--homepage-header-pad-y) * 2) + 40px + env(safe-area-inset-top, 0px)
            );
        }

        .homepage header {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            width: 100%;
            z-index: 1000;
            box-sizing: border-box;
            padding: calc(var(--homepage-header-pad-y) + env(safe-area-inset-top, 0px)) 0 var(--homepage-header-pad-y);
        }

        .homepage header:not(.header--scrolled) {
            background: transparent;
            border-bottom-color: transparent;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }

        @supports selector(:has(*)) {
            html:has(body.homepage) {
                scroll-padding-top: 96px;
            }
        }

        .homepage header .logo {
            color: #f8fafc;
        }

        .homepage header .header-link {
            color: rgba(226, 232, 240, 0.9);
        }

        .homepage header .header-link:hover {
            color: #c4b5fd;
        }

        .homepage header .lang-switcher {
            background: rgba(18, 12, 28, 0.75);
            border-color: rgba(167, 139, 250, 0.5);
            color: #fafafa;
        }

        .homepage header .lang-switcher .lang-icon {
            color: #e2e8f0;
        }

        .homepage header.header--scrolled {
            background: rgba(12, 8, 22, 0.92);
            border-bottom-color: rgba(167, 139, 250, 0.35);
            /* No backdrop-filter here: blur over the mesh + scroll = iOS jank & content flashing */
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }

        .homepage header.header--scrolled .logo {
            color: #f8fafc;
        }

        .homepage header.header--scrolled .header-link {
            color: rgba(241, 245, 249, 0.93);
        }

        .homepage header.header--scrolled .lang-switcher {
            background: rgba(22, 16, 36, 0.9);
            border-color: rgba(196, 181, 253, 0.4);
            color: #fafafa;
        }

        .homepage header.header--scrolled .lang-switcher .lang-icon {
            color: #e2e8f0;
        }

        .top-aurora-wrap .homepage-subheader {
            position: relative;
            z-index: 2;
            background: transparent;
            border-bottom: 1px solid rgba(255, 255, 255, 0.08);
            box-shadow: none;
        }

        .top-aurora-wrap .homepage-subheader__title {
            color: rgba(248, 250, 252, 0.9);
        }

        .top-aurora-wrap .homepage-subheader__link {
            color: rgba(226, 232, 240, 0.78);
        }

        .top-aurora-wrap .homepage-subheader__link:hover {
            color: #ddd6fe;
        }

        section.hero-aurora-headline {
            position: relative;
            z-index: 2;
            padding: clamp(52px, 9vw, 96px) 0 24px;
            text-align: center;
        }

        .hero-title {
            font-size: clamp(34px, 5vw, 56px);
            font-weight: 400;
            margin: 0 auto 0;
            line-height: 1.15;
            letter-spacing: -0.02em;
            color: #f8fafc;
            max-width: 820px;
        }

        .hero-title .highlight {
            color: #c4b5fd;
            font-style: italic;
            font-weight: 400;
        }

        .hero-platform-strip {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: clamp(10px, 1.5vw, 18px);
            flex-wrap: wrap;
            margin: 0 auto 28px;
        }

        .hero-platform-icon {
            width: clamp(23px, 2.73vw, 30.5px);
            height: clamp(23px, 2.73vw, 30.5px);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 0;
            background: transparent;
            box-shadow: none;
            backdrop-filter: none;
        }

        .hero-platform-icon img,
        .hero-platform-icon svg {
            width: 100%;
            height: 100%;
            object-fit: contain;
            display: block;
        }

        .hero-platform-icon.is-facebook img,
        .hero-platform-icon.is-tiktok img {
            border-radius: 999px;
        }

        .hero-platform-icon.is-instagram img,
        .hero-platform-icon.is-linkedin img,
        .hero-platform-icon.is-x img,
        .hero-platform-icon.is-snapchat img {
            border-radius: 8px;
        }

        .hero-platform-icon.is-whatsapp svg,
        .hero-platform-icon.is-telegram svg {
            border-radius: 999px;
            filter: drop-shadow(0 8px 18px rgba(15, 23, 42, 0.18));
        }

        .hero-platform-icon.is-whatsapp svg {
            fill: #22c55e;
            stroke: #ffffff;
            stroke-width: 1.25;
            stroke-linecap: round;
            stroke-linejoin: round;
            background: #22c55e;
            padding: 2px;
        }

        .hero-platform-icon.is-telegram svg {
            fill: #2aabee;
            background: #ffffff;
            padding: 2px;
        }

        .lang-switcher {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            align-self: stretch;
            position: relative;
            overflow: visible;
            padding-block: 0;
            padding-inline-start: 12px;
            padding-inline-end: 10px;
            background: #ffffff;
            border: 1px solid #e9d5ff;
            border-radius: 11px;
            box-sizing: border-box;
            color: #4c1d95;
            font-size: var(--header-action-font-size, 16px);
        }

        .lang-switcher .lang-icon {
            width: 16px;
            height: 16px;
            flex-shrink: 0;
            color: #6b7280;
            pointer-events: none;
        }

        .lang-switcher-menu {
            position: static;
            margin: 0;
            flex: 1 1 auto;
        }

        .lang-switcher-summary {
            list-style: none;
            cursor: pointer;
            display: flex;
            align-items: center;
            font-family: 'Tajawal', 'Cairo', system-ui, -apple-system, 'Segoe UI', sans-serif;
            font-weight: 600;
            font-size: inherit;
            line-height: 1.2;
            padding-block: var(--header-action-pad-y, 12px);
            padding-inline-end: 16px;
            color: inherit;
        }

        .lang-switcher-summary::-webkit-details-marker {
            display: none;
        }

        .lang-switcher-summary::after {
            content: '';
            width: 0;
            height: 0;
            margin-inline-start: 8px;
            border-inline-start: 4px solid transparent;
            border-inline-end: 4px solid transparent;
            border-top: 5px solid currentColor;
            opacity: 0.7;
        }

        .lang-switcher-panel {
            position: absolute;
            top: calc(100% + 6px);
            inset-inline-start: 0;
            inset-inline-end: 0;
            width: auto;
            min-width: 100%;
            box-sizing: border-box;
            display: flex;
            flex-direction: column;
            gap: 6px;
            padding: 8px;
            background: #ffffff;
            border: 1px solid #e9d5ff;
            border-radius: 11px;
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
            z-index: 80;
        }

        .lang-switcher-link {
            display: block;
            width: 100%;
            box-sizing: border-box;
            font-family: 'Tajawal', 'Cairo', system-ui, -apple-system, 'Segoe UI', sans-serif;
            font-weight: 600;
            font-size: inherit;
            line-height: 1.2;
            color: inherit;
            text-decoration: none;
            padding: 10px 12px;
            border-radius: 8px;
            white-space: nowrap;
        }

        .lang-switcher-link:hover,
        .lang-switcher-link:focus-visible {
            background: rgba(147, 51, 234, 0.1);
        }

        html[lang="en"] .lang-switcher-summary,
html[lang="bg"] .lang-switcher-summary,
html[lang="pt"] .lang-switcher-summary,
html[lang="en"] .lang-switcher-link,
html[lang="bg"] .lang-switcher-link,
html[lang="pt"] .lang-switcher-link {
            font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
        }

        .homepage header .lang-switcher-panel {
            background: #120c1c;
            border-color: rgba(196, 181, 253, 0.45);
            color: #fafafa;
        }

        .homepage header .lang-switcher-link:hover,
        .homepage header .lang-switcher-link:focus-visible {
            background: rgba(167, 139, 250, 0.28);
        }
        
        .cta-button:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 20px rgba(147, 51, 234, 0.4);
        }
        
        /* Hero continuation: same aurora band as headline — no white panel */
        .hero.hero--continuation {
            position: relative;
            z-index: 2;
            background: transparent;
            color: #f8fafc;
            padding: 0 0 0;
            text-align: center;
            overflow: visible;
        }

        .hero.hero--continuation .container {
            position: relative;
            z-index: 1;
        }

        .hero.hero--continuation .subtitle {
            font-size: clamp(17px, 2vw, 20px);
            margin-top: 0;
            margin-bottom: 10px;
            font-weight: 600;
            max-width: 860px;
            margin-right: auto;
            margin-left: auto;
            color: #ffffffb3;
            line-height: 1.75;
        }
        
        .hero.hero--continuation .subtitle strong {
            color: #ffffff;
            font-weight: 700;
        }

        .hero-founder-link {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            color: inherit;
            text-decoration: none !important;
            font-weight: inherit;
            white-space: nowrap;
            vertical-align: middle;
        }

        .hero-founder-link:hover {
            color: inherit;
            text-decoration: none;
        }

        .hero-founder-link img {
            width: 30px;
            height: 30px;
            border-radius: 999px;
            object-fit: cover;
            border: 2px solid rgba(255, 255, 255, 0.82);
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
        }
        
        .hero.hero--continuation .subtitle-secondary {
            font-size: 17px;
            color: rgba(226, 232, 240, 0.88);
            font-weight: 600;
            max-width: 820px;
            margin: 0 auto 22px;
            line-height: 1.65;
        }

        .hero.hero--continuation .hero-friction {
            color: rgba(226, 232, 240, 0.78);
            margin-bottom: 0;
        }

        .top-aurora-wrap > .hero-social-note {
            position: relative;
            z-index: 2;
            text-align: center;
            color: rgba(248, 250, 252, 0.85);
            font-size: 14px;
            font-weight: 600;
            margin: 0;
            padding: 8px 16px 20px;
        }

        .top-aurora-wrap > .hero-social-note:empty {
            display: none;
            padding: 0;
        }

        .hero.hero--continuation .hero-buttons {
            display: flex;
            gap: 12px;
            justify-content: center;
            flex-wrap: wrap;
            margin-top: 40px;
            margin-bottom: 10px;
        }

        .hero.hero--continuation .hero-buttons--single {
            justify-content: center;
        }
        
        /* Primary CTA — global (.hero-cta) so sections outside .hero--continuation keep the filled button */
        .hero-cta {
            background: #7c3aed;
            color: white;
            padding: 0 38px;
            border-radius: 11px;
            text-decoration: none;
            font-weight: 700;
            font-size: 19px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 58px;
            transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
            box-shadow: 0 10px 26px rgba(124, 58, 237, 0.32);
        }

        /* Match /ui/styles.css .button primary (radius + brand fill) */
        .hero-cta.hero-cta--stacked {
            flex-direction: row;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 18px 36px;
            min-height: unset;
            border-radius: 11px;
            border: 1px solid color-mix(in srgb, #7c3aed 35%, #4c1d95);
            background: color-mix(in srgb, #7c3aed 88%, #1f2937);
            box-shadow: 0 10px 26px rgba(124, 58, 237, 0.32);
            font-weight: 800;
            text-align: center;
            line-height: 1.25;
            max-width: 420px;
        }

        .hero-cta__line1 {
            display: block;
            font-size: clamp(16px, 2.8vw, 20px);
            font-weight: 800;
        }

        .hero-cta__line2 {
            display: block;
            font-size: clamp(12px, 2vw, 14px);
            font-weight: 600;
            opacity: 0.92;
            letter-spacing: 0.02em;
        }

        .hero-cta__arrow {
            width: 18px;
            height: 18px;
            stroke: currentColor;
            fill: none;
            stroke-width: 2.5;
            stroke-linecap: round;
            stroke-linejoin: round;
            flex-shrink: 0;
        }

        [dir="rtl"] .hero-cta__arrow {
            transform: scaleX(-1);
        }
        
        .hero-cta:not(.hero-cta--stacked):hover {
            transform: translateY(-2px);
            background: #6d28d9;
            box-shadow: 0 12px 28px rgba(109, 40, 217, 0.32);
        }

        .hero-cta.hero-cta--stacked:hover {
            transform: translateY(-2px);
            background: color-mix(in srgb, #7c3aed 92%, #111827);
            box-shadow: 0 12px 28px rgba(109, 40, 217, 0.32);
        }

        /* Hero under aurora: white CTA, brand text (must follow global .hero-cta) */
        .hero.hero--continuation .hero-cta,
        .hero.hero--continuation .hero-cta.hero-cta--stacked {
            background: #ffffff;
            color: #7c3aed;
            border: 1px solid rgba(255, 255, 255, 0.5);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.22);
        }

        .hero.hero--continuation .hero-cta.hero-cta--stacked {
            border: 1px solid rgba(196, 181, 253, 0.65);
        }

        .hero.hero--continuation .hero-cta:not(.hero-cta--stacked):hover,
        .hero.hero--continuation .hero-cta.hero-cta--stacked:hover {
            transform: translateY(-2px);
            background: #f5f3ff;
            color: #6d28d9;
            box-shadow: 0 12px 36px rgba(0, 0, 0, 0.28);
        }
        
        .hero-cta-secondary {
            background: white;
            color: #5b21b6;
            padding: 0 34px;
            border-radius: 11px;
            text-decoration: none;
            font-weight: 700;
            font-size: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 54px;
            transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
            border: 2px solid #d8b4fe;
        }
        
        .hero-cta-secondary:hover {
            border-color: #7c3aed;
            background: #f5f3ff;
            color: #4c1d95;
            transform: translateY(-2px);
        }
        
        .hero-friction {
            font-size: 11.5px;
            font-weight: 500;
            color: #6b7280;
            margin-bottom: 20px;
        }
        
        .hero-social-note {
            margin-top: 10px;
            color: #374151;
            font-size: 14px;
            font-weight: 600;
        }
        
        /* Section Common Styles */
        section {
            padding: 80px 0;
        }
        
        .section-title {
            text-align: center;
            font-size: 44px;
            font-weight: 400;
            margin-bottom: 20px;
            color: #7c3aed;
        }
        
        .section-subtitle {
            text-align: center;
            font-size: 20px;
            color: #64748b;
            margin-bottom: 50px;
        }
        
        /* For Everyone Section */
        .for-everyone {
            background: #ffffff;
            padding-top: 56px;
            padding-bottom: 56px;
        }

        .for-everyone .section-title {
            margin-bottom: 10px;
        }

        .for-everyone .section-subtitle {
            margin-bottom: 24px;
            font-size: clamp(16px, 2vw, 20px);
            font-weight: 500;
            line-height: 1.5;
            color: #667085;
        }

        .audience-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 22px;
        }
        
        .audience-card {
            background: white;
            padding: 34px 30px;
            border-radius: 20px;
            border: 1px solid #e7eaf1;
            border-top: 2px solid #d8dee9;
            box-shadow: 0 6px 20px rgba(15, 23, 42, 0.06);
            transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
        }

        .audience-card:hover {
            transform: translateY(-3px);
            border-color: #cfd8e6;
            box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
        }

        .audience-card.sme {
            border-top-color: #a78bfa;
        }

        .audience-card.agency {
            border-top-color: #cbd5e1;
        }
        
        .audience-card h3 {
            font-size: 28px;
            font-weight: 400;
            margin-bottom: 8px;
            color: #0f172a;
            display: flex;
            align-items: center;
            gap: 10px;
            line-height: 1.2;
        }

        .audience-title-icon {
            width: 22px;
            height: 22px;
            color: #64748b;
            flex-shrink: 0;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            transform: translateY(-1px);
        }

        .audience-title-text {
            display: block;
        }

        .audience-title-icon svg {
            width: 100%;
            height: 100%;
            stroke: currentColor;
            fill: none;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        
        .audience-card p {
            font-size: 15px;
            color: #475569;
            line-height: 1.5;
            margin-bottom: 14px;
            font-weight: 500;
        }
        
        .audience-card ul {
            list-style: none;
            padding: 0;
        }
        
        .audience-card li {
            font-size: 14px;
            line-height: 1.5;
            padding: 9px 0;
            border-bottom: 1px solid #edf2f7;
            position: relative;
            display: flex;
            align-items: flex-start;
            gap: 10px;
        }
        
        .audience-card li:before {
            content: "✓";
            color: #16a34a;
            width: 18px;
            height: 18px;
            border-radius: 999px;
            border: 1px solid #bbf7d0;
            background: #f0fdf4;
            font-size: 12px;
            font-weight: 700;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin-top: 2px;
            flex-shrink: 0;
        }

        .for-everyone-cta {
            margin-top: 18px;
            text-align: center;
        }

        .for-everyone-cta .hero-buttons {
            margin-bottom: 8px;
        }

        .for-everyone-cta .for-cta-microcopy {
            font-size: 14px;
            font-weight: 600;
            color: #5b6170;
        }

        @media (max-width: 1024px) {
            .for-everyone .audience-grid {
                grid-template-columns: 1fr;
            }
        }

        .audience-item-label {
            font-weight: 700;
        }

        .audience-help {
            width: 18px;
            height: 18px;
            border-radius: 999px;
            border: 1px solid #c4b5fd;
            background: #f5f3ff;
            color: #7c3aed;
            font-size: 12px;
            font-weight: 700;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            padding: 0;
            flex-shrink: 0;
        }

        .audience-help-tip {
            position: absolute;
            top: calc(100% + 8px);
            left: 0;
            z-index: 8;
            min-width: 220px;
            max-width: 340px;
            padding: 9px 11px;
            border-radius: 10px;
            background: #111827;
            color: #ffffff;
            font-size: 13px;
            font-weight: 500;
            line-height: 1.45;
            opacity: 0;
            transform: translateY(4px);
            pointer-events: none;
            transition: opacity 0.12s ease, transform 0.12s ease;
        }

        [dir="rtl"] .audience-help-tip {
            left: auto;
            right: 0;
        }

        .audience-card li:hover .audience-help-tip,
        .audience-help:focus + .audience-help-tip {
            opacity: 1;
            transform: translateY(0);
        }
        
        /* Features Section */
        .features {
            background: linear-gradient(180deg, #fafbff 0%, #f6f8fc 100%);
            padding: 56px 0;
        }

        .features .container {
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 32px;
        }

        .features .section-title {
            margin-bottom: 8px;
        }

        .features .section-subtitle {
            margin-bottom: 44px;
            font-size: 16px;
            font-weight: 500;
            color: rgba(71, 85, 105, 0.82);
        }

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

        .feature-pillars-row {
            display: contents;
        }

        .feature-pillar {
            background: #ffffff;
            padding: 26px 22px;
            border-radius: 16px;
            border: 1px solid rgba(148, 163, 184, 0.2);
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.05);
            text-align: right;
            display: flex;
            flex-direction: column;
            min-height: 100%;
            transition: transform 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease;
        }

        .feature-pillar:hover {
            transform: translateY(-4px);
            background: #fbfcff;
            box-shadow: 0 14px 28px rgba(15, 23, 42, 0.09);
        }

        [dir="ltr"] .feature-pillar {
            text-align: left;
        }

        .feature-pillar.is-campaign {
            border-color: #b9c9ee;
            box-shadow: 0 16px 30px rgba(15, 23, 42, 0.12);
        }

        .feature-pillar.feature-pillar-secondary {
            padding: 26px 22px;
            border-color: rgba(148, 163, 184, 0.16);
            box-shadow: 0 6px 14px rgba(15, 23, 42, 0.04);
        }

        .feature-pillar-head {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 8px;
        }

        .feature-pillar-title {
            margin: 0;
            font-size: 22px;
            font-weight: 400;
            color: #0f172a;
            line-height: 1.35;
        }

        .feature-pillar-desc {
            margin: 0 0 14px;
            font-size: 14px;
            color: rgba(71, 85, 105, 0.78);
            line-height: 1.55;
        }

        [dir="ltr"] .feature-pillar-desc {
            text-align: left;
        }
        
        .feature-icon {
            width: 22px;
            height: 22px;
            color: #64748b;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            transition: transform 0.2s ease;
        }

        .feature-pillar:hover .feature-icon {
            transform: translateY(-1px) scale(1.05);
        }

        .feature-icon svg {
            width: 100%;
            height: 100%;
            stroke: currentColor;
            fill: none;
            stroke-width: 1.75;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .feature-highlights {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .feature-highlights li {
            display: flex;
            align-items: flex-start;
            gap: 11px;
            padding: 10px 0;
            padding-inline-start: 4px;
            border-bottom: 1px solid #f2f5f9;
            font-size: 14px;
            line-height: 1.5;
            color: #334155;
        }

        .feature-highlights li:first-child {
            color: #1f2937;
            font-weight: 700;
        }

        .feature-highlights li::before {
            content: "";
            width: 10px;
            height: 10px;
            margin-top: 8px;
            border-radius: 999px;
            border: 1.5px solid #9fb0c5;
            background: #eff4fa;
            flex-shrink: 0;
        }

        .pillar-more {
            display: none;
        }

        .pillar-more summary {
            list-style: none;
            cursor: pointer;
            color: #5b21b6;
            font-size: 13px;
            font-weight: 600;
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }

        .pillar-more summary::-webkit-details-marker {
            display: none;
        }

        .pillar-more summary::after {
            content: "⌄";
            font-size: 12px;
            transform: translateY(-1px);
            transition: transform 0.15s ease;
        }

        .pillar-more[open] summary::after {
            transform: rotate(180deg) translateY(1px);
        }

        .pillar-more-content {
            display: grid;
            grid-template-rows: 0fr;
            opacity: 0;
            transition: grid-template-rows 0.28s ease, opacity 0.24s ease;
        }

        .pillar-more[open] .pillar-more-content {
            grid-template-rows: 1fr;
            opacity: 1;
        }

        .pillar-more-inner {
            overflow: hidden;
        }

        .pillar-tools {
            list-style: none;
            margin: 8px 0 0;
            padding: 0;
        }

        .pillar-tools li {
            display: flex;
            align-items: flex-start;
            gap: 11px;
            padding: 14px 0;
            padding-inline-start: 4px;
            border-bottom: 1px solid #f2f5f9;
            font-size: 15px;
            line-height: 1.68;
            color: #334155;
        }

        .pillar-tools li::before {
            content: "";
            width: 10px;
            height: 10px;
            margin-top: 8px;
            border-radius: 999px;
            border: 1.5px solid #9fb0c5;
            background: #eff4fa;
            flex-shrink: 0;
        }

        .features-cta {
            margin-top: 34px;
            text-align: center;
        }

        .features-cta .hero-buttons {
            margin-bottom: 8px;
        }

        .features-cta .hero-cta {
            min-height: 66px;
            font-size: 21px;
            padding: 0 48px;
        }

        .features-cta-microcopy {
            font-size: 13px;
            font-weight: 600;
            color: #64748b;
        }

        @media (max-width: 1024px) {
            .features .feature-pillars {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 24px;
            }
        }

        @media (max-width: 768px) {
            .features .container {
                padding: 0 20px;
            }

            .features .feature-pillars {
                grid-template-columns: 1fr;
                gap: 24px;
            }

            .feature-pillar {
                padding: 22px 20px;
            }

            .feature-pillar-title {
                font-size: 18px;
            }

            .features .section-subtitle {
                margin-bottom: 40px;
            }

            .features-cta {
                margin-top: 28px;
            }

            .features-cta .hero-cta {
                min-height: 54px;
                font-size: 17px;
                padding: 0 24px;
            }
        }

        /* Founder note */
        .founder-note {
            background:
                radial-gradient(circle at 20% 8%, rgba(167, 139, 250, 0.12), transparent 28%),
                linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
            padding: 72px 0 84px;
        }

        .founder-note-card {
            max-width: 860px;
            margin: 0 auto;
            padding: clamp(30px, 5vw, 56px);
            border-radius: 28px;
            border: 1.5px solid rgba(124, 58, 237, 0.28);
            background: rgba(255, 255, 255, 0.9);
            box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
            text-align: start;
        }

        .founder-note-head {
            text-align: center;
            margin-bottom: 30px;
        }

        .founder-note-avatar {
            width: 112px;
            height: 112px;
            border-radius: 50%;
            object-fit: cover;
            display: block;
            margin: 0 auto 18px;
            border: 3px solid rgba(124, 58, 237, 0.22);
            box-shadow: 0 10px 28px rgba(15, 23, 42, 0.14);
        }

        .founder-note-title {
            margin: 0;
            font-size: clamp(26px, 3.5vw, 36px);
            line-height: 1.05;
            letter-spacing: -0.035em;
            color: #1f2937;
            font-weight: 900;
        }

        .founder-note-title span {
            color: #7c3aed;
        }

        .founder-note-kicker {
            margin-top: 8px;
            color: #6b7280;
            font-size: 15px;
            font-weight: 700;
        }

        .founder-note-body {
            max-width: 720px;
            margin: 0 auto;
        }

        .founder-note-body p {
            margin: 0 0 24px;
            color: #4b5563;
            font-size: clamp(16px, 1.8vw, 20px);
            line-height: 1.58;
            font-weight: 500;
            letter-spacing: -0.015em;
        }

        .founder-note-body p:last-child {
            margin-bottom: 0;
        }

        .founder-note-body strong {
            color: #1f2937;
            font-weight: 900;
        }

        .founder-note-action {
            margin-top: 34px;
            text-align: center;
        }

        .founder-note-cta {
            background: #7c3aed;
            box-shadow: 0 14px 28px rgba(124, 58, 237, 0.24);
        }

        .founder-note-cta:hover {
            background: #6d28d9;
            box-shadow: 0 18px 34px rgba(124, 58, 237, 0.34);
        }

        @media (max-width: 768px) {
            .founder-note {
                padding: 48px 0 58px;
            }

            .founder-note-card {
                border-radius: 22px;
                padding: 28px 20px 32px;
            }

            .founder-note-avatar {
                width: 88px;
                height: 88px;
            }

            .founder-note-body p {
                margin-bottom: 19px;
            }
        }
        
        /* Portfolio Gallery - seamless after hero (aurora mesh shows through) */
        .portfolio {
            position: relative;
            z-index: 2;
            background: transparent;
            color: white;
            overflow: hidden;
            padding: 70px 0 36px;
            /* Force LTR for predictable carousel behavior */
            direction: ltr;
            margin-bottom: 0;
            margin-top: 0;
        }

        .portfolio ~ .portfolio-more {
            margin-top: -2px;
        }

        .portfolio-viewport {
            position: relative;
            width: 100%;
            margin: 0;
            padding: 0;
        }

        /* One spotlight over both rails: horizontal vignette + soft overhead highlight */
        .portfolio-viewport::after {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            z-index: 2;
            background-image:
                radial-gradient(
                    ellipse 90% 55% at 50% -35%,
                    rgba(233, 213, 255, 0.14) 0%,
                    transparent 50%
                ),
                linear-gradient(
                    90deg,
                    rgba(10, 5, 24, 0.82) 0%,
                    rgba(10, 5, 24, 0.38) 12%,
                    rgba(10, 5, 24, 0.12) 22%,
                    transparent 34%,
                    transparent 66%,
                    rgba(10, 5, 24, 0.12) 78%,
                    rgba(10, 5, 24, 0.38) 88%,
                    rgba(10, 5, 24, 0.82) 100%
                );
        }

        .landing-message {
            background: #ffffff;
            padding: 56px 0 36px;
        }

        .landing-message .container {
            max-width: 1400px;
        }

        .landing-message-inner {
            width: 38%;
            max-width: 677px;
            margin-left: auto;
            margin-right: auto;
            text-align: start;
        }

        .landing-message-line {
            font-size: clamp(25.58px, 3.41vw, 38.96px);
            font-weight: 400;
            line-height: 1.45;
            letter-spacing: -0.01em;
            margin: 0;
        }

        .landing-message-line + .landing-message-line {
            margin-top: 36px;
        }

        .landing-word-chunk {
            color: #cfcfcf;
        }

        .reveal-ready .landing-word-chunk {
            transition: color 400ms ease;
        }

        .landing-word-chunk.is-visible {
            color: #111111;
        }

        .founder-video {
            position: relative;
            background: #ffffff;
            padding: 48px 0 74px;
            overflow: hidden;
            border-bottom: 1px solid rgba(226, 232, 240, 0.82);
        }

        .founder-video::before {
            content: none;
        }

        .founder-video::after {
            content: none;
        }

        .founder-video .container {
            max-width: 1360px;
        }

        .founder-video-card {
            position: relative;
            border-radius: 0;
            padding: 0;
            background: transparent;
            border: 0;
            box-shadow: none;
            overflow: visible;
            isolation: auto;
            max-width: none;
            margin: 0;
        }

        .founder-video-card::before {
            content: none;
        }

        .founder-video-lead {
            margin: 0 auto 14px;
            max-width: 980px;
            font-size: 12px;
            letter-spacing: 0.08em;
            line-height: 1.35;
            text-align: center;
            color: rgba(44, 30, 72, 0.72);
            font-weight: 700;
        }

        .founder-video-proof {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 24px;
            margin: 0 auto 22px;
            color: #4b5563;
            font-size: clamp(17px, 2.2vw, 24px);
            font-weight: 500;
            line-height: 1.25;
            text-align: center;
        }

        .founder-video-proof .pricing-social-proof-avatars {
            flex-shrink: 0;
        }

        .founder-video-proof .avatar-badge {
            width: 3.75rem;
            height: 3.75rem;
            margin-inline-end: -0.9rem;
            border-width: 2px;
            border-color: #ffffff;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.1);
        }

        .founder-video-proof .avatar-badge:last-child {
            margin-inline-end: 0;
        }

        .founder-video-proof-text {
            display: inline-block;
        }

        .founder-video-proof-text strong {
            color: #111827;
            font-weight: 900;
        }

        .founder-video-frame {
            border-radius: 22px;
            overflow: hidden;
            border: 1px solid rgba(132, 109, 167, 0.08);
            background: #0f061e;
            box-shadow: 0 10px 28px rgba(18, 12, 30, 0.16);
            max-width: 980px;
            margin: 0 auto;
        }

        .founder-video-player {
            display: block;
            width: 100%;
            height: auto;
            aspect-ratio: 19 / 10;
            background: #0f061e;
            object-fit: cover;
        }

        .hero.hero--continuation .founder-video--in-hero {
            max-width: 1080px;
            margin: clamp(30px, 5vw, 58px) auto 0;
            padding: 0;
            background: transparent;
            border-bottom: 0;
            overflow: visible;
        }

        .hero.hero--continuation .founder-video-proof {
            color: rgba(255, 255, 255, 0.9);
        }

        .hero.hero--continuation .founder-video-proof-text strong {
            color: #ffffff;
        }

        .hero.hero--continuation .founder-video-proof .avatar-badge {
            border-color: rgba(255, 255, 255, 0.82);
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.22);
        }

        .hero.hero--continuation .founder-video-frame {
            border-color: rgba(255, 255, 255, 0.18);
            box-shadow: 0 20px 60px rgba(15, 8, 32, 0.35);
        }

        .hero-showcase-bridge {
            position: relative;
            z-index: 2;
            max-width: 760px;
            margin: 0 auto 34px;
            padding: 0 24px;
            text-align: center;
            color: #ffffff;
            direction: rtl;
        }

        .hero-showcase-bridge::before {
            content: none;
        }

        .hero-showcase-bridge::after {
            content: "";
            position: absolute;
            left: 50%;
            bottom: -12px;
            width: min(220px, 48vw);
            height: 1px;
            transform: translateX(-50%);
            background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(196, 181, 253, 0.72), rgba(255, 255, 255, 0));
            box-shadow: 0 0 18px rgba(124, 58, 237, 0.35);
            pointer-events: none;
        }

        .hero-showcase-bridge__label {
            display: inline-block;
            padding: 0;
            background: transparent;
            border: 0;
            color: rgba(255, 255, 255, 0.92);
            font-size: clamp(24px, 3vw, 34px);
            font-weight: 800;
            letter-spacing: -0.02em;
            line-height: 1.18;
            text-shadow: 0 12px 34px rgba(124, 58, 237, 0.38);
        }

        [dir="ltr"] .founder-video-lead {
            letter-spacing: -0.015em;
        }

        .portfolio-more .founder-video {
            background: transparent;
            padding: 16px 0 0;
        }

        .portfolio-more .founder-video .container {
            max-width: 900px;
        }

        .portfolio-more .founder-video-card {
            border-radius: 26px;
            padding: clamp(12px, 1.6vw, 16px);
            background:
                linear-gradient(160deg, rgba(19, 10, 38, 0.96), rgba(11, 6, 27, 0.92));
            border: 1px solid rgba(255, 255, 255, 0.14);
            box-shadow:
                0 26px 70px rgba(7, 3, 19, 0.55),
                inset 0 1px 0 rgba(255, 255, 255, 0.12);
        }

        .portfolio-more .founder-video-card::before {
            width: 420px;
            height: 420px;
            inset-inline-end: -170px;
            inset-block-start: -170px;
            background: radial-gradient(circle, rgba(124, 58, 237, 0.3), rgba(124, 58, 237, 0));
        }

        .portfolio-more .founder-video-title {
            margin-bottom: 10px;
            font-size: clamp(21px, 1.9vw, 30px);
            color: #f8f4ff;
            text-shadow: 0 2px 14px rgba(97, 39, 196, 0.35);
        }

        .portfolio-more .founder-video-frame {
            border-radius: 18px;
            border-color: rgba(255, 255, 255, 0.18);
            box-shadow:
                0 12px 35px rgba(4, 2, 12, 0.6),
                0 0 0 1px rgba(255, 255, 255, 0.06) inset;
        }

        .portfolio-more .founder-video-player {
            border-radius: 18px;
        }

        /* Product Power Showcase */
        .product-power {
            position: relative;
            overflow: hidden;
            background: #ffffff;
            padding: 16px 0 52px;
        }

        .product-power::before {
            content: none;
        }

        .product-power .container {
            position: relative;
            z-index: 1;
            max-width: 1280px;
        }

        .product-power-header {
            max-width: 780px;
            margin: 0 auto 56px;
            text-align: center;
        }

        .product-power-badge,
        .product-power-final-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            border: 1px solid rgba(124, 58, 237, 0.16);
            background: rgba(255, 255, 255, 0.72);
            color: #7c3aed;
            border-radius: 999px;
            padding: 8px 14px;
            font-size: 13px;
            font-weight: 800;
            letter-spacing: 0.02em;
            box-shadow: 0 10px 28px rgba(124, 58, 237, 0.08);
        }

        .product-power-title {
            color: #141124;
            font-size: clamp(36px, 5vw, 64px);
            line-height: 1.04;
            font-weight: 800;
            letter-spacing: -0.04em;
            margin: 18px 0;
        }

        .product-power-title span,
        .product-power-feature-title span {
            color: #7c3aed;
        }

        .product-power-subtitle {
            margin: 0 auto;
            max-width: 680px;
            color: #64748b;
            font-size: 18px;
            line-height: 1.75;
            font-weight: 500;
        }

        .product-power-stack {
            display: flex;
            flex-direction: column;
            gap: 0;
        }

        .product-power-feature {
            position: relative;
            display: flex;
            gap: clamp(32px, 5vw, 64px);
            align-items: center;
            justify-content: center;
            padding: 18px 0 48px;
        }

        .product-power-feature.is-schedule-feature {
            order: 4;
        }

        .product-power-feature.is-adly-command-feature {
            order: 5;
        }

        .product-power-final {
            order: 6;
        }

        @media (min-width: 981px) {
            .product-power-feature.is-schedule-feature .product-power-media,
            .product-power-feature.is-adly-command-feature .product-power-copy {
                order: 1;
            }

            .product-power-feature.is-schedule-feature .product-power-copy,
            .product-power-feature.is-adly-command-feature .product-power-media {
                order: 2;
            }
        }

        .product-power-copy {
            flex: 1 1 0;
            max-width: 576px;
        }

        .product-power-media {
            flex: 1 1 0;
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .product-power-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            color: #7c3aed;
            font-size: 14px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            margin-bottom: 14px;
        }

        .product-power-eyebrow svg,
        .product-power-tool-icon svg {
            width: 18px;
            height: 18px;
            stroke: currentColor;
            fill: none;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .product-power-eyebrow svg {
            width: 36px;
            height: 36px;
            padding: 8px;
            border-radius: 12px;
            background: rgba(124, 58, 237, 0.1);
            color: #7c3aed;
            box-shadow: inset 0 0 0 1px rgba(124, 58, 237, 0.08);
        }

        .product-power-feature-title {
            color: #1f2937;
            font-size: clamp(34px, 4vw, 50px);
            line-height: 1.06;
            letter-spacing: -0.035em;
            font-weight: 800;
            margin: 0 0 18px;
        }

        .product-power-copy p {
            color: #64748b;
            font-size: 17px;
            line-height: 1.75;
            font-weight: 500;
            margin: 0 0 26px;
        }

        .product-power-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
        }

        .product-power-action-primary,
        .product-power-action-secondary,
        .product-power-final-cta {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 46px;
            padding: 0 20px;
            border-radius: 12px;
            text-decoration: none;
            font-weight: 700;
            font-size: 15px;
            font-family: inherit;
            cursor: pointer;
            transition: transform 0.24s ease, box-shadow 0.24s ease;
        }

        button.product-power-action-primary,
        button.product-power-action-secondary {
            appearance: none;
            -webkit-appearance: none;
        }

        .product-power-action-primary {
            color: #ffffff;
            background: #7c3aed;
            border: 1px solid transparent;
            box-shadow: 0 12px 26px rgba(124, 58, 237, 0.22);
        }

        .product-power-action-secondary {
            color: #5b21b6;
            background: #ffffff;
            border: 1px solid #d8def0;
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
        }

        .product-power-action-primary:hover,
        .product-power-action-secondary:hover,
        .product-power-final-cta:hover {
            transform: translateY(-2px);
            box-shadow: 0 18px 34px rgba(15, 23, 42, 0.12);
        }

        .product-power-media-shell {
            position: relative;
            width: 100%;
            max-width: 512px;
            aspect-ratio: 1 / 1;
            border-radius: 32px;
            background: #f1f2f4;
            border: 1px solid rgba(226, 232, 240, 0.88);
            box-shadow: 0 28px 70px rgba(71, 85, 105, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.95);
            overflow: hidden;
        }

        .product-power-media-shell.is-video {
            aspect-ratio: 1328 / 1080;
        }

        .product-power-media-shell.is-video-wide {
            aspect-ratio: 1658 / 1080;
        }

        .product-power-media-shell.is-adly-listening {
            aspect-ratio: 1328 / 1080;
            padding: clamp(16px, 2.2vw, 24px);
            background:
                radial-gradient(circle at 82% 82%, rgba(34, 197, 94, 0.18), rgba(34, 197, 94, 0) 34%),
                linear-gradient(135deg, #140a28 0%, #211044 52%, #0f172a 100%);
            border-color: rgba(196, 181, 253, 0.18);
            box-shadow: 0 28px 70px rgba(30, 17, 64, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12);
        }

        .product-power-media-shell.is-adly-listening .adly-listening-motion {
            width: 100%;
            height: 100%;
            min-height: 0;
        }

        .product-power-media-shell.is-adly-listening .adly-listening-device {
            width: 100%;
            height: 100%;
            min-height: 0;
        }

        .product-power-media-shell::after {
            content: "";
            position: absolute;
            inset: 1px;
            border-radius: 31px;
            pointer-events: none;
            box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7);
        }

        .product-power-placeholder {
            position: absolute;
            inset: 9%;
            border-radius: 22px;
            background: #111827;
            box-shadow: 0 22px 48px rgba(15, 23, 42, 0.22);
            overflow: hidden;
        }

        .product-power-video {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            border-radius: inherit;
            object-fit: contain;
            background: #f1f2f4;
            box-shadow: none;
        }

        .product-power-placeholder::before,
        .product-power-final::before {
            content: none;
        }

        .product-power-placeholder-ui {
            position: absolute;
            inset: 18px;
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.88);
            padding: 16px;
            display: grid;
            gap: 10px;
            align-content: start;
        }

        .product-power-placeholder-top,
        .product-power-mini-row {
            display: flex;
            gap: 7px;
            align-items: center;
            justify-content: space-between;
        }

        .product-power-dot-row {
            display: flex;
            gap: 7px;
        }

        .product-power-dot {
            width: 9px;
            height: 9px;
            border-radius: 999px;
            background: #7c3aed;
        }

        .product-power-pill-line {
            height: 10px;
            border-radius: 999px;
            background: #e9d5ff;
        }

        .product-power-pill-line.is-wide { width: 66%; }
        .product-power-pill-line.is-mid { width: 48%; }

        .product-power-tile-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
            margin-top: 8px;
        }

        .product-power-mini-tile {
            min-height: 74px;
            border-radius: 14px;
            background: #f5f3ff;
            border: 1px solid #ede9fe;
        }

        .product-power-play {
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
            width: 58px;
            height: 58px;
            border-radius: 999px;
            background: #ffffff;
            color: #7c3aed;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 16px 34px rgba(15, 23, 42, 0.24);
        }

        .product-power-play svg {
            width: 23px;
            height: 23px;
            fill: currentColor;
            margin-left: 3px;
        }

        [dir="rtl"] .product-power-play svg {
            margin-left: 0;
            margin-right: 3px;
            transform: scaleX(-1);
        }

        .product-power-mp4-label {
            position: absolute;
            right: 18px;
            bottom: 18px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.92);
            color: #7c3aed;
            padding: 7px 11px;
            font-size: 11px;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }

        [dir="rtl"] .product-power-mp4-label {
            right: auto;
            left: 18px;
        }

        .product-power-network {
            position: absolute;
            inset: 0;
        }

        .product-power-network svg {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
        }

        .product-power-network-line,
        .product-power-network-flow {
            fill: none;
            stroke-linecap: round;
        }

        .product-power-network-line {
            stroke: rgba(148, 163, 184, 0.46);
            stroke-width: 2;
        }

        .product-power-network-flow {
            stroke: #7c3aed;
            stroke-width: 3;
            stroke-dasharray: 240;
            stroke-dashoffset: 240;
            filter: drop-shadow(0 0 8px rgba(124, 58, 237, 0.34));
            animation: product-power-flow 4.4s ease-in-out infinite;
        }

        .product-power-network-flow.is-branch {
            stroke-dasharray: 180;
            stroke-dashoffset: 180;
            animation-name: product-power-branch-flow;
            animation-delay: 1.45s;
        }

        .product-power-node {
            position: absolute;
            width: 58px;
            height: 58px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.94);
            border: 1px solid #e7eaf1;
            color: #7c3aed;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 900;
            box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12);
        }

        .product-power-node svg {
            width: 22px;
            height: 22px;
            stroke: currentColor;
            fill: none;
            stroke-width: 2;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .product-power-node img {
            width: 24px;
            height: 24px;
            object-fit: contain;
            border-radius: 6px;
        }

        .product-power-node .product-power-platform-svg {
            width: 23px;
            height: 23px;
        }

        .product-power-node.is-platform img[src*="instagram"] {
            width: 26px;
            height: 26px;
            border-radius: 8px;
        }

        .product-power-node.is-platform img[src*="tiktok"] {
            width: 25px;
            height: 25px;
            border-radius: 7px;
        }

        .product-power-node.is-source {
            left: 10%;
            top: 44%;
            color: #475569;
        }

        .product-power-node.is-source svg {
            width: 25px;
            height: 25px;
            stroke-width: 1.9;
            transform: none;
        }

        .product-power-user-icon {
            position: absolute;
            left: 50%;
            top: 50%;
            width: 25px;
            height: 25px;
            transform: translate(-50%, -50%);
            color: #475569;
        }

        .product-power-node.is-source .product-power-user-icon svg {
            display: block;
            width: 100%;
            height: 100%;
        }

        .product-power-node.is-hub {
            left: 46%;
            top: 44%;
            background: #ffffff;
            animation: product-power-node-pulse 4.4s ease-in-out infinite;
        }

        .product-power-node.is-hub img {
            width: 34px;
            height: 34px;
            border-radius: 9px;
        }

        .product-power-node.is-platform {
            width: 52px;
            height: 52px;
            right: 11%;
            color: #7c3aed;
            font-size: 18px;
            line-height: 1;
            text-align: center;
        }

        .product-power-node.is-platform span {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 26px;
            height: 26px;
            font-weight: 900;
            letter-spacing: -0.03em;
            color: #7c3aed;
        }

        .product-power-node.platform-1 { top: 11.1%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 1.7s; }
        .product-power-node.platform-2 { top: 24.9%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 1.85s; }
        .product-power-node.platform-3 { top: 38.8%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 2s; }
        .product-power-node.platform-4 { top: 52.6%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 2.15s; }
        .product-power-node.platform-5 { top: 66.4%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 2.3s; }
        .product-power-node.platform-6 { top: 80.2%; animation: product-power-platform-pulse 4.4s ease-in-out infinite 2.45s; }

        .product-power-final {
            position: relative;
            margin: 4px auto 0;
            max-width: 1080px;
            border-radius: 18px;
            padding: 14px 16px;
            background: rgba(255, 255, 255, 0.56);
            border: 1px solid rgba(226, 232, 240, 0.74);
            box-shadow: 0 8px 22px rgba(71, 85, 105, 0.045);
            overflow: hidden;
            color: #111827;
        }

        .product-power-final::before {
            content: none;
        }

        .product-power-final-inner {
            position: relative;
            z-index: 1;
            display: flex;
            gap: 16px;
            align-items: center;
            justify-content: space-between;
        }

        .product-power-final-badge {
            background: #f5f3ff;
            border-color: #e9d5ff;
            color: #6d28d9;
            box-shadow: none;
        }

        .product-power-final-title {
            margin: 0;
            font-size: 15px;
            line-height: 1.35;
            letter-spacing: -0.01em;
            font-weight: 700;
            color: #475569;
            white-space: nowrap;
        }

        .product-power-final-desc,
        .product-power-final-note {
            color: #64748b;
            line-height: 1.65;
            font-weight: 500;
        }

        .product-power-final-desc {
            font-size: 14px;
            margin: 0;
        }

        .product-power-final-cta {
            background: #ffffff;
            color: #7c3aed;
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
            border: 1px solid #d8def0;
        }

        .product-power-final-note {
            margin: 8px 0 0;
            font-size: 13px;
        }

        .product-power-tool-grid {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
            justify-content: flex-end;
        }

        .product-power-tool {
            min-height: 0;
            border-radius: 999px;
            padding: 7px 10px;
            background: rgba(255, 255, 255, 0.82);
            border: 1px solid rgba(237, 242, 247, 0.9);
            backdrop-filter: none;
            display: flex;
            align-items: center;
            gap: 7px;
            color: #111827;
            box-shadow: none;
            white-space: nowrap;
        }

        .product-power-tool-icon {
            width: 22px;
            height: 22px;
            border-radius: 7px;
            background: #f5f3ff;
            color: #7c3aed;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }

        .product-power-tool span:last-child {
            font-size: 12px;
            font-weight: 700;
            line-height: 1;
        }

        .adly-listening {
            position: relative;
            display: grid;
            grid-template-columns: minmax(0, 0.95fr) minmax(360px, 1.05fr);
            gap: clamp(28px, 5vw, 64px);
            align-items: center;
            margin: 4px 0 58px;
            padding: clamp(28px, 5vw, 54px);
            border-radius: 34px;
            background:
                radial-gradient(circle at 16% 16%, rgba(196, 181, 253, 0.32), rgba(196, 181, 253, 0) 34%),
                linear-gradient(135deg, #140a28 0%, #211044 52%, #0f172a 100%);
            color: #ffffff;
            overflow: hidden;
            box-shadow: 0 34px 80px rgba(30, 17, 64, 0.22);
        }

        .adly-listening::before {
            content: "";
            position: absolute;
            inset: auto -18% -38% auto;
            width: 440px;
            height: 440px;
            border-radius: 999px;
            background: radial-gradient(circle, rgba(34, 197, 94, 0.22), rgba(34, 197, 94, 0));
            pointer-events: none;
        }

        .adly-listening-copy,
        .adly-listening-motion {
            position: relative;
            z-index: 1;
        }

        .adly-listening-eyebrow {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            margin-bottom: 14px;
            padding: 7px 12px;
            border-radius: 999px;
            border: 1px solid rgba(255, 255, 255, 0.14);
            background: rgba(255, 255, 255, 0.08);
            color: #ddd6fe;
            font-size: 13px;
            font-weight: 800;
            letter-spacing: 0.04em;
        }

        .adly-listening-title {
            margin: 0 0 16px;
            color: #ffffff;
            font-size: clamp(32px, 4.4vw, 56px);
            line-height: 1.06;
            letter-spacing: -0.04em;
            font-weight: 850;
        }

        .adly-listening-desc {
            max-width: 620px;
            margin: 0;
            color: rgba(241, 245, 249, 0.82);
            font-size: 17px;
            line-height: 1.8;
            font-weight: 550;
        }

        .adly-listening-pills {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
            margin-top: 24px;
        }

        .adly-listening-pills span {
            display: inline-flex;
            align-items: center;
            min-height: 36px;
            padding: 0 13px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.14);
            color: rgba(255, 255, 255, 0.92);
            font-size: 13px;
            font-weight: 800;
        }

        .adly-listening-motion {
            min-height: 386px;
        }

        .adly-listening-device {
            position: relative;
            min-height: 386px;
            border-radius: 30px;
            background:
                linear-gradient(160deg, rgba(255, 255, 255, 0.16), rgba(255, 255, 255, 0.06)),
                rgba(15, 23, 42, 0.58);
            border: 1px solid rgba(255, 255, 255, 0.16);
            box-shadow:
                0 24px 70px rgba(2, 6, 23, 0.38),
                inset 0 1px 0 rgba(255, 255, 255, 0.16);
            overflow: hidden;
        }

        .adly-listening-device::before {
            content: "";
            position: absolute;
            inset: 18px;
            border-radius: 24px;
            border: 1px solid rgba(255, 255, 255, 0.08);
            background: radial-gradient(circle at center, rgba(124, 58, 237, 0.22), rgba(124, 58, 237, 0));
        }

        .adly-listening-device-top {
            position: absolute;
            inset-inline-start: 22px;
            inset-block-start: 18px;
            display: flex;
            gap: 7px;
            z-index: 2;
        }

        .adly-listening-device-top span {
            width: 8px;
            height: 8px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.36);
        }

        .adly-listening-channel,
        .adly-listening-bubble,
        .adly-listening-core {
            position: absolute;
            z-index: 3;
        }

        .adly-listening-channel {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            min-height: 40px;
            padding: 8px 12px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.92);
            color: #111827;
            font-size: 12px;
            font-weight: 850;
            box-shadow: 0 16px 34px rgba(2, 6, 23, 0.24);
            animation: adly-listening-float 5.2s ease-in-out infinite;
        }

        .adly-listening-channel-icon {
            width: 24px;
            height: 24px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            font-size: 12px;
            font-weight: 900;
        }

        .adly-listening-channel-icon svg {
            width: 17px;
            height: 17px;
            fill: currentColor;
        }

        .adly-listening-channel.is-autopilot {
            inset-inline-start: 9%;
            inset-block-start: 19%;
            animation-delay: -0.8s;
        }

        .adly-listening-channel.is-autopilot .adly-listening-channel-icon {
            background: #7c3aed;
        }

        .adly-listening-channel.is-whatsapp {
            inset-inline-end: 8%;
            inset-block-start: 25%;
            animation-delay: -2.1s;
        }

        .adly-listening-channel.is-whatsapp .adly-listening-channel-icon {
            background: #22c55e;
        }

        .adly-listening-channel.is-telegram {
            inset-inline-start: 12%;
            inset-block-end: 24%;
            animation-delay: -3.2s;
        }

        .adly-listening-channel.is-telegram .adly-listening-channel-icon {
            background: #2aabee;
        }

        .adly-listening-core {
            inset-inline-start: 50%;
            inset-block-start: 50%;
            transform: translate(-50%, -50%);
            width: 148px;
            height: 148px;
            padding: 14px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.96);
            color: #111827;
            display: flex;
            flex-direction: column;
            justify-content: center;
            gap: 7px;
            align-items: center;
            text-align: center;
            border: 2.5px solid rgba(124, 58, 237, 0.45);
            box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 0 0 rgba(124, 58, 237, 0);
            animation: adly-listening-core-hat 24s ease-in-out infinite;
            z-index: 2;
        }

        [dir="rtl"] .adly-listening-core {
            transform: translate(50%, -50%);
        }

        .adly-listening-core-logo {
            position: relative;
            width: 38px;
            height: 38px;
        }

        .adly-listening-core-logo > img {
            width: 38px;
            height: 38px;
            border-radius: 11px;
            box-shadow: 0 12px 26px rgba(124, 58, 237, 0.22);
        }

        .adly-listening-active-source {
            position: absolute;
            inset-inline-start: 50%;
            inset-block-start: -34px;
            width: 28px;
            height: 28px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            border: 2px solid #ffffff;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.2);
            opacity: 0;
            transform: translateX(-50%) scale(0.72);
            animation: adly-listening-active-source 24s ease-in-out infinite both;
        }

        .adly-listening-active-source svg {
            width: 16px;
            height: 16px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .adly-listening-active-source img {
            width: 17px;
            height: 17px;
            border-radius: 5px;
        }

        .adly-listening-active-source.is-whatsapp { background: #22c55e; }
        .adly-listening-active-source.is-telegram { background: #2aabee; }
        .adly-listening-active-source.is-web { background: #475569; }
        .adly-listening-active-source.is-app { background: #ffffff; }

        .adly-listening-active-source.active-1 { animation-delay: 0.5s; }
        .adly-listening-active-source.active-2 { animation-delay: 5s; }
        .adly-listening-active-source.active-3 { animation-delay: 9.5s; }
        .adly-listening-active-source.active-4 { animation-delay: 14s; }
        .adly-listening-active-source.active-5 { animation-delay: 18.5s; }

        .adly-listening-core strong {
            display: block;
            color: #4c1d95;
            font-size: 19px;
            line-height: 1.1;
            font-weight: 900;
        }

        .adly-listening-core-status {
            display: block;
            margin-top: 3px;
            color: #64748b;
            font-size: 11px;
            font-weight: 750;
        }

        .adly-listening-wave {
            display: flex;
            align-items: end;
            gap: 5px;
            height: 28px;
            padding-top: 4px;
            width: 92px;
            justify-content: center;
            animation: adly-listening-typing-visibility 24s ease-in-out infinite both;
        }

        .adly-listening-wave span {
            width: 100%;
            max-width: 32px;
            height: 9px;
            border-radius: 999px;
            background: linear-gradient(180deg, #a78bfa, #7c3aed);
            animation: adly-listening-wave 1.2s ease-in-out infinite;
        }

        .adly-listening-wave span:nth-child(2) { animation-delay: 0.15s; }
        .adly-listening-wave span:nth-child(3) { animation-delay: 0.3s; }
        .adly-listening-wave span:nth-child(4) { animation-delay: 0.45s; }

        .adly-listening-output {
            position: relative;
            min-height: 22px;
            width: 100%;
            overflow: hidden;
        }

        .adly-listening-output-text {
            position: absolute;
            inset: 0;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #4c1d95;
            font-size: 11px;
            font-weight: 900;
            line-height: 1.25;
            opacity: 0;
            transform: translateY(8px) scale(0.94);
            animation: adly-listening-output 24s ease-in-out infinite both;
        }

        .adly-listening-output-text.output-1 { animation-delay: 0.5s; }
        .adly-listening-output-text.output-2 { animation-delay: 5s; }
        .adly-listening-output-text.output-3 { animation-delay: 9.5s; }
        .adly-listening-output-text.output-4 { animation-delay: 14s; }
        .adly-listening-output-text.output-5 { animation-delay: 18.5s; }

        .adly-listening-bubble {
            display: flex;
            flex-direction: column;
            align-items: stretch;
            gap: 6px;
            max-width: 230px;
            padding: 0;
            border-radius: 18px;
            background: transparent;
            color: #111827;
            font-size: 11.5px;
            line-height: 1.35;
            font-weight: 800;
            opacity: 0;
            transform: translateY(12px) scale(0.94);
            animation: adly-listening-message 24s ease-in-out infinite both;
            z-index: 4;
        }

        .adly-listening-message-row,
        .adly-listening-reply-row {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            width: fit-content;
            max-width: 100%;
            padding: 8px 10px;
            border-radius: 18px;
            box-shadow: 0 16px 34px rgba(2, 6, 23, 0.2);
        }

        .adly-listening-message-row {
            background: rgba(255, 255, 255, 0.9);
            animation: adly-listening-request-state 24s ease-in-out infinite both;
            animation-delay: inherit;
        }

        .adly-listening-source {
            width: 20px;
            height: 20px;
            flex: 0 0 20px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            box-shadow: 0 7px 14px rgba(15, 23, 42, 0.16);
        }

        .adly-listening-source svg {
            width: 13px;
            height: 13px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .adly-listening-source img {
            width: 15px;
            height: 15px;
            border-radius: 5px;
        }

        .adly-listening-source.is-whatsapp {
            background: #22c55e;
        }

        .adly-listening-source.is-telegram {
            background: #2aabee;
        }

        .adly-listening-source.is-web {
            background: #475569;
        }

        .adly-listening-source.is-app {
            background: #ffffff;
        }

        .adly-listening-bubble.bubble-1 {
            inset-inline-end: 5%;
            inset-block-start: 12%;
            max-width: 188px;
            animation-delay: 0.5s;
        }

        .adly-listening-bubble.bubble-2 {
            inset-inline-start: 5%;
            inset-block-start: 22%;
            max-width: 208px;
            animation-delay: 5s;
        }

        .adly-listening-bubble.bubble-3 {
            inset-inline-end: 4%;
            inset-block-start: 46%;
            max-width: 202px;
            animation-delay: 9.5s;
        }

        .adly-listening-bubble.bubble-4 {
            inset-inline-start: 4%;
            inset-block-end: 18%;
            max-width: 238px;
            animation-delay: 14s;
        }

        .adly-listening-bubble.bubble-5 {
            inset-inline-end: 14%;
            inset-block-end: 3%;
            max-width: 190px;
            color: #064e3b;
            animation-delay: 18.5s;
        }

        .adly-listening-bubble.bubble-5 .adly-listening-message-row {
            background: rgba(220, 252, 231, 0.92);
        }

        @keyframes adly-listening-float {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-10px); }
        }

        @keyframes adly-listening-core {
            0%, 100% { box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28); }
            46%, 62% { box-shadow: 0 28px 70px rgba(124, 58, 237, 0.34); }
        }

        @keyframes adly-listening-wave {
            0%, 100% { height: 9px; opacity: 0.62; }
            50% { height: 26px; opacity: 1; }
        }

        @keyframes adly-listening-message {
            0%, 2% { transform: translateY(12px) scale(0.94); opacity: 0; }
            4%, 13% { transform: translateY(0) scale(1); opacity: 1; }
            16%, 17% { transform: translateY(0) scale(1); opacity: 0.5; }
            19%, 100% { transform: translateY(-7px) scale(0.98); opacity: 0; }
        }

        @keyframes adly-listening-request-state {
            0%, 11% {
                background: rgba(255, 255, 255, 0.92);
                color: #111827;
                filter: grayscale(0);
                opacity: 1;
            }
            13%, 17% {
                background: rgba(226, 232, 240, 0.72);
                color: #64748b;
                filter: grayscale(0.75);
                opacity: 0.72;
            }
            19%, 100% {
                background: rgba(226, 232, 240, 0.5);
                color: #94a3b8;
                filter: grayscale(1);
                opacity: 0;
            }
        }

        @keyframes adly-listening-active-source {
            0%, 3% { opacity: 0; transform: translateX(-50%) scale(0.72); }
            5%, 17% { opacity: 1; transform: translateX(-50%) scale(1); }
            20%, 100% { opacity: 0; transform: translateX(-50%) scale(0.82); }
        }

        @keyframes adly-listening-typing-visibility {
            0%, 5%, 12%, 100% { opacity: 0; transform: translateY(3px); }
            6%, 11% { opacity: 1; transform: translateY(0); }
        }

        @keyframes adly-listening-output {
            0%, 11% { opacity: 0; transform: translateY(8px) scale(0.94); }
            13%, 17% { opacity: 1; transform: translateY(0) scale(1); }
            20%, 100% { opacity: 0; transform: translateY(-6px) scale(0.98); }
        }

        @keyframes adly-listening-core-hat {
            0%, 5%, 84%, 100% {
                border-color: rgba(124, 58, 237, 0.45);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 0 0 rgba(124, 58, 237, 0);
            }
            3%, 18% {
                border-color: rgba(34, 197, 94, 0.72);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 34px rgba(34, 197, 94, 0.26);
            }
            21%, 37% {
                border-color: rgba(42, 171, 238, 0.75);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 34px rgba(42, 171, 238, 0.26);
            }
            40%, 55% {
                border-color: rgba(71, 85, 105, 0.72);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 34px rgba(148, 163, 184, 0.22);
            }
            58%, 73% {
                border-color: rgba(124, 58, 237, 0.72);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 34px rgba(124, 58, 237, 0.26);
            }
            77%, 92% {
                border-color: rgba(34, 197, 94, 0.72);
                box-shadow: 0 24px 58px rgba(2, 6, 23, 0.28), 0 0 34px rgba(34, 197, 94, 0.26);
            }
        }

        .adly-command-card,
        .adly-command-request {
            position: absolute;
            z-index: 4;
        }

        .adly-command-card {
            left: 50%;
            top: 50%;
            width: min(290px, 55%);
            min-height: 176px;
            transform: translate(-50%, -50%);
            padding: 18px;
            border-radius: 28px;
            background: rgba(255, 255, 255, 0.96);
            border: 2px solid rgba(124, 58, 237, 0.34);
            color: #111827;
            box-shadow: 0 28px 70px rgba(2, 6, 23, 0.34);
            overflow: hidden;
            animation: adly-command-card-accent 25s ease-in-out infinite;
        }

        .adly-command-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at 18% 0%, rgba(124, 58, 237, 0.12), transparent 34%),
                linear-gradient(180deg, rgba(248, 250, 252, 0), rgba(241, 245, 249, 0.82));
            pointer-events: none;
        }

        .adly-command-head,
        .adly-command-typing,
        .adly-command-output {
            position: relative;
            z-index: 1;
        }

        .adly-command-head {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .adly-command-logo {
            position: relative;
            width: 54px;
            height: 54px;
            flex: 0 0 54px;
            border-radius: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: #ffffff;
            box-shadow: 0 14px 34px rgba(124, 58, 237, 0.2);
        }

        .adly-command-logo > img {
            width: 38px;
            height: 38px;
            border-radius: 12px;
        }

        .adly-command-source {
            position: absolute;
            right: -7px;
            bottom: -7px;
            width: 28px;
            height: 28px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            color: #ffffff;
            border: 2px solid #ffffff;
            box-shadow: 0 10px 20px rgba(15, 23, 42, 0.22);
            opacity: 0;
            transform: scale(0.72);
            animation: adly-command-source 25s ease-in-out infinite both;
        }

        .adly-command-source svg {
            width: 16px;
            height: 16px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .adly-command-source img {
            width: 16px;
            height: 16px;
            border-radius: 5px;
        }

        .adly-command-source.is-whatsapp { background: #22c55e; }
        .adly-command-source.is-telegram { background: #2aabee; }
        .adly-command-source.is-web { background: #475569; }
        .adly-command-source.is-app { background: #ffffff; color: #7c3aed; }
        .adly-command-source.active-1 { animation-delay: 0s; }
        .adly-command-source.active-2 { animation-delay: 5s; }
        .adly-command-source.active-3 { animation-delay: 10s; }
        .adly-command-source.active-4 { animation-delay: 15s; }
        .adly-command-source.active-5 { animation-delay: 20s; }

        .adly-command-head strong {
            display: block;
            color: #4c1d95;
            font-size: 22px;
            line-height: 1;
            font-weight: 900;
        }

        .adly-command-head .adly-listening-core-status {
            margin-top: 6px;
            color: #64748b;
            font-size: 12px;
            font-weight: 800;
        }

        .adly-command-typing {
            display: flex;
            gap: 7px;
            align-items: center;
            margin-top: 22px;
            opacity: 0;
            animation: adly-command-typing 5s ease-in-out infinite both;
        }

        .adly-command-typing span {
            width: 9px;
            height: 9px;
            border-radius: 999px;
            background: #7c3aed;
            animation: adly-command-dot 0.9s ease-in-out infinite;
        }

        .adly-command-typing span:nth-child(2) { animation-delay: 0.14s; }
        .adly-command-typing span:nth-child(3) { animation-delay: 0.28s; }

        .adly-command-output {
            min-height: 42px;
            margin-top: 14px;
            padding: 12px 14px;
            border-radius: 18px;
            background: #f5f3ff;
            border: 1px solid rgba(124, 58, 237, 0.15);
            color: #4c1d95;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
        }

        .adly-command-output .adly-listening-output-text {
            position: absolute;
            inset: 12px 14px;
            display: flex;
            align-items: center;
            justify-content: flex-start;
            color: #4c1d95;
            font-size: 14px;
            font-weight: 900;
            line-height: 1.35;
            opacity: 0;
            transform: translateY(8px);
            animation: adly-command-output 25s ease-in-out infinite both;
        }

        [dir="rtl"] .adly-command-output .adly-listening-output-text {
            justify-content: flex-end;
        }

        .adly-command-output .output-1 { animation-delay: 0s; }
        .adly-command-output .output-2 { animation-delay: 5s; }
        .adly-command-output .output-3 { animation-delay: 10s; }
        .adly-command-output .output-4 { animation-delay: 15s; }
        .adly-command-output .output-5 { animation-delay: 20s; }

        .adly-command-request {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            max-width: 224px;
            padding: 10px 12px;
            border-radius: 18px;
            background: rgba(255, 255, 255, 0.94);
            color: #111827;
            font-size: 12.5px;
            line-height: 1.35;
            font-weight: 850;
            box-shadow: 0 18px 42px rgba(2, 6, 23, 0.25);
            opacity: 0;
            transform: translateY(14px) scale(0.96);
            animation: adly-command-request 25s ease-in-out infinite both;
        }

        .adly-command-request::after {
            content: "";
            position: absolute;
            width: 42px;
            height: 2px;
            top: 50%;
            background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.62));
            opacity: 0.7;
        }

        .adly-command-request .adly-listening-source {
            width: 24px;
            height: 24px;
            flex: 0 0 24px;
        }

        .adly-command-request .adly-listening-source svg {
            width: 15px;
            height: 15px;
        }

        .adly-command-request.request-1 {
            right: 7%;
            top: 13%;
            animation-delay: 0s;
        }

        .adly-command-request.request-2 {
            left: 6%;
            top: 24%;
            animation-delay: 5s;
        }

        .adly-command-request.request-3 {
            right: 5%;
            bottom: 25%;
            animation-delay: 10s;
        }

        .adly-command-request.request-4 {
            left: 5%;
            bottom: 17%;
            animation-delay: 15s;
            max-width: 246px;
        }

        .adly-command-request.request-5 {
            right: 18%;
            bottom: 6%;
            color: #064e3b;
            background: rgba(220, 252, 231, 0.95);
            animation-delay: 20s;
        }

        .adly-command-request.request-1::after,
        .adly-command-request.request-3::after,
        .adly-command-request.request-5::after {
            right: 100%;
        }

        .adly-command-request.request-2::after,
        .adly-command-request.request-4::after {
            left: 100%;
            transform: scaleX(-1);
        }

        @keyframes adly-command-card-accent {
            0%, 18%, 80%, 100% {
                border-color: rgba(34, 197, 94, 0.55);
                box-shadow: 0 28px 70px rgba(2, 6, 23, 0.34), 0 0 34px rgba(34, 197, 94, 0.16);
            }
            20%, 38% {
                border-color: rgba(42, 171, 238, 0.6);
                box-shadow: 0 28px 70px rgba(2, 6, 23, 0.34), 0 0 34px rgba(42, 171, 238, 0.16);
            }
            40%, 58% {
                border-color: rgba(148, 163, 184, 0.62);
                box-shadow: 0 28px 70px rgba(2, 6, 23, 0.34), 0 0 34px rgba(148, 163, 184, 0.14);
            }
            60%, 78% {
                border-color: rgba(124, 58, 237, 0.62);
                box-shadow: 0 28px 70px rgba(2, 6, 23, 0.34), 0 0 34px rgba(124, 58, 237, 0.16);
            }
        }

        @keyframes adly-command-source {
            0%, 3% { opacity: 0; transform: scale(0.72); }
            5%, 18% { opacity: 1; transform: scale(1); }
            20%, 100% { opacity: 0; transform: scale(0.82); }
        }

        @keyframes adly-command-request {
            0%, 3% { opacity: 0; transform: translateY(14px) scale(0.96); }
            5%, 13% { opacity: 1; transform: translateY(0) scale(1); }
            16%, 18% { opacity: 0.52; transform: translateY(0) scale(1); filter: grayscale(0.75); }
            20%, 100% { opacity: 0; transform: translateY(-8px) scale(0.98); filter: grayscale(1); }
        }

        @keyframes adly-command-typing {
            0%, 22%, 70%, 100% { opacity: 0; transform: translateY(4px); }
            30%, 58% { opacity: 1; transform: translateY(0); }
        }

        @keyframes adly-command-dot {
            0%, 100% { opacity: 0.45; transform: translateY(0); }
            50% { opacity: 1; transform: translateY(-4px); }
        }

        @keyframes adly-command-output {
            0%, 7% { opacity: 0; transform: translateY(8px); }
            9%, 17% { opacity: 1; transform: translateY(0); }
            20%, 100% { opacity: 0; transform: translateY(-7px); }
        }

        @keyframes product-power-flow {
            0%, 14% { stroke-dashoffset: 240; opacity: 0; }
            24%, 44% { stroke-dashoffset: 0; opacity: 1; }
            70%, 100% { stroke-dashoffset: -240; opacity: 0; }
        }

        @keyframes product-power-branch-flow {
            0%, 30% { stroke-dashoffset: 180; opacity: 0; }
            42%, 62% { stroke-dashoffset: 0; opacity: 1; }
            86%, 100% { stroke-dashoffset: -180; opacity: 0; }
        }

        @keyframes product-power-node-pulse {
            0%, 28%, 100% { box-shadow: 0 14px 30px rgba(15, 23, 42, 0.12); transform: scale(1); }
            38%, 56% { box-shadow: 0 18px 44px rgba(124, 58, 237, 0.28); transform: scale(1.06); }
        }

        @keyframes product-power-platform-pulse {
            0%, 36%, 100% { border-color: #e7eaf1; transform: scale(1); }
            48%, 62% { border-color: #a78bfa; color: #6d28d9; transform: scale(1.08); }
        }

        @keyframes product-power-shimmer {
            0%, 48% { transform: translateX(-120%); }
            72%, 100% { transform: translateX(120%); }
        }

        @media (max-width: 980px) {
            .product-power-feature {
                flex-direction: column;
                align-items: center;
                gap: 28px;
            }

            .product-power-final-inner {
                flex-direction: column;
                align-items: flex-start;
                gap: 12px;
            }

            .product-power-tool-grid {
                flex-wrap: wrap;
            }

            .product-power-final-title {
                white-space: normal;
            }

            .product-power-media,
            .product-power-copy,
            .adly-listening {
                width: 100%;
                max-width: 512px;
            }

            .product-power-copy {
                order: 1;
            }

            .product-power-media {
                order: 2;
            }

            .product-power-feature > .product-power-actions.is-below-media {
                order: 3;
                width: 100%;
                max-width: 512px;
                margin: 0 auto;
            }

            .product-power-copy {
                margin: 0 auto;
            }

            .adly-listening {
                grid-template-columns: 1fr;
                margin: 10px auto 54px;
                max-width: 760px;
                padding: 28px;
            }

            .adly-listening-motion {
                min-height: 344px;
            }

            .adly-listening-device {
                min-height: 344px;
            }
        }

        @media (max-width: 768px) {
            .product-power {
                padding: 28px 0 34px;
            }

            .product-power-header {
                margin-bottom: 34px;
            }

            .product-power-stack {
                gap: 0;
            }

            .product-power-feature {
                gap: 24px;
                margin-bottom: 10px;
                padding: 18px 0 66px;
            }

            .product-power-feature + .product-power-feature {
                padding-top: 42px;
            }

            .product-power-feature::after {
                content: "";
                position: absolute;
                left: 50%;
                bottom: 25px;
                width: min(230px, 58vw);
                height: 1px;
                transform: translateX(-50%);
                background: linear-gradient(90deg, transparent, rgba(124, 58, 237, 0.22), transparent);
            }

            .product-power-feature-title {
                font-size: 31px;
            }

            .product-power-copy p {
                font-size: 15px;
            }

            .product-power-actions {
                flex-direction: column;
                align-items: stretch;
            }

            .product-power-tool-grid {
                gap: 7px;
                justify-content: flex-start;
            }

            .product-power-tool {
                padding: 7px 9px;
            }

            .product-power-node {
                width: 48px;
                height: 48px;
                font-size: 13px;
            }

            .product-power-node.is-platform {
                width: 43px;
                height: 43px;
            }

            .adly-listening {
                border-radius: 26px;
                padding: 24px 18px;
            }

            .adly-listening-title {
                font-size: 31px;
            }

            .adly-listening-desc {
                font-size: 15px;
            }

            .adly-listening-motion,
            .adly-listening-device {
                min-height: 320px;
            }

            .adly-listening-channel-label {
                display: none;
            }

            .adly-listening-channel {
                padding: 8px;
            }

            .adly-listening-core {
                width: min(218px, 72%);
                padding: 14px;
            }

            .adly-listening-bubble {
                max-width: 184px;
                font-size: 11px;
            }

            .product-power-media-shell.is-adly-listening .adly-listening-motion,
            .product-power-media-shell.is-adly-listening .adly-listening-device {
                min-height: 0;
            }

            .adly-command-card {
                width: min(265px, 62%);
                min-height: 166px;
                padding: 16px;
            }

            .adly-command-request {
                max-width: 178px;
                padding: 9px 10px;
                font-size: 11px;
            }

            .adly-command-request.request-1 {
                right: 4%;
                top: 12%;
            }

            .adly-command-request.request-2 {
                left: 4%;
                top: 22%;
            }

            .adly-command-request.request-3 {
                right: 4%;
                bottom: 24%;
            }

            .adly-command-request.request-4 {
                left: 4%;
                bottom: 16%;
                max-width: 190px;
            }

            .adly-command-request.request-5 {
                right: 10%;
                bottom: 5%;
            }
        }

        @media (prefers-reduced-motion: reduce) {
            .product-power-network-flow,
            .product-power-node,
            .product-power-placeholder::before,
            .product-power-final::before,
            .adly-listening-channel,
            .adly-listening-core,
            .adly-listening-wave span,
            .adly-listening-bubble,
            .adly-command-card,
            .adly-command-source,
            .adly-command-request,
            .adly-command-typing,
            .adly-command-typing span,
            .adly-command-output .adly-listening-output-text {
                animation: none;
            }

            .product-power-network-flow {
                stroke-dashoffset: 0;
                opacity: 0.85;
            }

            .adly-command-source.active-1,
            .adly-command-request.request-1,
            .adly-command-output .output-1 {
                opacity: 1;
                transform: none;
            }

            .adly-command-typing {
                opacity: 0;
            }
        }

        .landing-word-chunk .landing-adly-logo,
        .landing-word-chunk .landing-brain-icon,
        .landing-word-chunk .landing-team-icon,
        .landing-word-chunk .landing-megaphone-icon,
        .landing-word-chunk .landing-cost-icon,
        .landing-word-chunk .social-icon-rotator {
            opacity: 0.25;
            filter: grayscale(1);
        }

        .reveal-ready .landing-word-chunk .landing-adly-logo,
        .reveal-ready .landing-word-chunk .landing-brain-icon,
        .reveal-ready .landing-word-chunk .landing-team-icon,
        .reveal-ready .landing-word-chunk .landing-megaphone-icon,
        .reveal-ready .landing-word-chunk .landing-cost-icon,
        .reveal-ready .landing-word-chunk .social-icon-rotator {
            transition: opacity 400ms ease, filter 400ms ease;
        }

        .landing-word-chunk.is-visible .landing-adly-logo,
        .landing-word-chunk.is-visible .landing-brain-icon,
        .landing-word-chunk.is-visible .landing-team-icon,
        .landing-word-chunk.is-visible .landing-megaphone-icon,
        .landing-word-chunk.is-visible .landing-cost-icon,
        .landing-word-chunk.is-visible .social-icon-rotator {
            opacity: 1;
            filter: grayscale(0);
        }

        .landing-cost-icon {
            display: inline-block;
            width: 1.8em;
            height: 1.8em;
            vertical-align: -0.28em;
            margin: 0 0.15em;
            object-fit: contain;
            animation: brainFloatLtr 1.4s ease-in-out infinite;
        }

        [dir="rtl"] .landing-cost-icon {
            animation-name: brainFloatRtl;
        }

        .landing-megaphone-icon {
            display: inline-block;
            width: 1.49em;
            height: 1.49em;
            vertical-align: -0.28em;
            margin: 0 0.15em;
            object-fit: contain;
            animation: adlyFloatLtr 1.6s ease-in-out infinite;
        }

        [dir="rtl"] .landing-megaphone-icon {
            animation-name: adlyFloatRtl;
        }

        .landing-adly-logo {
            display: inline-block;
            width: 1.4em;
            height: 1.4em;
            vertical-align: -0.28em;
            margin: 0 0.1em;
            object-fit: contain;
            border-radius: 0.25em;
            animation: adlyFloatLtr 1.6s ease-in-out infinite;
        }

        [dir="rtl"] .landing-adly-logo {
            animation-name: adlyFloatRtl;
        }

        @keyframes adlyFloatLtr {
            0%, 100% {
                transform: translateX(0) translateY(0) scale(1);
                filter: drop-shadow(0 2px 4px rgba(147, 51, 234, 0.15));
            }
            50% {
                transform: translateX(-8px) translateY(-4px) scale(1.12);
                filter: drop-shadow(0 6px 14px rgba(147, 51, 234, 0.5));
            }
        }

        @keyframes adlyFloatRtl {
            0%, 100% {
                transform: translateX(0) translateY(0) scale(1);
                filter: drop-shadow(0 2px 4px rgba(147, 51, 234, 0.15));
            }
            50% {
                transform: translateX(8px) translateY(-4px) scale(1.12);
                filter: drop-shadow(0 6px 14px rgba(147, 51, 234, 0.5));
            }
        }

        .landing-brain-icon {
            display: inline-block;
            width: 1.47em;
            height: 1.47em;
            vertical-align: -0.28em;
            margin: 0 0.1em;
            object-fit: contain;
            mix-blend-mode: multiply;
            background: transparent;
            animation: brainFloatLtr 1.4s ease-in-out infinite;
        }

        [dir="rtl"] .landing-brain-icon {
            animation-name: brainFloatRtl;
        }

        @keyframes brainFloatLtr {
            0%, 100% {
                transform: translateX(0) translateY(0) rotate(0deg);
                filter: drop-shadow(0 2px 3px rgba(236, 72, 153, 0.15));
            }
            50% {
                transform: translateX(8px) translateY(-4px) rotate(5deg);
                filter: drop-shadow(0 6px 12px rgba(236, 72, 153, 0.5));
            }
        }

        @keyframes brainFloatRtl {
            0%, 100% {
                transform: translateX(0) translateY(0) rotate(0deg);
                filter: drop-shadow(0 2px 3px rgba(236, 72, 153, 0.15));
            }
            50% {
                transform: translateX(-8px) translateY(-4px) rotate(-5deg);
                filter: drop-shadow(0 6px 12px rgba(236, 72, 153, 0.5));
            }
        }

        .landing-team-icon {
            display: inline-block;
            width: 1.54em;
            height: 1.54em;
            vertical-align: -0.28em;
            margin: 0 0.1em;
            object-fit: contain;
            mix-blend-mode: multiply;
            animation: teamFloatLtr 2s ease-in-out infinite;
        }

        [dir="rtl"] .landing-team-icon {
            animation-name: teamFloatRtl;
        }

        @keyframes teamFloatLtr {
            0%, 100% {
                transform: translateX(0) translateY(0) scale(1);
                filter: drop-shadow(0 1px 2px rgba(99, 102, 241, 0.1));
            }
            50% {
                transform: translateX(-8px) translateY(-4px) scale(1.1);
                filter: drop-shadow(0 6px 12px rgba(99, 102, 241, 0.4));
            }
        }

        @keyframes teamFloatRtl {
            0%, 100% {
                transform: translateX(0) translateY(0) scale(1);
                filter: drop-shadow(0 1px 2px rgba(99, 102, 241, 0.1));
            }
            50% {
                transform: translateX(8px) translateY(-4px) scale(1.1);
                filter: drop-shadow(0 6px 12px rgba(99, 102, 241, 0.4));
            }
        }

        .social-icon-rotator {
            position: relative;
            display: inline-block;
            width: 1.17em;
            height: 1.17em;
            vertical-align: -0.22em;
            margin: 0 0.08em;
        }

        .social-icon {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            object-fit: contain;
            border-radius: 0.22em;
            opacity: 0;
            animation: socialIconSwap 1.8s linear infinite;
        }

        .social-icon-facebook {
            animation-delay: 0s;
        }

        .social-icon-instagram {
            animation-delay: 0.9s;
        }

        @keyframes socialIconSwap {
            0% { opacity: 1; }
            45% { opacity: 1; }
            55% { opacity: 0; }
            100% { opacity: 0; }
        }
        
        /* How It Works Section */
        .how-it-works-section {
            background: #ffffff;
            padding: 24px 0 52px;
        }

        .how-it-works {
            margin: 0 auto;
            max-width: 1080px;
            padding: 0;
        }

        .how-it-works-card {
            position: relative;
            overflow: hidden;
            border-radius: 30px;
            border: 1px solid rgba(226, 232, 240, 0.9);
            background: rgba(255, 255, 255, 0.86);
            box-shadow: 0 26px 70px rgba(71, 85, 105, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.92);
            padding: clamp(26px, 4vw, 44px);
            backdrop-filter: blur(10px);
        }

        .how-it-works-card::before {
            content: none;
        }

        .how-it-works-card > * {
            position: relative;
            z-index: 1;
        }

        .how-it-works-head {
            text-align: center;
        }
        
        .how-badge {
            display: inline-block;
            background: #f5f3ff;
            color: #6d28d9;
            border: 1px solid #e9d5ff;
            padding: 7px 16px;
            border-radius: 50px;
            font-size: 12px;
            font-weight: 600;
            margin-bottom: 14px;
            letter-spacing: 0.01em;
        }
        
        .how-it-works .section-title {
            font-size: clamp(30px, 3.4vw, 38px);
            font-weight: 800;
            line-height: 1.2;
            letter-spacing: -0.015em;
            color: #111827;
            margin-bottom: 6px;
        }

        .how-it-works .section-subtitle {
            color: #4b5563;
            font-size: 15px;
            font-weight: 500;
            line-height: 1.45;
            margin-bottom: 0;
        }
        
        .steps-container {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 24px;
            position: relative;
            margin-top: 28px;
            max-width: 980px;
            margin-left: auto;
            margin-right: auto;
        }
        
        .steps-line {
            position: absolute;
            top: 32px;
            left: 15%;
            right: 15%;
            height: 1px;
            background: rgba(147, 51, 234, 0.13);
            border-radius: 999px;
            z-index: 0;
        }
        
        .step {
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
            flex: 1;
            position: relative;
            z-index: 2;
            padding: 18px 14px;
            border-radius: 22px;
            background: rgba(255, 255, 255, 0.68);
            border: 1px solid rgba(237, 233, 254, 0.78);
        }
        
        .step-icon {
            width: 52px;
            height: 52px;
            border-radius: 18px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 10px;
            background: #ffffff;
            border: 1px solid #e9d5ff;
            color: #6d28d9;
            box-shadow: 0 10px 24px rgba(124, 58, 237, 0.1);
        }

        .step-icon svg {
            width: 20px;
            height: 20px;
            stroke: currentColor;
            fill: none;
            stroke-width: 1.9;
            stroke-linecap: round;
            stroke-linejoin: round;
        }
        
        .step-title {
            font-size: 20px;
            font-weight: 400;
            color: #0f172a;
            margin-bottom: 6px;
            line-height: 1.28;
            letter-spacing: -0.015em;
        }
        
        .step-desc {
            font-size: 13px;
            color: #667085;
            max-width: 210px;
            line-height: 1.45;
            font-weight: 500;
        }

        .how-cta-wrap {
            margin-top: 20px;
            text-align: center;
        }

        .how-cta-wrap .hero-buttons {
            margin-bottom: 0;
        }

        .how-cta-wrap .hero-cta {
            width: 100%;
            max-width: min(360px, 100%);
            min-height: 54px;
            font-size: 17px;
            padding: 0 28px;
        }

        .how-cta-wrap .hero-cta-secondary {
            text-decoration: none;
        }

        .how-cta-microcopy {
            color: #5b6170;
            font-size: 13px;
            font-weight: 600;
            margin-top: 10px;
        }
        
        @media (max-width: 768px) {
            .steps-container {
                flex-direction: column;
                gap: 18px;
                align-items: center;
                margin-top: 18px;
            }
            
            .steps-line {
                display: none;
            }
            
            .how-it-works-section {
                padding: 18px 0 34px;
            }

            .how-it-works-card {
                border-radius: 24px;
                padding: 24px 18px;
            }

            .how-it-works .section-title {
                margin-bottom: 6px;
            }

            .how-it-works .section-subtitle {
                font-size: 14px;
                line-height: 1.42;
            }

            .step {
                width: 100%;
                max-width: 320px;
            }

            .step-icon {
                width: 46px;
                height: 46px;
                border-radius: 14px;
                margin-bottom: 8px;
            }

            .step-icon svg {
                width: 18px;
                height: 18px;
            }

            .step-title {
                font-size: 18px;
                margin-bottom: 4px;
            }

            .step-desc {
                font-size: 12.5px;
                line-height: 1.4;
                max-width: 230px;
            }

            .how-cta-wrap {
                margin-top: 18px;
            }

            .how-cta-wrap .hero-cta {
                max-width: min(300px, 100%);
                min-height: 50px;
                font-size: 16px;
                padding: 0 22px;
            }

            .how-cta-microcopy {
                font-size: 12px;
                margin-top: 8px;
            }
        }
        
        /* Before/After Comparison Section */
        .comparison {
            background: lab(34 73.38 -110.43 / 0.04);
            padding: 60px 0 80px;
        }

        /* Match tool-compare header typography and title → subtitle gap */
        .comparison-header {
            text-align: center;
            margin-bottom: 36px;
        }

        .comparison .section-title {
            font-size: clamp(32px, 5vw, 52px);
            font-weight: 400;
            color: #7c3aed;
            line-height: 1.2;
            margin-bottom: 10px;
        }

        .comparison .section-subtitle {
            font-size: clamp(16px, 2vw, 20px);
            color: #667085;
            font-weight: 500;
            max-width: 540px;
            margin-left: auto;
            margin-right: auto;
            line-height: 1.5;
            margin-bottom: 0;
        }
        
        .comparison-card {
            background: #ffffff;
            border-radius: 20px;
            border: 1px solid #e5e7eb;
            box-shadow: 0 8px 22px rgba(15, 23, 42, 0.06);
            overflow: hidden;
            max-width: 1100px;
            margin: 0 auto;
        }
        
        .comparison-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0;
            background: #eef2f7;
        }
        
        .comparison-column {
            padding: 30px;
            background: #ffffff;
        }
        
        .comparison-column.before {
            border-top: 1px solid #f6d4d4;
        }
        
        .comparison-column.after {
            border-top: 1px solid #d2eedb;
        }
        
        .comparison-badge {
            display: inline-block;
            padding: 8px 18px;
            border-radius: 50px;
            font-size: 13px;
            font-weight: 700;
            margin-bottom: 18px;
            border: 1px solid transparent;
            box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
        }
        
        .before .comparison-badge {
            background: #fff6f6;
            color: #9f1239;
            border-color: #f8d7da;
        }
        
        .after .comparison-badge {
            background: #f2fbf6;
            color: #166534;
            border-color: #d1eadc;
        }
        
        .comparison-list {
            list-style: none;
            padding: 0;
            margin: 0;
        }
        
        .comparison-list li {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 13px 14px;
            margin-bottom: 8px;
            border-radius: 12px;
            border: 1px solid #edf1f7;
            background: #fafbfc;
            font-size: 15px;
            font-weight: 500;
        }

        .comparison-list li:last-child {
            margin-bottom: 0;
        }
        
        .before .comparison-list li {
            color: #425466;
        }
        
        .after .comparison-list li {
            color: #1e293b;
        }
        
        .comparison-list .icon {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 24px;
            height: 24px;
            border-radius: 999px;
            border: 1px solid #dbe3ef;
            background: #ffffff;
            color: #64748b;
            font-size: 11px;
            font-weight: 700;
            flex-shrink: 0;
        }

        .comparison-text {
            line-height: 1.65;
        }
        
        .comparison-list .status {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 22px;
            height: 22px;
            border-radius: 999px;
            font-size: 12px;
            font-weight: 700;
            flex-shrink: 0;
            margin-inline-start: auto;
            border: 1px solid #e5e7eb;
        }
        
        .before .status {
            color: #dc2626;
            background: #fff5f5;
            border-color: #fbcaca;
        }
        
        .after .status {
            color: #15803d;
            background: #f0fdf4;
            border-color: #b7e4c7;
        }

        .comparison-cta-wrap {
            margin-top: 22px;
            text-align: center;
        }

        .comparison-cta-microcopy {
            font-size: 14px;
            font-weight: 600;
            color: #4b5563;
            margin-bottom: 12px;
        }

        .comparison-buttons {
            margin-bottom: 0;
        }
        
        @media (max-width: 768px) {
            .comparison-grid {
                grid-template-columns: 1fr;
            }
            
            .comparison-column {
                padding: 22px 16px;
            }
            
            .comparison-list li {
                padding: 12px 12px;
                font-size: 14px;
            }

            .comparison-badge {
                margin-bottom: 14px;
            }

            .comparison-cta-wrap {
                margin-top: 16px;
            }

            .comparison-buttons .hero-cta,
            .comparison-buttons .hero-cta-secondary {
                width: 100%;
                max-width: 320px;
            }
        }
        
        .portfolio-row {
            overflow: hidden;
            width: 100%;
            margin-bottom: 24px;
            border-radius: 24px;
        }

        .portfolio-track {
            display: inline-flex;
            /* No gap here - copies must be seamless for perfect loop */
            animation: scroll-left 62s linear infinite;
            will-change: transform;
        }
        
        .portfolio-track.reverse {
            animation: scroll-right 62s linear infinite;
        }
        
        .portfolio-scroll {
            display: flex;
            flex-shrink: 0;
            gap: 24px;
            /* Add padding on right so there's space before next copy starts */
            padding-right: 24px;
        }
        
        /* Seamless left scroll: move by exactly one copy (50% of track) */
        @keyframes scroll-left {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }
        
        /* Seamless right scroll: start at -50%, end at 0 */
        @keyframes scroll-right {
            0% { transform: translateX(-50%); }
            100% { transform: translateX(0); }
        }
        
        .portfolio-item {
            flex-shrink: 0;
            width: 304px;
            aspect-ratio: 1 / 1;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 16px 36px rgba(8, 15, 28, 0.28);
            transition: transform 0.3s ease;
        }
        
        .portfolio-item:hover {
            transform: scale(1.05);
        }
        
        .portfolio-item img,
        .portfolio-item video {
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            background: #12081f;
        }
        
        .video-item {
            flex-shrink: 0;
            width: 188px;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 16px 36px rgba(8, 15, 28, 0.28);
            transition: transform 0.3s ease;
        }
        
        .video-item:hover {
            transform: scale(1.05);
        }
        
        .video-item video,
        .video-item img {
            width: 100%;
            height: auto;
            display: block;
            border-radius: 16px;
            object-fit: cover;
            background: #12081f;
        }

        /* ── See More Results ──────────────────────────────────── */
        .portfolio-more {
            position: relative;
            z-index: 2;
            background: #0a0518;
            padding: 0 0 72px;
            direction: ltr;
            text-align: center;
        }

        .portfolio-more-btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin: 21.6px auto 0;
            min-height: 52px;
            padding: 10px 28px;
            background: rgba(255,255,255,0.07);
            border: 1.5px solid rgba(255,255,255,0.18);
            border-radius: 999px;
            color: #ffffff;
            font-family: var(--font-sans);
            font-size: 13px;
            line-height: 1.25;
            font-weight: 600;
            letter-spacing: 0;
            direction: ltr;
            cursor: pointer;
            transition: background 0.2s ease, border-color 0.2s ease;
        }

        .portfolio-more-btn-text {
            direction: rtl;
            unicode-bidi: plaintext;
        }

        .portfolio-more-btn:hover {
            background: rgba(255,255,255,0.13);
            border-color: rgba(255,255,255,0.32);
        }

        .portfolio-more-btn-arrow {
            width: 18px;
            height: 18px;
            transition: transform 0.3s ease;
            flex-shrink: 0;
        }

        .portfolio-more-btn[aria-expanded="true"] .portfolio-more-btn-arrow {
            transform: rotate(180deg);
        }

        .portfolio-more-panel {
            padding-top: 32px;
        }

        @media (max-width: 768px) {
            .portfolio-viewport {
                width: min(100%, 1440px);
                margin: 0 auto;
                padding: 0 clamp(18px, 4vw, 42px);
            }

            .portfolio-viewport::after {
                background-image:
                    radial-gradient(
                        ellipse 95% 50% at 50% -40%,
                        rgba(233, 213, 255, 0.11) 0%,
                        transparent 48%
                    ),
                    linear-gradient(
                        90deg,
                        rgba(10, 5, 24, 0.78) 0%,
                        rgba(10, 5, 24, 0.42) 8%,
                        rgba(10, 5, 24, 0.14) 18%,
                        transparent 30%,
                        transparent 70%,
                        rgba(10, 5, 24, 0.14) 82%,
                        rgba(10, 5, 24, 0.42) 92%,
                        rgba(10, 5, 24, 0.78) 100%
                    );
            }

            .portfolio-more {
                padding-bottom: 57px;
            }
            .portfolio-more-btn {
                margin-top: 40px;
            }
            .portfolio {
                padding: 48px 0 0;
            }

            .portfolio-row {
                margin-bottom: 0;
            }

            .portfolio-scroll {
                gap: 16px;
                padding-right: 16px;
            }
        }

        .portfolio-more-panel[hidden] {
            display: none;
        }

        .portfolio-more-filters {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            flex-wrap: wrap;
            margin-bottom: 28px;
            direction: rtl;
        }

        .portfolio-more-pill {
            display: inline-flex;
            align-items: center;
            padding: 8px 20px;
            border: 1.5px solid rgba(255,255,255,0.2);
            border-radius: 999px;
            background: transparent;
            color: rgba(255,255,255,0.65);
            font-size: 13px;
            font-weight: 600;
            font-family: var(--font-sans);
            cursor: pointer;
            transition: all 0.18s ease;
            white-space: nowrap;
        }

        .portfolio-more-pill:hover {
            border-color: rgba(255,255,255,0.45);
            color: #ffffff;
            background: rgba(255,255,255,0.06);
        }

        .portfolio-more-pill.active {
            background: var(--brand-primary, #7c3aed);
            border-color: var(--brand-primary, #7c3aed);
            color: #ffffff;
        }

        .portfolio-more-tagline {
            text-align: center;
            margin: 32px auto 0;
            max-width: 600px;
            padding: 0 24px;
            direction: inherit;
            animation: tagline-fade-in 0.4s ease both;
        }

        @keyframes tagline-fade-in {
            from { opacity: 0; transform: translateY(10px); }
            to   { opacity: 1; transform: translateY(0); }
        }

        .portfolio-more-tagline-title {
            font-family: var(--font-sans);
            font-size: 22px;
            font-weight: 400;
            color: #ffffff;
            margin: 0 0 16px;
            line-height: 1.5;
        }

        .portfolio-more-tagline-subtitle {
            font-family: var(--font-sans);
            font-size: 16.9px;
            font-weight: 400;
            color: rgba(255,255,255,0.6);
            margin: 0 0 10px;
            line-height: 1.7;
        }

        .portfolio-more-tagline-subtitle:last-child {
            margin-bottom: 0;
        }

        .landing-examples-modal {
            position: fixed;
            inset: 0;
            z-index: 8800;
            /* Column + top-aligned: avoids flex row centering clipping tall dialogs (lose close button above fold). */
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            overflow-x: hidden;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
            overscroll-behavior: contain;
            padding:
                max(clamp(12px, 2.2vw, 28px), env(safe-area-inset-top, 0px))
                clamp(12px, 2.2vw, 28px)
                max(clamp(12px, 2.2vw, 28px), env(safe-area-inset-bottom, 0px));
        }

        .landing-examples-modal[hidden] {
            display: none;
        }

        .landing-examples-backdrop {
            position: fixed;
            inset: 0;
            z-index: 0;
            background: rgba(2, 6, 23, 0.78);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
        }

        .landing-examples-dialog {
            position: relative;
            z-index: 1;
            flex-shrink: 0;
            width: min(1120px, 94vw);
            max-height: none;
            border-radius: 24px;
            border: 1px solid rgba(255, 255, 255, 0.16);
            background:
                radial-gradient(120% 140% at 100% 0%, rgba(124, 58, 237, 0.22), transparent 48%),
                radial-gradient(120% 140% at 0% 0%, rgba(59, 130, 246, 0.2), transparent 50%),
                linear-gradient(180deg, #0b1120 0%, #060913 100%);
            box-shadow: 0 42px 120px rgba(2, 6, 23, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.1);
            padding: clamp(18px, 2vw, 28px);
            overflow: visible;
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .landing-examples-close {
            position: absolute;
            top: 14px;
            inset-inline-end: 14px;
            width: 40px;
            height: 40px;
            border-radius: 999px;
            border: 1px solid rgba(255, 255, 255, 0.2);
            background: rgba(15, 23, 42, 0.56);
            color: #f8fafc;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: background 0.2s ease, transform 0.2s ease;
        }

        .landing-examples-close:hover {
            background: rgba(51, 65, 85, 0.82);
            transform: translateY(-1px);
        }

        .landing-examples-head {
            display: grid;
            gap: 8px;
            flex-shrink: 0;
            padding-inline-end: 52px;
        }

        .landing-examples-modal-title {
            margin: 0;
            color: #f8fafc;
            font-size: clamp(26px, 2.8vw, 34px);
            line-height: 1.2;
            letter-spacing: -0.02em;
            font-weight: 800;
        }

        .landing-examples-modal-subtitle {
            margin: 0;
            color: rgba(203, 213, 225, 0.88);
            font-size: 15px;
            line-height: 1.65;
            max-width: 80ch;
        }

        .landing-examples-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: clamp(12px, 1.5vw, 18px);
            padding: 3px;
        }

        .landing-examples-card {
            display: grid;
            gap: 10px;
            text-align: start;
            font-family: var(--font-sans);
            border: 1px solid rgba(148, 163, 184, 0.24);
            border-radius: 16px;
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.7) 0%, rgba(15, 23, 42, 0.52) 100%);
            padding: 10px;
            cursor: pointer;
            transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
        }

        .landing-examples-card:hover {
            transform: translateY(-3px);
            border-color: rgba(129, 140, 248, 0.66);
            box-shadow: 0 18px 30px rgba(2, 6, 23, 0.42);
        }

        .landing-examples-card-thumb {
            position: relative;
            border-radius: 12px;
            overflow: hidden;
            background: linear-gradient(180deg, rgba(15, 23, 42, 0.95) 0%, rgba(2, 6, 23, 0.95) 100%);
            border: 1px solid rgba(148, 163, 184, 0.2);
            aspect-ratio: 1 / 1;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .landing-examples-card-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center 22%;
            display: block;
        }

        .landing-examples-card-meta {
            display: grid;
            gap: 3px;
            min-height: 50px;
        }

        .landing-examples-card-title {
            color: #f8fafc;
            font-size: 13px;
            font-weight: 700;
            line-height: 1.45;
        }

        .landing-examples-card-cta {
            color: rgba(129, 140, 248, 0.96);
            font-size: 12px;
            font-weight: 600;
            line-height: 1.35;
        }

        .landing-examples-preview {
            position: fixed;
            inset: 0;
            z-index: 9100;
            padding: 0;
            /* Opaque-ish scrim without backdrop-blur — blur can make sharp PNG previews look muddy on Chrome/Safari (GPU composite). */
            background: rgba(2, 6, 23, 0.96);
            display: block;
        }

        .landing-examples-preview[hidden] {
            display: none;
        }

        .landing-examples-preview-close {
            position: absolute;
            top: clamp(14px, 2vw, 22px);
            inset-inline-end: clamp(14px, 2vw, 22px);
            width: 46px;
            height: 46px;
            border-radius: 999px;
            border: 1px solid rgba(255, 255, 255, 0.24);
            background: rgba(15, 23, 42, 0.72);
            color: #f8fafc;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
        }

        .landing-examples-preview-media {
            box-sizing: border-box;
            width: 100%;
            height: 100%;
            display: block;
            padding: clamp(12px, 2vw, 20px);
            overflow: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            touch-action: pan-x pan-y pinch-zoom;
        }

        /* Natural bitmap width when smaller than the preview area; shrink only when wider than this scroll viewport. */
        .landing-examples-preview-media img {
            box-sizing: border-box;
            display: block;
            width: auto;
            max-width: 100%;
            height: auto;
            max-height: none;
            border-radius: 14px;
            box-shadow: 0 28px 78px rgba(2, 6, 23, 0.62);
            object-fit: initial;
            margin: 0 auto;
        }


        @media (max-width: 760px) {
            .landing-examples-backdrop {
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
            }

            .landing-examples-preview {
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
            }

            .landing-examples-dialog {
                width: min(98vw, 520px);
                border-radius: 18px;
                padding: 16px;
            }

            .landing-examples-head {
                padding-inline-end: 46px;
            }

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

        .portfolio-more-items {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 16px;
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .portfolio-more-item {
            display: none;
        }

        .portfolio-more-item.visible {
            display: block;
        }

        .portfolio-more-item img {
            width: 100%;
            height: 100%;
            aspect-ratio: 1 / 1;
            object-fit: cover;
            border-radius: 14px;
            display: block;
            cursor: pointer;
        }

        .portfolio-more-item video {
            width: 100%;
            height: 100%;
            aspect-ratio: 9 / 16;
            object-fit: cover;
            border-radius: 14px;
            display: block;
            cursor: pointer;
            background: #12081f;
        }

        .portfolio-more-placeholder {
            border-radius: 14px;
            background: linear-gradient(135deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02));
            border: 1px solid rgba(255,255,255,0.08);
            aspect-ratio: 1 / 1;
            position: relative;
            overflow: hidden;
        }

        .portfolio-more-placeholder.video {
            aspect-ratio: 9 / 16;
        }

        .portfolio-more-placeholder.card {
            aspect-ratio: 1.75 / 1;
        }

        .portfolio-more-placeholder.landing {
            aspect-ratio: 3 / 4;
        }

        .portfolio-more-placeholder::after {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.04) 50%, transparent 100%);
            background-size: 200% 100%;
            animation: pf-shimmer 1.8s linear infinite;
        }

        @keyframes pf-shimmer {
            0% { background-position: -200% 0; }
            100% { background-position: 200% 0; }
        }

        /* ── Portfolio Lightbox Modal ───────────────────────────── */
        .pf-modal {
            position: fixed;
            inset: 0;
            z-index: 9000;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .pf-modal[hidden] {
            display: none;
        }

        .pf-modal-backdrop {
            position: absolute;
            inset: 0;
            z-index: 0;
            background: rgba(0, 0, 0, 0.88);
            backdrop-filter: blur(6px);
            -webkit-backdrop-filter: blur(6px);
        }

        .pf-modal-close {
            position: absolute;
            top: 20px;
            right: 20px;
            z-index: 3;
            width: 44px;
            height: 44px;
            border-radius: 50%;
            background: rgba(255,255,255,0.12);
            border: 1.5px solid rgba(255,255,255,0.2);
            color: #fff;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: background 0.18s ease;
        }

        .pf-modal-close:hover {
            background: rgba(255,255,255,0.22);
        }

        .pf-modal-close svg {
            width: 20px;
            height: 20px;
        }

        .pf-modal-inner {
            position: relative;
            z-index: 1;
            isolation: isolate;
            max-width: min(90vw, 960px);
            max-height: 90vh;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .pf-modal-media {
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .pf-modal-media img {
            max-width: min(90vw, 960px);
            max-height: 88vh;
            border-radius: 16px;
            box-shadow: 0 24px 80px rgba(0,0,0,0.6);
            display: block;
            object-fit: contain;
        }

        .pf-modal-media video {
            max-width: min(90vw, 480px);
            max-height: 88vh;
            border-radius: 16px;
            box-shadow: 0 24px 80px rgba(0,0,0,0.6);
            display: block;
        }

        /* Backdrop blur repaints fight iOS video chrome; solid backdrop avoids seek bar / controls flicker. */
        @media (max-width: 768px) {
            .pf-modal-backdrop {
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
            }
        }
        .pricing {
            position: relative;
            z-index: 2;
            background: transparent;
            padding: 56px 0 80px;
        }

        .pricing .section-title {
            color: #f8fafc;
        }

        .pricing .section-subtitle {
            color: rgba(226, 232, 240, 0.88);
        }

        .pricing-trust-row .trust-pill {
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.18);
            color: rgba(248, 250, 252, 0.9);
        }

        .pricing-billing-toggle-wrap {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 8px;
            margin: 22px 0 8px;
        }

        .pricing-billing-toggle {
            display: inline-flex;
            padding: 4px;
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.18);
            gap: 4px;
        }

        .pricing-billing-toggle button {
            border: none;
            background: transparent;
            padding: 10px 20px;
            border-radius: 11px;
            font-weight: 800;
            font-size: 14px;
            color: rgba(226, 232, 240, 0.86);
            cursor: pointer;
            font-family: inherit;
        }

        .pricing-billing-toggle button.is-active {
            background: #ffffff;
            color: #7c3aed;
            box-shadow: 0 8px 18px rgba(15, 23, 42, 0.22);
        }

        .pricing-billing-toggle-year {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            line-height: 1.15;
        }

        .pricing-billing-pill-tag {
            display: inline-block;
            padding: 3px 8px;
            border-radius: 6px;
            background: linear-gradient(135deg, #16a34a 0%, #15803d 100%);
            color: #ffffff;
            font-size: 10.5px;
            font-weight: 900;
            letter-spacing: 0.03em;
            line-height: 1.2;
            text-transform: uppercase;
            white-space: nowrap;
        }

        .pricing-billing-hint {
            max-width: 640px;
            margin: 0;
            color: rgba(226, 232, 240, 0.68);
            text-align: center;
            font-size: 11px;
            font-weight: 500;
            line-height: 1.45;
        }
        
        .pricing-trust-row {
            display: flex;
            justify-content: center;
            gap: 12px;
            flex-wrap: wrap;
            margin: 24px 0 32px;
        }

        @media (max-width: 768px) {
            .pricing-trust-row {
                margin-bottom: 14px;
            }
        }
        
        .trust-pill {
            padding: 8px 16px;
            border-radius: 50px;
            font-size: 13px;
            font-weight: 600;
        }
        
        .pricing-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 22px;
            align-items: stretch;
            direction: inherit;
        }

        .pricing.pricing-pending .pricing-trust-row,
        .pricing.pricing-pending .pricing-grid,
        .pricing.pricing-pending .pricing-social-proof,
        .pricing.pricing-pending .credits-note,
        .pricing.pricing-pending .credits-trial-note,
        .pricing.pricing-pending .pricing-custom {
            visibility: hidden;
        }

        [dir="rtl"] .pricing-grid {
            direction: rtl;
        }

        [dir="ltr"] .pricing-grid {
            direction: ltr;
        }
        
        .pricing-card {
            background: linear-gradient(180deg, #ffffff 0%, #fcfcfe 100%);
            padding: 30px 22px 22px;
            border-radius: 22px;
            border: 1px solid #e6e9f2;
            transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease, background 0.28s ease;
            position: relative;
            display: flex;
            flex-direction: column;
            height: 100%;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
        }
        
        .pricing-card:hover {
            transform: translateY(-4px);
            box-shadow: 0 18px 34px rgba(15, 23, 42, 0.08);
            border-color: #d8deea;
        }
        
        .pricing-card.featured {
            border-color: #c4b5fd;
            background: linear-gradient(180deg, #fcfaff 0%, #f7f2ff 100%);
            box-shadow: 0 18px 40px rgba(124, 58, 237, 0.16);
        }

        .pricing-card.featured::before {
            content: "";
            position: absolute;
            inset: 0;
            border-radius: inherit;
            pointer-events: none;
            box-shadow: inset 0 0 0 1px rgba(255,255,255,0.65);
        }
        
        .popular-badge {
            position: absolute;
            top: -11px;
            left: 50%;
            transform: translateX(-50%);
            background: linear-gradient(180deg, #8b5cf6 0%, #7c3aed 100%);
            color: white;
            padding: 6px 15px;
            border-radius: 50px;
            font-size: 11px;
            font-weight: 700;
            white-space: nowrap;
            letter-spacing: 0.2px;
            box-shadow: 0 10px 20px rgba(124, 58, 237, 0.2);
        }
        
        .pricing-card h3 {
            font-size: 24px;
            font-weight: 400;
            margin-bottom: 6px;
            color: #1a202c;
        }
        
        .plan-tagline {
            color: #64748b;
            font-size: 14px;
            margin-bottom: 14px;
            min-height: 21px;
        }

        .pricing-yearly-was-above:not([hidden]) {
            text-decoration: line-through;
            color: #94a3b8;
            font-size: 17px;
            font-weight: 700;
            line-height: 1.25;
            margin: 0 0 4px;
            font-variant-numeric: tabular-nums;
        }
        
        .price {
            font-size: 52px;
            font-weight: 900;
            color: #6d28d9;
            margin-bottom: 2px;
            line-height: 1;
            font-variant-numeric: tabular-nums;
        }
        
        .price span {
            font-size: 15px;
            font-weight: 600;
            color: #94a3b8;
            margin-inline-start: 4px;
        }
        
        .trial-note {
            color: #7c3aed;
            font-size: 13px;
            font-weight: 600;
            margin-bottom: 18px;
            line-height: 1.5;
            opacity: 0.9;
        }
        
        .pricing-features {
            list-style: none;
            padding: 0;
            margin: 0 0 10px 0;
            min-height: 0;
            flex: 1;
        }
        
        .pricing-features li {
            padding: 10px 0;
            font-size: 14px;
            line-height: 1.4;
            border-bottom: 1px solid #f4f6fa;
            position: relative;
            display: flex;
            align-items: flex-start;
            gap: 8px;
            color: #475467;
        }

        .pricing-features li:first-child {
            color: #111827;
            font-weight: 700;
            padding-top: 0;
            padding-bottom: 12px;
        }

        .pricing-features li:last-child {
            border-bottom: 0;
        }
        
        .pricing-features li:before {
            content: "✓";
            color: #16a34a;
            font-weight: 700;
            margin-left: 8px;
            flex-shrink: 0;
            opacity: 0.9;
        }

        .plan-feature-label {
            font-size: inherit;
            line-height: inherit;
            font-weight: inherit;
            color: inherit;
        }

        .plan-feature-inline {
            display: inline;
        }

        .plan-feature-help {
            width: 18px;
            height: 18px;
            border-radius: 999px;
            border: 1px solid #c4b5fd;
            background: #f5f3ff;
            color: #7c3aed;
            font-size: 12px;
            font-weight: 700;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            padding: 0;
            flex-shrink: 0;
            margin-inline-start: 6px;
        }

        .plan-feature-tip {
            position: absolute;
            top: calc(100% + 8px);
            left: 0;
            z-index: 8;
            min-width: 220px;
            max-width: 340px;
            padding: 9px 11px;
            border-radius: 10px;
            background: #111827;
            color: #ffffff;
            font-size: 12px;
            font-weight: 500;
            line-height: 1.45;
            opacity: 0;
            transform: translateY(4px);
            pointer-events: none;
            transition: opacity 0.12s ease, transform 0.12s ease;
        }

        [dir="rtl"] .plan-feature-tip {
            left: auto;
            right: 0;
        }

        .plan-feature-inline:has(.plan-feature-help:hover) + .plan-feature-tip,
        .plan-feature-inline:has(.plan-feature-help:focus) + .plan-feature-tip {
            opacity: 1;
            transform: translateY(0);
        }

        .pricing-card .pricing-features li:nth-child(n+7) {
            display: none;
        }

        .pricing-card.features-expanded .pricing-features li:nth-child(n+7) {
            display: flex;
        }

        .pricing-features-toggle {
            border: 0;
            background: transparent;
            color: #667085;
            font-size: 12px;
            font-weight: 700;
            font-family: inherit;
            padding: 6px 0 12px;
            display: block;
            width: 100%;
            text-align: start;
            cursor: pointer;
        }

        .pricing-features-toggle:hover {
            color: #7c3aed;
        }

        .pricing-cta-note {
            margin-top: 9px;
            text-align: center;
            color: #94a3b8;
            font-size: 12px;
            font-weight: 600;
        }
        
        .credits-note {
            text-align: center;
            margin-top: 20px;
            font-size: 13px;
            max-width: 760px;
            margin-left: auto;
            margin-right: auto;
            line-height: 1.55;
        }

        .pricing .credits-note {
            color: rgba(203, 213, 225, 0.92);
        }

        .credits-trial-note {
            margin-top: 6px;
            font-size: 12px;
            line-height: 1.55;
            text-align: center;
        }

        .pricing .credits-trial-note {
            color: rgba(148, 163, 184, 0.95);
        }

        .pricing-social-proof {
            margin-top: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 14px;
            font-size: 13px;
            font-weight: 600;
        }

        .pricing .pricing-social-proof {
            color: rgba(248, 250, 252, 0.88);
        }

        .pricing-social-proof-avatars {
            display: flex;
            align-items: center;
        }

        .pricing-social-proof-avatars .avatar-badge {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            border: 2px solid #ffffff;
            background: linear-gradient(135deg, #ddd6fe 0%, #c4b5fd 100%);
            color: #4c1d95;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 11px;
            font-weight: 700;
            margin-inline-end: -8px;
            overflow: hidden;
        }

        .pricing-social-proof-avatars .avatar-badge img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            background: #ffffff;
        }

        .pricing-social-proof-avatars .avatar-badge:last-child {
            margin-inline-end: 0;
        }
        
        .custom-plans {
            background: #f5f3ff;
            border: 1px solid #e9d5ff;
            border-radius: 16px;
            padding: 30px 40px;
            margin-top: 40px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 30px;
            box-shadow: 0 8px 22px rgba(124, 58, 237, 0.08);
        }
        
        .custom-plans h3 {
            font-size: 20px;
            font-weight: 700;
            margin-bottom: 8px;
            color: #1a202c;
        }
        
        .custom-points {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .custom-points li {
            color: #64748b;
            font-size: 14px;
            margin: 0 0 8px;
            display: flex;
            gap: 8px;
            align-items: center;
        }

        [dir="ltr"] .custom-points li {
            text-align: left;
            align-items: flex-start;
        }

        .custom-points li::before {
            content: "•";
            color: #7c3aed;
            font-weight: 900;
        }
        
        .custom-button {
            background: white;
            color: #7c3aed;
            border: 1.5px solid #c4b5fd;
            padding: 12px 24px;
            border-radius: 12px;
            text-decoration: none;
            font-weight: 700;
            font-size: 14px;
            transition: all 0.3s ease;
            white-space: nowrap;
        }
        
        .custom-button:hover {
            background: #7c3aed;
            color: white;
            border-color: #7c3aed;
        }
        
        /* Final CTA Section */
        .final-cta {
            background: linear-gradient(180deg, #ffffff 0%, #fcfcff 100%);
            padding: 48px 0;
            text-align: center;
        }
        
        .final-cta-badge {
            display: none;
            align-items: center;
            gap: 8px;
            background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
            color: white;
            padding: 8px 20px;
            border-radius: 999px;
            font-size: 14px;
            font-weight: 650;
            margin-bottom: 24px;
        }
        
        .final-cta h2 {
            font-size: 38px;
            font-weight: 400;
            color: #1a202c;
            margin-bottom: 12px;
            line-height: 1.18;
        }
        
        .final-cta h2 span {
            color: inherit;
            font-weight: inherit;
        }
        
        .final-cta-subtitle {
            font-size: 18px;
            color: #64748b;
            margin-bottom: 24px;
            max-width: 560px;
            margin-left: auto;
            margin-right: auto;
            line-height: 1.55;
        }
        
        .final-cta-buttons {
            display: flex;
            gap: 0;
            justify-content: center;
            flex-wrap: wrap;
            margin-bottom: 18px;
        }
        
        .final-cta-primary {
            background: #7c3aed;
            color: white;
            padding: 17px 40px;
            border-radius: 14px;
            text-decoration: none;
            font-weight: 760;
            font-size: 18px;
            display: inline-flex;
            align-items: center;
            gap: 10px;
            transition: all 0.3s ease;
            box-shadow: 0 12px 28px rgba(124, 58, 237, 0.22);
        }
        
        .final-cta-primary:hover {
            transform: translateY(-1px);
            background: #6d28d9;
            box-shadow: 0 16px 32px rgba(124, 58, 237, 0.26);
        }

        .final-cta-primary span {
            display: none;
        }
        
        .final-cta-trust {
            display: flex;
            justify-content: center;
            gap: 18px;
            flex-wrap: wrap;
        }
        
        .trust-item {
            display: flex;
            align-items: center;
            gap: 0;
            color: #667085;
            font-size: 13px;
            font-weight: 600;
        }
        
        .trust-item .icon {
            display: none;
        }
        
        /* Interest Modal Styles */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 10000;
            backdrop-filter: blur(5px);
        }

        .modal-overlay.show {
            display: flex;
            animation: fadeIn 0.3s ease-out;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        .modal-content {
            background: white;
            border-radius: 20px;
            max-width: 500px;
            width: 90%;
            max-height: 90vh;
            overflow-y: auto;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
            animation: slideUp 0.3s ease-out;
        }

        @keyframes slideUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .modal-header {
            background: linear-gradient(135deg, #9333ea 0%, #ec4899 100%);
            color: white;
            padding: 25px 30px;
            border-radius: 20px 20px 0 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .modal-header h2 {
            font-size: 24px;
            font-weight: 400;
            margin: 0;
        }

        .modal-close {
            background: none;
            border: none;
            color: white;
            font-size: 30px;
            cursor: pointer;
            padding: 0;
            width: 30px;
            height: 30px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            transition: background 0.3s ease;
        }

        .modal-close:hover {
            background: rgba(255, 255, 255, 0.2);
        }

        .modal-body {
            padding: 30px;
        }

        .modal-intro {
            color: #64748b;
            font-size: 16px;
            margin-bottom: 25px;
            text-align: center;
            line-height: 1.6;
        }

        .interest-form {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .form-group {
            display: flex;
            flex-direction: column;
        }

        .form-group label {
            color: #1a202c;
            font-weight: 600;
            margin-bottom: 8px;
            font-size: 14px;
        }

        .form-group input,
        .form-group select {
            padding: 15px;
            border: 2px solid #e2e8f0;
            border-radius: 10px;
            font-size: 16px;
            font-family: var(--font-sans);
            transition: border-color 0.3s ease;
        }

        .form-group input:focus,
        .form-group select:focus {
            outline: none;
            border-color: #9333ea;
            box-shadow: 0 0 0 3px rgba(147, 51, 234, 0.1);
        }

        .radio-group {
            display: flex;
            gap: 15px;
            margin-top: 10px;
        }

        .radio-label {
            display: flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
            padding: 12px 20px;
            border: 2px solid #e2e8f0;
            border-radius: 10px;
            transition: all 0.3s ease;
            flex: 1;
            justify-content: center;
        }

        .radio-label:hover {
            border-color: #9333ea;
            background: rgba(147, 51, 234, 0.05);
        }

        .radio-label input[type="radio"] {
            margin: 0;
            width: auto;
        }

        .radio-label input[type="radio"]:checked + span {
            color: #9333ea;
            font-weight: 700;
        }

        .radio-label:has(input[type="radio"]:checked) {
            border-color: #9333ea;
            background: rgba(147, 51, 234, 0.1);
        }

        .submit-btn {
            background: linear-gradient(135deg, #9333ea 0%, #ec4899 100%);
            color: white;
            border: none;
            padding: 18px 30px;
            border-radius: 11px;
            font-size: 18px;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(147, 51, 234, 0.3);
            font-family: var(--font-sans);
        }

        .submit-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(147, 51, 234, 0.4);
        }

        .submit-btn:disabled {
            opacity: 0.7;
            cursor: not-allowed;
            transform: none;
        }

        @media (max-width: 768px) {
            .modal-content {
                width: 95%;
                margin: 20px;
            }

            .modal-header {
                padding: 20px;
            }

            .modal-header h2 {
                font-size: 20px;
            }

            .modal-body {
                padding: 20px;
            }

            .radio-group {
                flex-direction: column;
                gap: 10px;
            }
        }
        
        @media (max-width: 768px) {
            .final-cta {
                padding: 48px 0;
            }

            .final-cta h2 {
                font-size: 26px;
            }
            
            .final-cta-buttons {
                align-items: center;
            }
            
            .final-cta-primary {
                width: 100%;
                max-width: 300px;
                justify-content: center;
                font-size: 16px;
                padding: 15px 22px;
            }
            
            .final-cta-trust {
                gap: 12px 18px;
            }

            .final-cta-subtitle {
                font-size: 16px;
                margin-bottom: 20px;
            }
        }
        
        .pricing-button {
            display: block;
            width: 100%;
            background: #ffffff;
            color: #5b21b6;
            text-align: center;
            padding: 12px 18px;
            border-radius: 12px;
            text-decoration: none;
            font-weight: 700;
            font-size: 15px;
            border: 1px solid #d8def0;
            transition: background-color 0.24s ease, border-color 0.24s ease, color 0.24s ease, box-shadow 0.24s ease, transform 0.24s ease;
            margin-top: auto;
            box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
        }
        
        .pricing-button:hover {
            background: #f8f7ff;
            border-color: #c4b5fd;
        }

        .pricing-card.featured .pricing-button {
            background: #7c3aed;
            color: white;
            border-color: transparent;
            box-shadow: 0 12px 26px rgba(124, 58, 237, 0.28);
        }

        .pricing-card.featured .pricing-button:hover {
            background: #6d28d9;
            transform: translateY(-1px);
            box-shadow: 0 12px 24px rgba(147, 51, 234, 0.3);
        }
        
        .plan-note {
            background: #fef2f2;
            border: 1px solid #fecaca;
            padding: 10px;
            border-radius: 8px;
            margin-top: 15px;
            font-size: 12px;
            color: #991b1b;
            text-align: center;
        }
        
        /* Footer */
        footer {
            background: #1a202c;
            color: white;
            padding: 60px 0 30px;
        }

        footer .container {
            max-width: 1200px;
        }
        
        .footer-content {
            display: grid;
            /* Brand + Quick links + Free tools + Publish & Compare + Resources + Policies */
            grid-template-columns: minmax(220px, 1.35fr) repeat(5, minmax(0, 1fr));
            gap: 24px 20px;
            margin-bottom: 40px;
            align-items: start;
        }

        .footer-links {
            min-width: 0;
        }

        .footer-publish .footer-compare-title {
            margin-top: 22px;
        }

        .footer-seo .footer-blog-list > .footer-seo-group-label:first-child {
            margin-top: 0;
            padding-top: 0;
        }
        
        .footer-brand h3 {
            font-size: 32px;
            font-weight: 400;
            margin-bottom: 15px;
        }
        
        .footer-brand p {
            color: #94a3b8;
            line-height: 1.8;
            max-width: 320px;
        }

        .footer-contact {
            margin-top: 16px;
        }

        .footer-contact-title {
            font-size: 16px;
            font-weight: 400;
            color: #e2e8f0;
            margin-bottom: 8px;
        }

        .footer-contact-line {
            color: #94a3b8;
            line-height: 1.8;
            margin: 0;
        }

        .footer-contact-email {
            color: #e2e8f0;
            text-decoration: none;
        }

        .footer-contact-wa {
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }
        .footer-contact-wa span {
            white-space: nowrap;
        }
        .footer-contact-wa .footer-wa-icon {
            flex: none;
            color: #25d366;
        }
        .footer-contact-email:hover {
            color: #ec4899;
            text-decoration: underline;
        }
        
        .footer-links h4 {
            font-size: 18px;
            font-weight: 400;
            margin-bottom: 15px;
        }

        .footer-links h4 .footer-blog-title-link {
            color: inherit;
            text-decoration: none;
            display: inline;
            padding: 0;
            font-size: inherit;
            font-weight: inherit;
            line-height: inherit;
        }

        .footer-links h4 .footer-blog-title-link:hover {
            color: #ec4899;
            text-decoration: none;
        }
        
        .footer-links ul {
            list-style: none;
            padding: 0;
        }
        
        .footer-links a:not(.footer-blog-title-link) {
            color: #94a3b8;
            text-decoration: none;
            display: block;
            padding: 8px 0;
            transition: color 0.3s ease;
        }
        
        .footer-links a:not(.footer-blog-title-link):hover {
            color: #ec4899;
        }

        .footer-seo-group-label {
            color: #e2e8f0;
            font-size: 13px;
            font-weight: 800;
            margin-top: 10px;
            padding-top: 4px;
        }
        
        .footer-bottom {
            text-align: center;
            padding-top: 30px;
            border-top: 1px solid #334155;
            color: #94a3b8;
        }

        .footer-payment-logos {
            display: flex;
            gap: 10px;
            flex-wrap: wrap;
            margin-top: 18px;
            align-items: center;
        }

        .footer-payment-logos img {
            height: 24px;
            width: auto;
            object-fit: contain;
            border-radius: 4px;
            background: #ffffff;
            padding: 3px 6px;
        }

        .footer-social {
            margin-top: 16px;
        }

        .footer-social a {
            display: inline-block;
        }

        .footer-social img {
            width: 22px;
            height: 22px;
            object-fit: cover;
            border-radius: 5px;
        }

        .footer-legal-note {
            margin-top: 8px;
            font-size: 13px;
            line-height: 1.6;
            color: #94a3b8;
        }

        .footer-rss-note,
        .footer-knowledge-note {
            margin-top: 8px;
            font-size: 13px;
            line-height: 1.6;
            color: #94a3b8;
        }

        .footer-rss-note a,
        .footer-knowledge-note a {
            color: #e2e8f0;
            text-decoration: underline;
            text-underline-offset: 2px;
        }

        .footer-rss-note a:hover,
        .footer-knowledge-note a:hover {
            color: #ec4899;
        }

        .footer-knowledge-note .footer-knowledge-title {
            color: #94a3b8;
            font-weight: 700;
            text-decoration: none;
        }

        .footer-knowledge-note .footer-knowledge-title:hover {
            color: #ec4899;
        }

        .footer-knowledge-note .footer-knowledge-title::after {
            content: ':';
        }
        
        /* Mobile Responsive */
        @media (max-width: 1200px) {
            .pricing-grid {
                grid-template-columns: repeat(2, 1fr);
            }
            
            .features-grid {
                grid-template-columns: repeat(3, 1fr);
            }
            
            .custom-plans {
                flex-direction: column;
                text-align: center;
            }
        }
        
        @media (max-width: 1024px) {
            .footer-content {
                grid-template-columns: 1fr 1fr;
            }

            .landing-message-inner {
                width: min(82%, 820px);
                max-width: none;
            }

            .portfolio-more-items {
                grid-template-columns: repeat(3, 1fr);
            }
        }
        
        @media (max-width: 768px) {
            .hero-title {
                font-size: 30px;
                line-height: 1.2;
            }

            section.hero-aurora-headline {
                padding: 52px 0 24px;
            }
            
            .hero.hero--continuation .subtitle {
                font-size: 15px;
            }
            
            .hero.hero--continuation .subtitle-secondary {
                font-size: 15px;
                margin-bottom: 18px;
            }

            .landing-message {
                padding: 40px 0 28px;
            }

            .landing-message-inner {
                width: 88%;
                max-width: none;
                text-align: start;
            }

            .landing-message-line {
                font-size: 24.35px;
                line-height: 1.45;
            }

            .landing-message-line + .landing-message-line {
                margin-top: 32px;
            }

            .founder-video {
                padding: 30px 0 44px;
            }

            .founder-video-card {
                border-radius: 0;
                padding: 0;
            }

            .founder-video-lead {
                font-size: 11.5px;
                line-height: 1.35;
                letter-spacing: 0.065em;
                margin-bottom: 9px;
            }

            .founder-video-proof {
                flex-direction: column;
                gap: 10px;
                margin-bottom: 14px;
                font-size: 18px;
            }

            .founder-video-proof .avatar-badge {
                width: 2.125rem;
                height: 2.125rem;
                margin-inline-end: -0.5rem;
            }

            .founder-video-frame {
                border-radius: 16px;
            }

            .founder-video-player {
                aspect-ratio: 16 / 9;
            }

            .hero-showcase-bridge {
                margin: 0 auto 28px;
                padding: 0 18px;
            }

            .hero-showcase-bridge__label {
                font-size: 22px;
            }

            .portfolio-more .founder-video {
                padding-top: 12px;
            }

            .portfolio-more .founder-video-title {
                font-size: 20px;
                margin-bottom: 8px;
            }

            [dir="ltr"] .credits-trial-note {
                text-align: center;
            }
            
            .hero-buttons {
                flex-direction: column;
                align-items: center;
            }
            
            .hero-cta:not(.hero-cta--stacked),
            .hero-cta-secondary {
                width: 100%;
                max-width: 300px;
                justify-content: center;
                font-size: 17px;
                min-height: 50px;
                padding: 0 26px;
            }

            .hero-cta.hero-cta--stacked {
                width: 100%;
                max-width: min(340px, 92vw);
                padding: 16px 22px;
            }
            
            .section-title {
                font-size: 28px;
            }

            .for-everyone .section-subtitle {
                margin-bottom: 18px;
            }

            .for-everyone .audience-card {
                padding: 24px 18px;
            }

            .for-everyone .audience-card h3 {
                font-size: 21px;
            }

            .audience-card p {
                font-size: 14px;
                margin-bottom: 10px;
            }

            .audience-card li {
                font-size: 13.5px;
                line-height: 1.42;
                padding: 8px 0;
            }
            
            .audience-grid,
            .feature-pillars,
            .features-grid,
            .pricing-grid {
                grid-template-columns: 1fr;
            }

            .pricing-card {
                padding: 24px 18px 18px;
                border-radius: 18px;
            }

            .price {
                font-size: 44px;
            }

            .trial-note {
                font-size: 13px;
                margin-bottom: 16px;
            }

            .pricing-features {
                margin: 0 0 8px 0;
            }

            .pricing-features li {
                padding: 9px 0;
                font-size: 13px;
                line-height: 1.38;
            }

            .pricing-features li:before {
                margin-left: 8px;
            }

            .pricing-features-toggle {
                font-size: 12px;
                font-family: inherit;
                padding-bottom: 8px;
            }

            .pricing-button {
                font-size: 14px;
                padding: 11px 16px;
            }
            
            /* Phones: two link columns side by side; the brand and contact block spans the full width. */
            .footer-content {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                gap: 28px 16px;
            }

            .footer-content > .footer-brand {
                grid-column: 1 / -1;
            }

            /* Every link stays visible. Free tools run full width in two columns; the long publish column
               spans two rows beside Resources and Quick links, so no short column leaves a gap. */
            .footer-content {
                align-items: start;
            }

            .footer-content > .footer-tools {
                grid-column: 1 / -1;
                grid-row: 2;
            }

            .footer-tools ul,
            .footer-policy ul {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
                column-gap: 16px;
            }

            .footer-content > .footer-publish {
                grid-column: 1;
                grid-row: 3 / span 2;
            }

            .footer-content > .footer-blog {
                grid-column: 2;
                grid-row: 3;
            }

            .footer-content > .footer-main {
                grid-column: 2;
                grid-row: 4;
            }

            .footer-content > .footer-policy {
                grid-column: 1 / -1;
                grid-row: 5;
            }

            .footer-links a:not(.footer-blog-title-link) {
                padding: 6px 0;
                line-height: 1.45;
            }
            
            .portfolio-item {
                width: 188px;
            }
            
            .video-item {
                width: 107px;
            }

            .portfolio-more-items {
                grid-template-columns: repeat(2, 1fr);
                padding: 0 16px;
            }
            
            .pricing-trust-row {
                gap: 8px;
                margin: 18px 0 24px;
            }

            .pricing-billing-toggle {
                width: min(100%, 340px);
            }

            .pricing-billing-toggle button {
                flex: 1;
                padding: 9px 10px;
                font-size: 12.5px;
            }

            .pricing-billing-pill-tag {
                font-size: 9px;
                padding: 3px 6px;
            }
            
            .trust-pill {
                font-size: 12px;
                padding: 7px 11px;
            }
            
            .pricing-social-proof {
                font-size: 12px;
                gap: 10px;
            }

            .pricing-card.plan-launch {
                order: 0;
            }

            .pricing-card.plan-starter {
                order: 1;
            }

            .pricing-card.plan-spark {
                order: 2;
            }

            .pricing-card.plan-growth {
                order: 3;
            }

            .pricing-card.plan-pro {
                order: 4;
            }
        }
        
        /* Mobile Header Fixes */
        @media (max-width: 600px) {
            header {
                padding: 10px 0;
            }
            
            .header-content {
                gap: 8px;
            }
            
            .logo {
                font-size: 22px;
                gap: 6px;
            }
            
            .logo-img {
                width: 32px;
                height: 32px;
            }
            
            .header-actions {
                gap: 8px;
                --header-action-pad-y: 8px;
                --header-action-pad-x: 14px;
                --header-action-font-size: 13px;
            }
            
            .lang-switcher {
                padding-inline-start: 10px;
                padding-inline-end: 8px;
            }

            .cta-button {
                padding: var(--header-action-pad-y) var(--header-action-pad-x);
                font-size: var(--header-action-font-size);
            }

            .homepage-subheader__grid {
                grid-template-columns: 1fr;
                gap: 16px;
                padding: 14px 0 16px;
            }
        }
        
        @media (max-width: 400px) {
            .logo {
                font-size: 20px;
            }
            
            .logo-img {
                width: 28px;
                height: 28px;
            }
            
            .header-actions {
                --header-action-pad-y: 7px;
                --header-action-pad-x: 12px;
                --header-action-font-size: 12px;
            }
            
            .lang-switcher {
                padding-inline-start: 8px;
                padding-inline-end: 6px;
            }

            .cta-button {
                padding: var(--header-action-pad-y) var(--header-action-pad-x);
                font-size: var(--header-action-font-size);
            }
        }

        /* Tool Comparison Table */
        .tool-compare {
            background: #ffffff;
            padding: 52px 0 90px;
        }

        .tool-compare__header {
            text-align: center;
            margin-bottom: 36px;
        }

        .tool-compare__title {
            font-size: clamp(32px, 5vw, 52px);
            font-weight: 400;
            color: #7c3aed;
            line-height: 1.2;
            margin-bottom: 10px;
        }

        .tool-compare__subtitle {
            font-size: clamp(16px, 2vw, 20px);
            color: #667085;
            font-weight: 500;
            max-width: 540px;
            margin: 0 auto;
            line-height: 1.5;
        }

        .tool-compare__card {
            max-width: 1100px;
            margin: 0 auto;
            background: linear-gradient(180deg, #ffffff 0%, #fcfbff 100%);
            border-radius: 24px;
            border: 1px solid #eceff5;
            box-shadow: 0 16px 38px rgba(15, 23, 42, 0.06);
            overflow: hidden;
            padding: 40px 48px 36px;
        }

        .tool-compare__table {
            width: 100%;
            border-collapse: separate;
            border-spacing: 0;
        }

        .tool-compare__table thead th {
            padding: 0 20px 26px;
            font-size: 15px;
            font-weight: 600;
            color: #9ca3af;
            text-align: center;
            vertical-align: bottom;
            border: none;
            background: transparent;
        }

        .tool-compare__table thead th:first-child {
            width: 46%;
        }

        .tool-compare__logo-cell {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 0;
        }

        .tool-compare__logo-cell img {
            width: 52px;
            height: 52px;
            object-fit: contain;
            border-radius: 12px;
        }

        .tool-compare__logo-cell img[alt="Adly"] {
            width: 64px;
            height: 64px;
            border-radius: 14px;
        }

        .tool-compare__table tbody td {
            padding: 20px 20px;
            text-align: center;
            border-bottom: 1px solid #eef0f3;
            font-size: 17px;
            vertical-align: middle;
            background: transparent;
        }

        .tool-compare__table tbody tr:last-child td {
            border-bottom: none;
        }

        .tool-compare__table tbody td:first-child {
            font-weight: 600;
            color: #1e293b;
            line-height: 1.55;
            font-size: 16px;
        }

        .tool-compare__channel-label {
            display: inline-flex;
            align-items: center;
            gap: 10px;
        }

        .tool-compare__channel-icons {
            display: inline-flex;
            align-items: center;
            gap: 5px;
            flex: 0 0 auto;
        }

        .tool-compare__channel-icon {
            width: 18px;
            height: 18px;
            fill: none;
            stroke: currentColor;
            stroke-width: 1.8;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .tool-compare__channel-icon.is-whatsapp {
            color: #22c55e;
        }

        .tool-compare__channel-icon.is-telegram {
            color: #2aabee;
        }

        [dir="ltr"] .tool-compare__table tbody td:first-child {
            text-align: left;
            direction: ltr;
        }

        [dir="rtl"] .tool-compare__table tbody td:first-child {
            text-align: right;
            direction: rtl;
        }

        .tool-compare__check {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: #22c55e;
            border: none;
        }

        .tool-compare__check svg {
            width: 18px;
            height: 18px;
            stroke: #ffffff;
            fill: none;
            stroke-width: 3;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .tool-compare__cross {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: #ef4444;
            border: none;
        }

        .tool-compare__cross svg {
            width: 15px;
            height: 15px;
            stroke: #ffffff;
            fill: none;
            stroke-width: 3;
            stroke-linecap: round;
            stroke-linejoin: round;
        }

        .tool-compare__extra {
            display: none;
        }

        .tool-compare__card.is-expanded .tool-compare__extra {
            display: table-row;
        }

        .tool-compare__toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px;
            margin-top: 24px;
            padding: 8px 16px;
            background: #f8fafc;
            border: 1px solid #e5e7eb;
            border-radius: 10px;
            color: #667085;
            font-size: 13px;
            font-weight: 600;
            font-family: inherit;
            cursor: pointer;
            transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
        }

        [dir="rtl"] .tool-compare__toggle {
            margin-right: 0;
            margin-left: auto;
        }

        [dir="ltr"] .tool-compare__toggle {
            margin-right: auto;
            margin-left: 0;
        }

        .tool-compare__toggle:hover {
            background: #f5f3ff;
            border-color: #ddd6fe;
            color: #7c3aed;
        }

        .tool-compare__toggle-arrow {
            width: 18px;
            height: 18px;
            transition: transform 0.3s ease;
        }

        .tool-compare__card.is-expanded .tool-compare__toggle-arrow {
            transform: rotate(180deg);
        }

        .tool-compare__cta-wrap {
            margin-top: 36px;
            text-align: center;
        }

        .tool-compare__cta-microcopy {
            font-size: 14px;
            font-weight: 600;
            color: #4b5563;
            margin-top: 12px;
        }

        @media (max-width: 768px) {
            .tool-compare {
                padding: 34px 0 56px;
            }

            .tool-compare__card {
                border-radius: 18px;
                padding: 24px 18px 20px;
                margin: 0 4px;
            }

            .tool-compare__table {
                width: 100%;
            }

            .tool-compare__table thead th {
                padding: 0 6px 20px;
                font-size: 11px;
            }

            .tool-compare__logo-cell img {
                width: 36px;
                height: 36px;
            }

            .tool-compare__logo-cell img[alt="Adly"] {
                width: 44px;
                height: 44px;
            }

            .tool-compare__table tbody td {
                padding: 14px 6px;
                font-size: 14px;
            }

            .tool-compare__table tbody td:first-child {
                font-size: 13px;
                line-height: 1.45;
            }

            .tool-compare__channel-label {
                gap: 7px;
            }

            .tool-compare__channel-icons {
                gap: 3px;
            }

            .tool-compare__channel-icon {
                width: 15px;
                height: 15px;
            }

            [dir="ltr"] .tool-compare__table tbody td:first-child {
                padding-right: 8px;
            }

            [dir="rtl"] .tool-compare__table tbody td:first-child {
                padding-left: 8px;
            }

            .tool-compare__check,
            .tool-compare__cross {
                width: 26px;
                height: 26px;
            }

            .tool-compare__toggle {
                margin-top: 18px;
                padding: 7px 14px;
                font-size: 12px;
            }

            .tool-compare__check svg {
                width: 14px;
                height: 14px;
            }

            .tool-compare__cross svg {
                width: 12px;
                height: 12px;
            }
        }

        /* FAQ Section */
        .faq-section {
            background: #fcfbff;
            padding: 56px 0;
        }

        .faq-section__title {
            text-align: center;
            font-size: clamp(32px, 5vw, 52px);
            font-weight: 400;
            color: #7c3aed;
            margin-bottom: 48px;
        }

        .faq-section__list {
            max-width: 820px;
            margin: 0 auto;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .faq-item {
            background: #f8f9fb;
            border-radius: 16px;
            overflow: hidden;
            transition: background 0.2s;
        }

        .faq-item__question {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            width: 100%;
            padding: 22px 28px;
            background: none;
            border: none;
            cursor: pointer;
            font-family: inherit;
            font-size: 17px;
            font-weight: 400;
            color: #111827;
            text-align: start;
            line-height: 1.5;
        }

        .faq-item__icon {
            flex-shrink: 0;
            width: 32px;
            height: 32px;
            border-radius: 50%;
            background: #111827;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: transform 0.3s ease;
        }

        .faq-item__icon svg {
            width: 16px;
            height: 16px;
            stroke: #ffffff;
            fill: none;
            stroke-width: 2.5;
            stroke-linecap: round;
        }

        .faq-item.is-open .faq-item__icon {
            transform: rotate(45deg);
        }

        .faq-item__answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.35s ease, padding 0.35s ease;
        }

        .faq-item__answer-inner {
            padding: 0 28px 24px;
            font-size: 16px;
            font-weight: 500;
            color: #4b5563;
            line-height: 1.8;
        }

        .faq-item.is-open .faq-item__answer {
            max-height: 600px;
        }

        @media (max-width: 768px) {
            .faq-section {
                padding: 56px 0;
            }

            .faq-section__title {
                margin-bottom: 32px;
            }

            .faq-item__question {
                padding: 18px 20px;
                font-size: 15px;
            }

            .faq-item__answer-inner {
                padding: 0 20px 20px;
                font-size: 15px;
            }

            .faq-item__icon {
                width: 28px;
                height: 28px;
            }

            .faq-item__icon svg {
                width: 14px;
                height: 14px;
            }
        }

/* "View in English" bar on the Arabic homepage (shown by the head script via html.en-hint-on). */
.en-hint {
    display: none;
}

html.en-hint-on body.homepage {
    --en-hint-h: 44px;
}

html.en-hint-on .en-hint {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    height: var(--en-hint-h);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 52px;
    background: #6d28d9;
    color: #ede4ff;
    font-family: 'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 14px;
    line-height: 1.2;
}

.en-hint__row {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.en-hint__link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 44px;
    color: #ffffff;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.en-hint__link svg {
    transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}

.en-hint__link:hover svg {
    transform: translateX(3px);
}

.en-hint__link:hover {
    text-decoration-thickness: 2px;
}

.en-hint__link:focus-visible,
.en-hint__close:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    border-radius: 6px;
}

.en-hint__close {
    position: absolute;
    top: 0;
    right: 4px;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #ede4ff;
    cursor: pointer;
}

.en-hint__close:hover {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

.en-hint__close:focus-visible {
    outline-offset: -4px;
}

html.en-hint-on .homepage header {
    top: var(--en-hint-h);
}

html.en-hint-on .homepage .top-aurora-wrap {
    padding-top: calc(
        (var(--homepage-header-pad-y) * 2) + 40px + env(safe-area-inset-top, 0px) + var(--en-hint-h)
    );
}

@supports selector(:has(*)) {
    html.en-hint-on:has(body.homepage) {
        scroll-padding-top: 140px;
    }

    html.en-hint-on.en-hint-us:has(body.homepage) {
        scroll-padding-top: 160px;
    }
}

@media (max-width: 420px) {
    .en-hint__text {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .en-hint__link svg {
        transition: none;
    }
}

/* USA version of the bar: navy star field, stripe ribbon, bald eagle, one-time fireworks salute. */
html.en-hint-on.en-hint-us body.homepage {
    --en-hint-h: 64px;
}

html.en-hint-on .en-hint.us-hint {
    padding: 0 56px 0 16px;
    background: radial-gradient(120% 140% at 20% 0%, #14417f 0%, #0a3161 55%, #072450 100%);
    color: #ffffff;
    overflow: hidden;
    box-shadow: 0 6px 18px rgba(4, 16, 40, 0.35);
}

.us-hint__sky {
    position: absolute;
    inset: 0 0 6px;
    pointer-events: none;
}

.us-hint__star {
    position: absolute;
    fill: #ffffff;
    opacity: 0.5;
    animation: us-hint-twinkle 2.4s ease-in-out 8 alternate;
}

@keyframes us-hint-twinkle {
    from { opacity: 0.25; transform: scale(0.75); }
    to { opacity: 1; transform: scale(1.1); }
}

.us-hint__shoot {
    position: absolute;
    top: 14%;
    left: -120px;
    width: 110px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0), #ffffff);
    opacity: 0;
    transform: rotate(8deg);
}

html.us-salute-on .us-hint__shoot {
    animation: us-hint-shoot 1.1s cubic-bezier(0.16, 1, 0.3, 1) 1.2s 1 both;
}

@keyframes us-hint-shoot {
    0% { opacity: 0; transform: translateX(0) rotate(8deg); }
    15% { opacity: 1; }
    100% { opacity: 0; transform: translateX(min(1400px, 110vw)) rotate(8deg); }
}

.us-hint__row {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    height: 100%;
    max-width: 1100px;
    width: 100%;
    margin: 0 auto;
}

.us-hint__eagle {
    flex: 0 0 auto;
    align-self: flex-end;
    width: 58px;
    height: 58px;
    margin-bottom: 0;
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.35));
    transform-origin: 30% 100%;
}

html.us-salute-on .us-hint__eagle {
    animation: us-hint-eagle-rise 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s 1 both,
        us-hint-eagle-nod 0.6s cubic-bezier(0.16, 1, 0.3, 1) 1.1s 1;
}

@keyframes us-hint-eagle-rise {
    from { transform: translateY(70%) rotate(-12deg); }
    to { transform: none; }
}

@keyframes us-hint-eagle-nod {
    0%, 100% { transform: none; }
    40% { transform: rotate(-8deg) translateY(-2px); }
}

.us-hint__copy {
    margin: 0;
    display: flex;
    align-items: baseline;
    gap: 12px;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.us-hint__title {
    font-size: 16px;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(3, 14, 36, 0.55);
    letter-spacing: 0.01em;
    white-space: nowrap;
    color: #ffffff;
}

.us-hint__cta {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    background: #b31942;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(120, 8, 36, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.22);
    transition: background-color 0.18s ease, transform 0.18s cubic-bezier(0.16, 1, 0.3, 1);
}

.us-hint__cta:hover {
    background: #c9214d;
}

.us-hint__cta:active {
    transform: translateY(1px);
}

.us-hint__cta svg {
    transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}

.us-hint__cta:hover svg {
    transform: translateX(3px);
}

.us-hint__cta:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

.us-hint__cta-short {
    display: none;
}

.us-hint__ribbon {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 6px;
    background: repeating-linear-gradient(90deg, #b31942 0 18px, #ffffff 18px 36px);
    animation: us-hint-march 3s linear 6;
}

@keyframes us-hint-march {
    to { background-position: 36px 0; }
}

.us-hint .en-hint__close {
    top: 10px;
    color: #c9d7f0;
}

.us-hint ::selection {
    background: #b31942;
    color: #ffffff;
}

/* One-time salute: canvas fireworks + an eagle soaring across the hero. */
.us-salute {
    display: none;
}

html.us-salute-on .us-salute {
    display: block;
    position: fixed;
    top: calc(var(--en-hint-h) + 70px);
    left: 0;
    z-index: 1002;
    pointer-events: none;
    animation: us-salute-glide 3.4s cubic-bezier(0.45, 0, 0.25, 1) 0.3s 1 both;
}

.us-salute__eagle {
    display: block;
    width: 240px;
    height: 112px;
    filter: drop-shadow(0 8px 14px rgba(0, 0, 0, 0.4));
}

.us-salute__wing {
    transform-box: view-box;
    transform-origin: 60px 26px;
    animation: us-salute-flap 0.9s ease-in-out 4 alternate;
}

.us-salute__wing--r {
    transform: scale(-1, 1);
    animation-name: us-salute-flap-r;
}

@keyframes us-salute-flap {
    from { transform: rotate(0deg); }
    to { transform: rotate(14deg); }
}

@keyframes us-salute-flap-r {
    from { transform: scale(-1, 1) rotate(0deg); }
    to { transform: scale(-1, 1) rotate(14deg); }
}

@keyframes us-salute-glide {
    0% { opacity: 0; transform: translate(-260px, 60px) rotate(6deg) scale(0.8); }
    12% { opacity: 1; }
    55% { transform: translate(45vw, -10px) rotate(-3deg) scale(1); }
    88% { opacity: 1; }
    100% { opacity: 0; transform: translate(calc(100vw + 40px), -50px) rotate(-8deg) scale(0.85); }
}

.us-fireworks {
    position: fixed;
    inset: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1002;
    pointer-events: none;
}

@media (max-width: 600px) {
    html.en-hint-on.en-hint-us body.homepage {
        --en-hint-h: 60px;
    }

    html.en-hint-on .en-hint.us-hint {
        padding: 0 46px 0 8px;
    }

    .us-hint__row {
        gap: 8px;
    }

    .us-hint__eagle {
        width: 46px;
        height: 46px;
    }

    .us-hint__title {
        font-size: 14px;
    }

    .us-hint__cta {
        margin-left: auto;
        padding: 0 12px;
    }

    .us-hint__cta-long {
        display: none;
    }

    .us-hint__cta-short {
        display: inline;
    }

    .us-hint .en-hint__close {
        top: 8px;
        right: 2px;
    }

    .us-salute__eagle {
        width: 150px;
        height: 70px;
    }
}

@media (max-width: 374px) {
    .us-hint__cta {
        width: 44px;
        padding: 0;
        justify-content: center;
    }

    .us-hint__cta-short {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

@media (prefers-reduced-motion: reduce) {
    .us-hint__star,
    .us-hint__ribbon,
    .us-hint__cta,
    .us-hint__cta svg {
        animation: none;
        transition: none;
    }
}

/* Polish layer (2026-10-25): one section-title size, a closing CTA panel in the hero's world, calmer FAQ toggles,
   and themed focus/selection. Scoped to body.homepage so the inline hub-block styles lose to it. */
body.homepage ::selection {
    background: rgba(124, 58, 237, 0.24);
}

body.homepage a:focus-visible,
body.homepage button:focus-visible {
    outline: 2px solid #7c3aed;
    outline-offset: 3px;
}

body.homepage .top-aurora-wrap a:focus-visible,
body.homepage .top-aurora-wrap button:focus-visible,
body.homepage .pricing-aurora-wrap a:focus-visible,
body.homepage .pricing-aurora-wrap button:focus-visible,
body.homepage .final-cta a:focus-visible {
    outline-color: #c4b5fd;
}

body.homepage .comparison .section-title,
body.homepage .faq-section__title,
body.homepage .hp-resources__title,
body.homepage .tool-compare__title {
    font-size: 44px;
    line-height: 1.4;
}

body.homepage .faq-item {
    transition: background-color 0.2s ease;
}

body.homepage .faq-item:hover {
    background: #f3f1fb;
}

body.homepage .faq-item__question:focus-visible {
    outline-offset: -2px;
    border-radius: 16px;
}

body.homepage .faq-item__icon {
    background: #f3edff;
    transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.2s ease;
}

body.homepage .faq-item__icon svg {
    stroke: #7c3aed;
}

body.homepage .faq-item.is-open .faq-item__icon {
    background: #7c3aed;
}

body.homepage .faq-item.is-open .faq-item__icon svg {
    stroke: #ffffff;
}

body.homepage .final-cta {
    background: #ffffff;
    padding: 24px 0 88px;
}

body.homepage .final-cta .container {
    position: relative;
    max-width: 1040px;
    margin: 0 auto;
    padding: 64px 40px 56px;
    border-radius: 28px;
    overflow: hidden;
    background:
        radial-gradient(60% 90% at 50% 0%, rgba(124, 58, 237, 0.55), transparent 72%),
        radial-gradient(45% 70% at 88% 100%, rgba(168, 85, 247, 0.26), transparent 70%),
        #0a0518;
    box-shadow: 0 32px 64px -28px rgba(46, 16, 101, 0.55);
}

body.homepage .final-cta h2 {
    font-size: 44px;
    line-height: 1.3;
    color: #f8fafc;
    margin-bottom: 12px;
}

body.homepage .final-cta-subtitle {
    color: rgba(237, 228, 255, 0.84);
    margin-bottom: 28px;
}

body.homepage .final-cta-primary {
    background: #ffffff;
    color: #7c3aed;
    border-radius: 11px;
    min-height: 58px;
    padding: 0 40px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

body.homepage .final-cta-primary:hover {
    background: #f5f3ff;
    color: #6d28d9;
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.36);
}

body.homepage .final-cta-primary:active {
    transform: translateY(0);
}

body.homepage .final-cta-trust {
    gap: 10px 22px;
}

body.homepage .final-cta .trust-item {
    gap: 7px;
    color: rgba(221, 214, 254, 0.82);
}

body.homepage .final-cta .trust-item::before {
    content: "";
    width: 9px;
    height: 5px;
    margin-bottom: 3px;
    border-left: 2px solid #a78bfa;
    border-bottom: 2px solid #a78bfa;
    transform: rotate(-45deg);
}

@media (max-width: 768px) {
    body.homepage .comparison .section-title,
    body.homepage .faq-section__title,
    body.homepage .hp-resources__title,
    body.homepage .tool-compare__title {
        font-size: 28px;
    }

    body.homepage .final-cta {
        padding: 8px 0 56px;
    }

    body.homepage .final-cta .container {
        margin: 0 16px;
        padding: 44px 20px 36px;
        border-radius: 22px;
    }

    body.homepage .final-cta h2 {
        font-size: 28px;
    }

    body.homepage .final-cta-primary {
        width: 100%;
        max-width: 320px;
        min-height: 54px;
        padding: 0 22px;
    }
}

/* Revamp layer (2026-10-25): same sections, copy and behaviour; every section brought up to the conviction of the
   feature rows and the dark hero. Bold ink headlines instead of thin purple ones, a real stepper, a decisive
   before/after, stronger cards and a steadier background rhythm. */
body.homepage {
    --rv-ink: #12101c;
    --rv-body: #4a5163;
    --rv-muted: #667085;
    --rv-purple: #7c3aed;
    --rv-purple-deep: #5b21b6;
    --rv-soft: #f3edff;
    --rv-line: #e8e6f0;
    --rv-ground: #f7f6fb;
}

/* Headlines: one voice for every section title. */
body.homepage .section-title,
body.homepage .tool-compare__title,
body.homepage .faq-section__title,
body.homepage .hp-resources__title,
body.homepage .final-cta h2 {
    font-size: clamp(30px, 3.4vw, 46px);
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: 0;
    color: var(--rv-ink);
    text-wrap: balance;
}

body.homepage .pricing .section-title,
body.homepage .final-cta h2 {
    color: #f8fafc;
}

body.homepage .section-subtitle,
body.homepage .tool-compare__subtitle,
body.homepage .hp-resources__lead {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.6;
    color: var(--rv-muted);
    text-wrap: pretty;
}

body.homepage .pricing .section-subtitle {
    color: rgba(226, 232, 240, 0.88);
}

/* Hero: the headline carries the page. */
body.homepage .hero-title {
    font-size: clamp(38px, 5vw, 68px);
    font-weight: 800;
    line-height: 1.14;
    letter-spacing: 0;
    max-width: 1080px;
    text-wrap: balance;
}

body.homepage .hero-title .highlight {
    color: #c4b5fd;
    font-style: normal;
    font-weight: 800;
}

body.homepage .hero.hero--continuation .subtitle {
    font-size: 21px;
    font-weight: 500;
    color: rgba(237, 233, 254, 0.86);
}

body.homepage .hero.hero--continuation .hero-cta.hero-cta--stacked {
    min-height: 64px;
    padding: 0 46px;
    font-size: 20px;
    border-radius: 14px;
    box-shadow: 0 18px 44px -12px rgba(0, 0, 0, 0.5), 0 0 0 6px rgba(196, 181, 253, 0.14);
}

body.homepage .hero-platform-strip {
    gap: 10px;
}

body.homepage .founder-video--in-hero .founder-video-frame {
    border-radius: 22px;
    box-shadow: 0 40px 90px -30px rgba(124, 58, 237, 0.65), 0 0 0 1px rgba(196, 181, 253, 0.28);
}

/* Section rhythm: white and ground bands alternate so each block reads as its own chapter. */
body.homepage .how-it-works-section,
body.homepage .features {
    background: var(--rv-ground);
}

body.homepage .how-it-works-section {
    padding: 96px 0;
}

body.homepage .tool-compare {
    padding: 96px 0;
}

body.homepage .comparison {
    background: #ffffff;
    padding: 96px 0;
}

body.homepage .for-everyone {
    background: var(--rv-ground);
    padding: 96px 0;
}

body.homepage .features {
    background: #ffffff;
    padding: 96px 0;
}

/* How it works: an actual sequence. Number, line, three steps. */
body.homepage .how-it-works-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    backdrop-filter: none;
    overflow: visible;
}

body.homepage .how-badge {
    display: none;
}

body.homepage .steps-container {
    counter-reset: rv-step;
    gap: 28px;
    margin-top: 48px;
    max-width: 1040px;
}

body.homepage .steps-line {
    top: 46px;
    left: 18%;
    right: 18%;
    height: 2px;
    background: repeating-linear-gradient(90deg, #c4b5fd 0 8px, transparent 8px 16px);
}

body.homepage .step {
    counter-increment: rv-step;
    background: #ffffff;
    border: 1px solid var(--rv-line);
    border-radius: 22px;
    padding: 30px 24px 28px;
    box-shadow: 0 18px 40px -26px rgba(46, 16, 101, 0.28);
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.25s ease;
}

body.homepage .step:hover {
    transform: translateY(-4px);
    box-shadow: 0 26px 50px -26px rgba(46, 16, 101, 0.36);
}

body.homepage .step-icon {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 20px;
    margin-bottom: 18px;
    background: var(--rv-purple);
    border: 0;
    color: #ffffff;
    box-shadow: 0 14px 28px -10px rgba(124, 58, 237, 0.6);
}

body.homepage .step-icon svg {
    width: 26px;
    height: 26px;
}

body.homepage .step-icon::after {
    content: counter(rv-step);
    position: absolute;
    top: -8px;
    inset-inline-end: -8px;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    background: #ffffff;
    color: var(--rv-purple-deep);
    border: 2px solid var(--rv-purple);
    font-size: 13px;
    font-weight: 800;
    line-height: 22px;
    text-align: center;
}

body.homepage .step-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--rv-ink);
    margin-bottom: 8px;
}

body.homepage .step-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--rv-body);
    font-weight: 400;
    max-width: 240px;
}

body.homepage .how-cta-wrap {
    margin-top: 40px;
}

/* Tool table: the Adly column is the answer, so it gets the light. */
body.homepage .tool-compare__card {
    background: #ffffff;
    border-color: var(--rv-line);
    box-shadow: 0 30px 70px -40px rgba(46, 16, 101, 0.35);
    border-radius: 26px;
}

body.homepage .tool-compare__table thead th:nth-child(2),
body.homepage .tool-compare__table tbody td:nth-child(2) {
    background: var(--rv-soft);
}

body.homepage .tool-compare__table thead th:nth-child(2) {
    border-radius: 18px 18px 0 0;
    padding-top: 18px;
}

body.homepage .tool-compare__table tbody tr:last-child td:nth-child(2) {
    border-radius: 0 0 18px 18px;
}

body.homepage .tool-compare__table tbody td:first-child {
    font-size: 16px;
    font-weight: 500;
    color: var(--rv-ink);
}

/* Before / after: one muted column, one confident column. */
body.homepage .comparison-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
}

body.homepage .comparison-grid {
    background: transparent;
    gap: 24px;
    align-items: stretch;
}

body.homepage .comparison-column {
    border-radius: 24px;
    padding: 32px;
}

body.homepage .comparison-column.before {
    background: var(--rv-ground);
    border: 1px solid var(--rv-line);
}

body.homepage .comparison-column.after {
    background: #ffffff;
    border: 2px solid var(--rv-purple);
    box-shadow: 0 34px 70px -36px rgba(91, 33, 182, 0.55);
}

body.homepage .comparison-badge {
    font-size: 18px;
    font-weight: 800;
    padding: 0;
    margin-bottom: 18px;
    background: none !important;
    border: 0 !important;
    box-shadow: none;
}

body.homepage .before .comparison-badge {
    color: var(--rv-muted);
}

body.homepage .after .comparison-badge {
    color: var(--rv-purple);
}

body.homepage .comparison-list .icon {
    display: none;
}

body.homepage .comparison-list li {
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(17, 24, 39, 0.07);
    border-radius: 0;
    margin: 0;
    padding: 14px 0;
    gap: 14px;
    font-size: 16px;
}

body.homepage .comparison-list li:last-child {
    border-bottom: 0;
}

body.homepage .before .comparison-list li {
    color: var(--rv-muted);
}

body.homepage .after .comparison-list li {
    color: var(--rv-ink);
    font-weight: 500;
}

body.homepage .comparison-list .status {
    order: -1;
    margin-inline-start: 0;
    width: 26px;
    height: 26px;
    font-size: 13px;
}

body.homepage .before .status {
    background: #ffffff;
    color: #b42318;
    border-color: #f3c7c3;
}

body.homepage .after .status {
    background: var(--rv-purple);
    color: #ffffff;
    border-color: var(--rv-purple);
}

body.homepage .comparison-cta-wrap {
    margin-top: 40px;
}

/* Audiences: two clear doors. */
body.homepage .audience-grid {
    gap: 24px;
    margin-top: 12px;
}

body.homepage .audience-card {
    border: 1px solid var(--rv-line);
    border-top: 1px solid var(--rv-line);
    border-radius: 24px;
    padding: 36px 34px;
    box-shadow: 0 24px 50px -34px rgba(46, 16, 101, 0.3);
}

body.homepage .audience-card.sme {
    border: 2px solid var(--rv-purple);
}

body.homepage .audience-card h3 {
    font-size: 26px;
    font-weight: 800;
    color: var(--rv-ink);
    gap: 14px;
    margin-bottom: 10px;
}

body.homepage .audience-card > p {
    font-size: 16px;
    color: var(--rv-body);
    line-height: 1.6;
}

body.homepage .audience-card li {
    font-size: 16px;
    color: var(--rv-ink);
}

/* Features grid: fewer borders, stronger titles. */
body.homepage .feature-pillar {
    background: var(--rv-ground);
    border: 1px solid transparent;
    border-radius: 24px;
    box-shadow: none;
    padding: 30px 26px;
    transition: background-color 0.25s ease, border-color 0.25s ease, transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

body.homepage .feature-pillar:hover {
    background: #ffffff;
    border-color: var(--rv-line);
    transform: translateY(-4px);
}

body.homepage .feature-pillar-title {
    font-size: 21px;
    font-weight: 800;
    color: var(--rv-ink);
}

body.homepage .feature-pillar-desc {
    font-size: 15px;
    line-height: 1.6;
    color: var(--rv-body);
}

body.homepage .feature-icon {
    background: var(--rv-purple);
    color: #ffffff;
    border-color: var(--rv-purple);
}

/* Pricing: plan names carry the same weight as the prices. */
body.homepage .pricing-card > h3 {
    font-weight: 800;
    color: var(--rv-ink);
}

/* Hero networks: one contained row instead of loose icons. */
body.homepage .hero-platform-strip {
    width: fit-content;
    margin-inline: auto;
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(196, 181, 253, 0.22);
}

/* Repeated section CTAs: same weight as the hero's. */
body.homepage .how-cta-primary,
body.homepage .tool-compare__cta-primary,
body.homepage .comparison-cta-primary,
body.homepage .for-cta-primary,
body.homepage .features-cta-primary {
    min-height: 60px;
    padding: 0 42px;
    font-size: 19px;
    border-radius: 14px;
}

@media (max-width: 768px) {
    body.homepage .section-title,
    body.homepage .tool-compare__title,
    body.homepage .faq-section__title,
    body.homepage .hp-resources__title,
    body.homepage .final-cta h2 {
        font-size: 28px;
    }

    body.homepage .section-subtitle,
    body.homepage .tool-compare__subtitle,
    body.homepage .hp-resources__lead {
        font-size: 16px;
    }

    body.homepage .hero-title {
        font-size: 36px;
        line-height: 1.2;
    }

    body.homepage .hero.hero--continuation .subtitle {
        font-size: 17px;
    }

    body.homepage .hero.hero--continuation .hero-cta.hero-cta--stacked {
        min-height: 58px;
        font-size: 18px;
    }

    body.homepage .how-it-works-section,
    body.homepage .tool-compare,
    body.homepage .comparison,
    body.homepage .for-everyone,
    body.homepage .features {
        padding: 64px 0;
    }

    body.homepage .steps-container {
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        margin-top: 32px;
    }

    body.homepage .steps-line {
        display: none;
    }

    body.homepage .step {
        display: grid;
        grid-template-columns: 52px 1fr;
        column-gap: 16px;
        align-items: start;
        text-align: start;
        padding: 22px 20px;
    }

    body.homepage .step-icon {
        grid-row: span 2;
        width: 52px;
        height: 52px;
        margin-bottom: 0;
    }

    body.homepage .step-title {
        margin-bottom: 4px;
    }

    body.homepage .step-desc {
        max-width: none;
    }

    body.homepage .comparison-grid {
        gap: 16px;
    }

    body.homepage .comparison-column {
        padding: 24px 20px;
    }

    body.homepage .comparison-list li {
        font-size: 15px;
    }

    body.homepage .audience-card {
        padding: 28px 22px;
    }

    body.homepage .audience-card h3 {
        font-size: 22px;
    }

    body.homepage .how-cta-primary,
    body.homepage .tool-compare__cta-primary,
    body.homepage .comparison-cta-primary,
    body.homepage .for-cta-primary,
    body.homepage .features-cta-primary {
        width: 100%;
        max-width: 340px;
        min-height: 56px;
        font-size: 17px;
        padding: 0 24px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.homepage .step,
    body.homepage .feature-pillar {
        transition: none;
    }
}

/* Keyboard focus is always visible (accessibility): a purple ring with a white halo, so it shows on the dark hero
   and on white sections alike. Only for keyboard use (:focus-visible); clicks and taps never show it. */
:where(a[href], button, [role="button"], input, select, textarea, summary, [tabindex]:not([tabindex="-1"])):focus-visible,
body.homepage :is(.logo, .lang-switcher-link, .hero-founder-link, .hh-open-cta, .portfolio-more-btn, .tool-compare__toggle,
  .pricing-billing-toggle button, .plan-feature-help, .pricing-features-toggle):focus-visible {
    outline: 2px solid #7c3aed;
    outline-offset: 2px;
    box-shadow: 0 0 0 5px rgba(255, 255, 255, 0.92);
}

/* Founder video captions: the site's Arabic face on a dark band, readable on any frame. */
.founder-video-player::cue {
    font-family: 'Tajawal', 'Cairo', system-ui, sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.55;
    color: #ffffff;
    background: rgba(12, 8, 22, 0.78);
}
@media (max-width: 640px) {
    .founder-video-player::cue { font-size: 15px; }
}