/* ---- css/pl-landing.css ---- */
/* Pathline landing — scroll-snap storytelling */
:root {
    --pl-bg: #ffffff;
    --pl-text: #0e0e0e;
    --pl-muted: #6f6f6f;
    --pl-muted-2: #949494;
    --pl-border: #e4e4e4;
    --pl-border-strong: #d4d4d4;
    --pl-green: #008556;
    --pl-blue: #1774ff;
    --pl-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --pl-landing-inset: clamp(24px, 5vw, 56px);
    --pl-landing-header-h: 72px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
}

body.pl-landing {
    font-family: var(--pl-font);
    font-size: 14px;
    line-height: 1.45;
    color: var(--pl-text);
    background: var(--pl-bg);
    -webkit-font-smoothing: antialiased;
}

/* ── Fixed canvas + chrome ── */
.pl-landing-paths {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
    transition: opacity 0.4s ease;
}

.pl-landing-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--pl-landing-header-h);
    padding: 0 var(--pl-landing-inset);
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(228, 228, 228, 0.6);
}

.pl-landing-logo {
    display: block;
    line-height: 0;
    text-decoration: none;
}

.pl-landing-logo:hover {
    opacity: 0.82;
}

.pl-landing-logo img {
    display: block;
    height: 24px;
    width: auto;
    object-fit: contain;
}

.pl-landing-nav {
    display: flex;
    align-items: center;
    gap: 20px;
}

.pl-landing-nav a {
    color: var(--pl-text);
    text-decoration: none;
    font-size: 13px;
    letter-spacing: -0.01em;
    transition: opacity 0.15s ease;
}

.pl-landing-nav a:hover {
    opacity: 0.65;
}

.pl-landing-nav-signin {
    font-weight: 500;
}

/* ── Scroll container ── */
.pl-landing-scroll {
    position: relative;
    z-index: 1;
    height: 100vh;
    height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
}

.pl-landing-slide {
    position: relative;
    min-height: 100vh;
    min-height: 100dvh;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: calc(var(--pl-landing-header-h) + 32px) var(--pl-landing-inset) 48px;
}

.pl-landing-slide-inner {
    width: 100%;
    max-width: 720px;
}

.pl-landing-slide--hero .pl-landing-slide-inner {
    max-width: 820px;
}

.pl-landing-slide--cta {
    justify-content: center;
    padding-bottom: 96px;
}

.pl-landing-slide--cta .pl-landing-slide-inner {
    max-width: 640px;
    text-align: center;
    margin: 0 auto;
}

/* ── Reveal on scroll ── */
.pl-landing-reveal > * {
    opacity: 0;
    transform: translateY(28px);
    transition:
        opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}

.pl-landing-reveal.is-visible > * {
    opacity: 1;
    transform: translateY(0);
}

.pl-landing-reveal.is-visible > *:nth-child(1) { transition-delay: 0.05s; }
.pl-landing-reveal.is-visible > *:nth-child(2) { transition-delay: 0.12s; }
.pl-landing-reveal.is-visible > *:nth-child(3) { transition-delay: 0.2s; }
.pl-landing-reveal.is-visible > *:nth-child(4) { transition-delay: 0.28s; }
.pl-landing-reveal.is-visible > *:nth-child(5) { transition-delay: 0.36s; }
.pl-landing-reveal.is-visible > *:nth-child(6) { transition-delay: 0.44s; }
.pl-landing-reveal.is-visible > *:nth-child(7) { transition-delay: 0.52s; }

/* Hero loads immediately */
.pl-landing-slide--hero .pl-landing-reveal > * {
    opacity: 1;
    transform: none;
    animation: pl-landing-rise 0.9s cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.pl-landing-slide--hero .pl-landing-reveal > *:nth-child(1) { animation-delay: 0.15s; }
.pl-landing-slide--hero .pl-landing-reveal > *:nth-child(2) { animation-delay: 0.28s; }
.pl-landing-slide--hero .pl-landing-reveal > *:nth-child(3) { animation-delay: 0.4s; }
.pl-landing-slide--hero .pl-landing-reveal > *:nth-child(4) { animation-delay: 0.52s; }

/* ── Typography ── */
.pl-landing-eyebrow {
    margin: 0 0 18px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pl-green);
}

.pl-landing-headline {
    margin: 0 0 20px;
    font-size: clamp(32px, 5.8vw, 56px);
    font-weight: 400;
    line-height: 1.06;
    letter-spacing: -0.035em;
}

.pl-landing-headline--hero {
    font-size: clamp(40px, 7.5vw, 72px);
    line-height: 1.02;
    max-width: 11ch;
}

.pl-landing-headline--cta {
    font-size: clamp(36px, 6.5vw, 60px);
}

.pl-landing-path-hub {
    display: inline-block;
    vertical-align: -0.08em;
    width: 0.16em;
    height: 0.16em;
    margin-left: 0.02em;
    border-radius: 50%;
    background: #c882ff;
    box-shadow: 0 0 8px rgba(200, 130, 255, 0.55);
    position: relative;
    z-index: 2;
}

.pl-landing-lead {
    margin: 0 0 16px;
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.025em;
    color: var(--pl-text);
}

.pl-landing-sub {
    margin: 0;
    max-width: 42ch;
    font-size: clamp(15px, 2vw, 18px);
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-sub--hero {
    margin-bottom: 36px;
}

.pl-landing-sub--tight {
    margin-top: 28px;
    max-width: 38ch;
}

.pl-landing-slide--cta .pl-landing-sub {
    margin: 0 auto 36px;
}

/* ── Problem stack list ── */
.pl-landing-stack {
    margin: 8px 0 0;
    padding: 0;
    list-style: none;
    max-width: 420px;
    border-top: 1px solid var(--pl-border);
}

.pl-landing-stack li {
    display: grid;
    grid-template-columns: 88px 16px 1fr;
    align-items: center;
    gap: 8px;
    padding: 14px 0;
    border-bottom: 1px solid var(--pl-border);
    font-size: 14px;
    letter-spacing: -0.01em;
}

.pl-landing-stack-label {
    color: var(--pl-muted);
    font-size: 12px;
    font-weight: 500;
}

.pl-landing-stack-arrow {
    color: var(--pl-muted-2);
    font-size: 12px;
    text-align: center;
}

.pl-landing-stack-tool {
    color: var(--pl-text);
}

/* ── Proof pills ── */
.pl-landing-proof {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 10px;
    margin: 32px 0 12px;
    padding: 0;
    list-style: none;
}

.pl-landing-proof li {
    padding: 6px 10px;
    border: 1px solid var(--pl-border);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

.pl-landing-proof li:first-child {
    border-color: rgba(0, 133, 86, 0.35);
    color: var(--pl-text);
}

.pl-landing-proof-note {
    margin: 0;
    font-size: 12px;
    color: var(--pl-muted-2);
    letter-spacing: -0.01em;
}

/* ── Actions ── */
.pl-landing-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
}

.pl-landing-actions--center {
    justify-content: center;
}

.pl-landing-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 148px;
    padding: 16px 28px;
    border: none;
    background: var(--pl-text);
    color: #fff;
    font-family: inherit;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease, transform 0.15s ease;
}

.pl-landing-btn::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--pl-cta-underline, var(--pl-blue));
    transform: scaleX(0);
    transform-origin: left;
    transition:
        transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.15s ease;
}

.pl-landing-btn:hover {
    background: #1a1a1a;
    color: #fff;
    text-decoration: none;
}

.pl-landing-btn:hover::before {
    transform: scaleX(1);
}

.pl-landing-btn:active {
    transform: scale(0.995);
}

.pl-landing-btn--ghost {
    background: transparent;
    color: var(--pl-text);
    border: 1px solid var(--pl-border-strong);
    min-width: auto;
    padding: 15px 24px;
}

.pl-landing-btn--ghost::before {
    display: none;
}

.pl-landing-btn--ghost:hover {
    background: #fafafa;
    border-color: var(--pl-text);
    color: var(--pl-text);
}

/* ── Scroll hint ── */
.pl-landing-scroll-hint {
    position: absolute;
    left: 50%;
    bottom: 28px;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border: none;
    background: transparent;
    color: var(--pl-muted-2);
    font-family: inherit;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
    animation: pl-landing-bob 2.4s ease-in-out infinite;
}

.pl-landing-scroll-hint:hover {
    color: var(--pl-muted);
}

.pl-landing-scroll-hint svg {
    opacity: 0.7;
}

/* ── Slide dots ── */
.pl-landing-dots {
    position: fixed;
    right: clamp(16px, 2.5vw, 28px);
    top: 50%;
    transform: translateY(-50%);
    z-index: 30;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    padding: 0;
}

.pl-landing-dots button {
    width: 6px;
    height: 6px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: var(--pl-border-strong);
    cursor: pointer;
    transition: background 0.2s ease, transform 0.2s ease;
}

.pl-landing-dots button.is-active {
    background: var(--pl-text);
    transform: scale(1.35);
}

.pl-landing-dots button:hover:not(.is-active) {
    background: var(--pl-muted-2);
}

/* ── Footer (final slide) ── */
.pl-landing-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px 12px;
    padding: 24px var(--pl-landing-inset) 28px;
    font-size: 12px;
    color: var(--pl-muted-2);
}

.pl-landing-footer a {
    color: inherit;
    text-decoration: none;
}

.pl-landing-footer a:hover {
    color: var(--pl-text);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pl-landing-footer-sep {
    opacity: 0.45;
}

/* ── Solution slide accent ── */
.pl-landing-slide--solution {
    background: linear-gradient(180deg, var(--pl-bg) 0%, #fafafa 100%);
}

@keyframes pl-landing-rise {
    from {
        opacity: 0;
        transform: translateY(18px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pl-landing-bob {
    0%, 100% { transform: translateX(-50%) translateY(0); }
    50% { transform: translateX(-50%) translateY(6px); }
}

@media (max-width: 768px) {
    .pl-landing-dots {
        display: none;
    }

    .pl-landing-headline--hero {
        max-width: none;
    }

    .pl-landing-stack li {
        grid-template-columns: 72px 12px 1fr;
        padding: 12px 0;
    }
}

@media (max-width: 640px) {
    .pl-landing-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .pl-landing-btn {
        width: 100%;
    }

    .pl-landing-scroll-hint {
        display: none;
    }
}

.pl-landing-versions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-right: 8px;
    padding-right: 16px;
    border-right: 1px solid var(--pl-border);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.pl-landing-versions a {
    color: var(--pl-muted);
    text-decoration: none;
    padding: 2px 4px;
}

.pl-landing-versions a.is-active {
    color: var(--pl-text);
}

.pl-landing-versions a:hover:not(.is-active) {
    opacity: 0.65;
}

@media (max-width: 640px) {
    .pl-landing-versions {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    html,
    body {
        overflow: auto;
    }

    .pl-landing-scroll {
        scroll-snap-type: none;
        height: auto;
        overflow: visible;
    }

    .pl-landing-slide {
        min-height: auto;
        scroll-snap-align: none;
        padding-bottom: 64px;
    }

    .pl-landing-reveal > *,
    .pl-landing-slide--hero .pl-landing-reveal > * {
        opacity: 1;
        transform: none;
        animation: none;
        transition: none;
    }

    .pl-landing-scroll-hint {
        animation: none;
    }

    .pl-landing-paths {
        display: none;
    }
}


/* ---- css/pl-landing-footer.css ---- */
/* Shared V4 footer — landing (dark) + legal pages (light) */
.pl-landing-v4-footer {
    position: relative;
    z-index: 4;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    width: 100%;
    padding: 56px var(--pl-landing-inset, clamp(24px, 5vw, 56px)) 40px;
    border-top: 0;
    color: var(--pl-footer-muted, rgba(255, 255, 255, 0.52));
}

.pl-landing-v4-footer::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    background: var(--pl-footer-border, rgba(255, 255, 255, 0.1));
    pointer-events: none;
    z-index: -1;
}

.pl-landing-v4-footer-main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px 56px;
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}

.pl-landing-v4-footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    flex: 0 0 auto;
    max-width: min(280px, 100%);
}

.pl-landing-v4-footer-logo {
    display: block;
    line-height: 0;
    text-decoration: none;
}

.pl-landing-v4-footer-logo:hover {
    opacity: 0.82;
}

.pl-landing-v4-footer-logo img {
    display: block;
    height: 24px;
    width: auto;
}

.pl-landing-v4-footer-stores {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

.pl-landing-v4-footer-appstore {
    display: block;
    width: fit-content;
    line-height: 0;
    text-decoration: none;
    margin: 0;
    padding: 0;
}

.pl-landing-v4-footer-appstore:hover {
    opacity: 0.85;
}

.pl-landing-v4-footer-appstore-img {
    display: block;
    height: 30px;
    width: auto;
    margin: 0;
    padding: 0;
}

.pl-landing-v4-footer-appstore-img--dark {
    display: none;
}

.pl-landing-v4 .pl-landing-v4-footer-appstore-img--light {
    display: none;
}

.pl-landing-v4 .pl-landing-v4-footer-appstore-img--dark {
    display: block;
}

.pl-legal .pl-landing-v4-footer-appstore-img--light {
    display: none;
}

.pl-legal .pl-landing-v4-footer-appstore-img--dark {
    display: block;
}

.pl-landing-v4-footer-end {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-end;
    gap: 32px 48px;
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
}

.pl-landing-footer.pl-landing-v4-footer a,
.pl-landing-footer.pl-landing-v4-footer a:hover {
    text-decoration: none;
}

.pl-landing-v4-footer-col {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    min-width: 0;
}

.pl-landing-v4-footer-col-title {
    margin: 0 0 4px;
    padding: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-footer-link-hover, #fff);
}

.pl-landing-v4-footer-col a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    color: var(--pl-footer-muted, rgba(255, 255, 255, 0.52));
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.01em;
    line-height: 1.35;
    text-decoration: none;
    white-space: nowrap;
}

.pl-landing-v4-footer-col a::after {
    content: none;
}

.pl-landing-v4-footer-col a:hover,
.pl-landing-v4-footer-col a.is-active {
    color: var(--pl-footer-link-hover, #fff);
    text-decoration: none;
}

.pl-legal .pl-landing-v4-footer-col-title {
    color: var(--pl-footer-link-hover, #0e0e0e);
}

.pl-legal .pl-landing-v4-footer-col a {
    color: var(--pl-footer-muted, #6f6f6f);
}

.pl-legal .pl-landing-v4-footer-col a:hover,
.pl-legal .pl-landing-v4-footer-col a.is-active {
    color: var(--pl-footer-link-hover, #0e0e0e);
}

.pl-landing-v4-footer-copy {
    margin: 0;
    font-size: 11px;
    color: var(--pl-footer-copy, rgba(255, 255, 255, 0.38));
    white-space: nowrap;
}

/* Landing CTA slide (dark) */
.pl-landing-v4 .pl-landing-v4-footer {
    position: relative;
    isolation: isolate;
    flex: 0 0 auto;
    width: 100%;
    margin-top: 0;
    padding: clamp(48px, 6vh, 72px) var(--pl-marketing-inset, clamp(48px, 14vw, 240px)) clamp(36px, 4vh, 52px);
    box-sizing: border-box;
    background: #0e0e0e;
}

.pl-landing-v4 .pl-landing-v4-footer-logo img {
    filter: invert(1);
}

/* Legal pages (light) */
.pl-legal {
    --pl-footer-border: #e4e4e4;
    --pl-footer-muted: #6f6f6f;
    --pl-footer-link: #0e0e0e;
    --pl-footer-link-hover: #0e0e0e;
    --pl-footer-copy: #949494;
}

@media (max-width: 820px) {
    .pl-landing-v4-footer {
        padding-top: 48px;
        padding-bottom: 36px;
    }

    .pl-landing-v4-footer-main {
        flex-direction: column;
        align-items: flex-start;
        gap: 36px;
    }

    .pl-landing-v4-footer-end {
        justify-content: flex-start;
        width: 100%;
        gap: 28px 40px;
    }
}

@media (max-width: 520px) {
    .pl-landing-v4-footer-brand {
        max-width: 100%;
    }

    .pl-landing-v4-footer-end {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 28px 24px;
    }

    .pl-landing-v4-footer-col:last-child {
        grid-column: 1 / -1;
    }
}

@media (max-height: 760px) {
    .pl-landing-v4 .pl-landing-v4-footer {
        padding-top: 40px;
        padding-bottom: 28px;
    }

    .pl-landing-v4 .pl-landing-v4-footer-appstore-img {
        height: 26px;
    }
}


/* ---- css/pl-code-window.css ---- */
/* Shared IDE-style code switcher — landing + docs */
.pl-code-window {
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 12px;
    background: #0b1020;
    box-shadow:
        0 24px 48px rgba(15, 23, 42, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.pl-code-chrome {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.03);
}

.pl-code-dots {
    display: inline-flex;
    gap: 6px;
}

.pl-code-dots span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
}

.pl-code-dots span:nth-child(1) { background: #ff5f57; }
.pl-code-dots span:nth-child(2) { background: #febc2e; }
.pl-code-dots span:nth-child(3) { background: #28c840; }

.pl-code-filename {
    font-size: 12px;
    font-weight: 500;
    color: rgba(226, 232, 240, 0.72);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.pl-code-tabs-list {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 12px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.pl-code-tabs-list button {
    padding: 7px 12px;
    border: 1px solid transparent;
    border-radius: 8px 8px 0 0;
    background: transparent;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: rgba(226, 232, 240, 0.58);
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease, border-color 0.15s ease;
}

.pl-code-tabs-list button:hover:not(.is-active) {
    color: rgba(226, 232, 240, 0.88);
    background: rgba(255, 255, 255, 0.04);
}

.pl-code-tabs-list button.is-active {
    color: #f8fafc;
    background: rgba(124, 58, 237, 0.18);
    border-color: rgba(124, 58, 237, 0.35);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.pl-code-panels {
    position: relative;
    min-height: 280px;
}

.pl-code-panel {
    margin: 0;
    padding: 18px 20px 22px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    background: #0b1020;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
    line-height: 1.65;
    color: #e2e8f0;
    white-space: pre;
}

.pl-code-panel[hidden] {
    display: none;
}

.pl-code-panel code {
    display: block;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    overflow-wrap: normal;
    word-break: normal;
}

.pl-code-window ::selection,
.pl-code-panel ::selection {
    background: rgba(124, 58, 237, 0.45);
    color: #fff;
}

@media (min-width: 900px) {
    .pl-code-panel {
        font-size: 12.5px;
        min-height: 300px;
    }
}


/* ---- css/pl-landing-v4.css ---- */
/* V4 — V2 scroll story + product sections, vivid accents, clean layout */




.pl-landing-v4 {
    --v4-blue: #1774ff;
    --v4-coral: #ff5c45;
    --v4-violet: #7c3aed;
    --v4-teal: #0d9488;
    --v4-sites: #6366f1;
    --v4-green: #008556;
    --v4-amber: #f59e0b;
    --v4-ink: #0a0a0a;
    --v4-section-pad: clamp(72px, 10vh, 104px);
}

/* No reveal / load-in animations — paint immediately */
.pl-landing-v4 .pl-landing-reveal > *,
.pl-landing-v4 .pl-landing-slide--hero .pl-landing-reveal > * {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
}

/* ── Continuous scroll (no full-viewport snap pages) ── */
.pl-landing-v4 .pl-landing-scroll {
    scroll-snap-type: none;
    scroll-behavior: auto;
    overflow-anchor: none;
}

.pl-landing-v4 .pl-landing-slide {
    min-height: auto;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
    justify-content: flex-start;
    align-items: stretch;
    padding-top: var(--v4-section-pad);
    padding-bottom: var(--v4-section-pad);
}

.pl-landing-v4 .pl-landing-scroll-hint {
    display: none;
}

/* ── Hero (light) ── */
.pl-landing-v4 .pl-landing-slide--hero {
    background: #fff;
    color: var(--pl-text);
    overflow: hidden;
}

.pl-landing-v4-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.55;
    pointer-events: none;
    z-index: 0;
}

.pl-landing-v4-blob--blue {
    width: min(420px, 60vw);
    height: min(420px, 60vw);
    background: var(--v4-blue);
    top: -8%;
    right: -6%;
}

.pl-landing-v4-blob--coral {
    width: min(320px, 50vw);
    height: min(320px, 50vw);
    background: var(--v4-coral);
    bottom: 10%;
    left: -8%;
}

.pl-landing-v4-blob--violet {
    width: min(260px, 40vw);
    height: min(260px, 40vw);
    background: var(--v4-violet);
    top: 35%;
    left: 42%;
    opacity: 0.35;
}

.pl-landing-v4 .pl-landing-slide--hero .pl-landing-slide-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
    max-width: none;
    margin: 0;
}

.pl-landing-v4-hero-split {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    width: 100%;
    gap: clamp(24px, 4vh, 40px);
    padding: 0 var(--pl-landing-inset);
    box-sizing: border-box;
}

.pl-landing-v4-hero-copy {
    flex-shrink: 0;
    text-align: center;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: clamp(8px, 1.5vh, 16px) 0 0;
}

.pl-landing-v4-hero-copy .pl-landing-headline--hero {
    max-width: none;
    margin: 0 auto 14px;
    color: var(--pl-text);
}

.pl-landing-v4-hero-copy .pl-landing-sub--hero {
    max-width: 40ch;
    margin: 0 auto 24px;
    color: var(--pl-muted);
}

.pl-landing-v4-hero-copy .pl-landing-actions {
    justify-content: center;
}

.pl-landing-v4-platforms {
    margin: 20px 0 0;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: -0.01em;
    color: var(--pl-muted);
    text-align: center;
}

.pl-landing-v4-hero-media {
    position: relative;
    flex: 0 0 auto;
    width: fit-content;
    max-width: min(1440px, 96vw);
    margin-top: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 14px;
    background: #fff;
    line-height: 0;
}

.pl-landing-v4-hero-media-clip {
    border-radius: 13px;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}

.pl-landing-video-wrap {
    position: relative;
}

.pl-landing-video-toggle {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: #0e0e0e;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    transition: background 0.15s ease, border-color 0.15s ease;
}

.pl-landing-video-toggle:hover {
    background: #fff;
    border-color: rgba(0, 0, 0, 0.2);
}

.pl-landing-video-toggle svg {
    display: block;
    width: 14px;
    height: 14px;
}

.pl-landing-video-toggle-icon--play {
    display: none;
}

.pl-landing-video-toggle.is-paused .pl-landing-video-toggle-icon--pause {
    display: none;
}

.pl-landing-video-toggle.is-paused .pl-landing-video-toggle-icon--play {
    display: block;
}

.pl-landing-v4-hero-media video {
    display: block;
    width: auto;
    height: auto;
    max-width: min(1440px, 96vw);
    max-height: min(720px, 70vh);
    vertical-align: top;
    transform: scale(1.05);
    transform-origin: center center;
    -webkit-transform: scale(1.015);
    -webkit-transform-origin: center center;
}

@media (max-width: 768px) {
    .pl-landing-v4-hero-media {
        display: none;
    }

    .pl-landing-v4 .pl-landing-slide--hero .pl-landing-slide-inner {
        flex: 0 0 auto;
    }

    .pl-landing-v4-hero-split {
        flex: 0 0 auto;
        gap: 20px;
    }

    .pl-landing-v4-hero-copy .pl-landing-sub--hero {
        max-width: none;
        margin-bottom: 20px;
    }
}

@media (max-width: 640px) {
    .pl-landing-v4-hero-copy .pl-landing-sub--hero {
        margin-bottom: 18px;
    }
}

/* ── Trusted by logos (inside hero) ── */
.pl-landing-v4 .pl-landing-slide--hero .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: clamp(28px, 4vh, 44px) var(--pl-landing-inset) var(--v4-section-pad);
    box-sizing: border-box;
}

.pl-landing-v4-trusted {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 var(--pl-landing-inset);
    box-sizing: border-box;
}

.pl-landing-v4-trusted-label {
    margin: 0 0 clamp(16px, 2.5vh, 22px);
    text-align: center;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: var(--pl-text);
}

.pl-landing-v4-trustpilot {
    display: block;
    width: fit-content;
    margin: 0 auto clamp(10px, 1.5vh, 16px);
    line-height: 0;
}

.pl-landing-v4-trustpilot img {
    display: block;
    height: clamp(32px, 4vw, 44px);
    width: auto;
}

.pl-landing-v4-trusted-rule {
    position: relative;
    height: 1px;
    margin-top: clamp(20px, 3vh, 28px);
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0, 0, 0, 0.08) 18%,
        rgba(0, 0, 0, 0.08) 82%,
        transparent 100%
    );
}

.pl-landing-v4-trusted-rule::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 5px;
    height: 5px;
    border-radius: 1px;
    background: var(--pl-muted-2);
    opacity: 0.35;
    transform: translate(-50%, -50%) rotate(45deg);
}

.pl-landing-v4-trusted-marquee {
    position: relative;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.pl-landing-v4-trusted-track {
    display: flex;
    width: max-content;
    animation: pl-v4-trusted-scroll 45s linear infinite;
}

.pl-landing-v4-trusted-logos {
    display: flex;
    align-items: center;
    gap: clamp(36px, 5vw, 64px);
    margin: 0;
    padding: 0 clamp(18px, 3vw, 32px);
    list-style: none;
}

.pl-landing-v4-trusted-logos li {
    flex: 0 0 auto;
}

.pl-landing-v4-trusted-logos img {
    display: block;
    width: auto;
    height: clamp(28px, 3.6vw, 40px);
    max-width: clamp(110px, 18vw, 200px);
    object-fit: contain;
    opacity: 0.65;
    filter: grayscale(1);
    transition: filter 0.25s ease, opacity 0.25s ease;
}

.pl-landing-v4-trusted-logos li:hover img {
    filter: grayscale(0);
    opacity: 1;
}

@keyframes pl-v4-trusted-scroll {
    to {
        transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-landing-v4-trusted-marquee {
        mask-image: none;
        -webkit-mask-image: none;
        overflow: visible;
    }

    .pl-landing-v4-trusted-track {
        width: 100%;
        flex-wrap: wrap;
        justify-content: center;
        animation: none;
        gap: clamp(24px, 4vw, 40px);
    }

    .pl-landing-v4-trusted-logos {
        flex-wrap: wrap;
        justify-content: center;
        gap: clamp(24px, 4vw, 40px);
        padding: 0;
    }

    .pl-landing-v4-trusted-logos[aria-hidden="true"] {
        display: none;
    }
}

/* ── Dark hero (V2 parity) ── */
.pl-landing-v4 .pl-landing-slide--dark {
    background: var(--v4-ink);
    color: #fff;
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-eyebrow {
    color: var(--v4-amber);
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--dark .pl-landing-lead {
    color: #fff;
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-sub {
    color: rgba(255, 255, 255, 0.58);
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-btn--ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-btn--ghost:hover {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.5);
    color: #fff;
}

.pl-landing-v4 .pl-landing-slide--dark .pl-landing-scroll-hint {
    color: rgba(255, 255, 255, 0.45);
}

.pl-landing-v4 .pl-landing-slide--hero .pl-landing-scroll-hint {
    color: var(--pl-muted-2);
}

.pl-landing-v4 .pl-landing-slide-num {
    display: none;
}

/* ── Section tints ── */
.pl-landing-v4 .pl-landing-slide--blue {
    background: linear-gradient(165deg, #eef4ff 0%, #f8fbff 55%, #fff 100%);
}

.pl-landing-v4 .pl-landing-slide--coral {
    background: linear-gradient(165deg, #fff4f0 0%, #fffaf8 55%, #fff 100%);
}

.pl-landing-v4 .pl-landing-slide--violet {
    background: linear-gradient(165deg, #f3efff 0%, #faf8ff 55%, #fff 100%);
}

.pl-landing-v4 .pl-landing-slide--sites {
    background: linear-gradient(165deg, #eef2ff 0%, #f5f7ff 55%, #fff 100%);
}

.pl-landing-v4 .pl-landing-slide--green {
    background: linear-gradient(165deg, #ecfdf3 0%, #f4fdf7 55%, #fff 100%);
}

.pl-landing-v4 .pl-landing-slide--cta {
    position: relative;
    overflow: hidden;
    background: var(--v4-ink);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    padding: 0;
    min-height: auto;
}

.pl-landing-v4 .pl-landing-cta-paths {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 0;
}

.pl-landing-v4 .pl-landing-v4-cta-main,
.pl-landing-v4 .pl-landing-slide--cta > .pl-landing-v4-footer {
    position: relative;
    z-index: 1;
}

.pl-landing-v4-cta-main {
    flex: 0 0 auto;
    width: 100%;
    padding: clamp(72px, 12vh, 112px) var(--pl-marketing-inset, clamp(48px, 14vw, 240px));
    box-sizing: border-box;
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-slide-inner {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    max-width: 640px;
    margin: 0 auto;
    padding: 0;
    text-align: center;
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--cta .pl-landing-sub {
    color: #fff;
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-headline {
    margin-bottom: 16px;
    font-size: clamp(28px, 4.8vw, 48px);
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-sub {
    color: rgba(255, 255, 255, 0.58);
    font-size: clamp(14px, 2vw, 16px);
    line-height: 1.55;
    margin-bottom: 24px;
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-btn:not(.pl-landing-btn--ghost) {
    background: #fff;
    color: #0e0e0e;
    border: 1px solid #fff;
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-btn:not(.pl-landing-btn--ghost):hover {
    background: #f3f3f3;
    color: #0e0e0e;
}

.pl-landing-v4 .pl-landing-cta-btn {
    position: relative;
    isolation: isolate;
    overflow: visible;
    border-radius: 0;
    --pl-cta-feed-r: 236;
    --pl-cta-feed-g: 72;
    --pl-cta-feed-b: 153;
    box-shadow: 0 0 32px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.22);
    transition: box-shadow 0.35s ease;
}

.pl-landing-v4 .pl-landing-cta-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    z-index: -1;
    pointer-events: none;
    background: none;
    width: auto;
    height: auto;
    transform: none;
    box-shadow: 0 0 40px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.28);
    opacity: 0.72;
    animation: pl-landing-cta-glow-breathe 3.4s ease-in-out infinite;
}

.pl-landing-v4 .pl-landing-cta-btn:hover::before {
    transform: none;
}

.pl-landing-v4 .pl-landing-cta-btn.is-fed {
    animation: pl-landing-cta-feed-pulse 0.85s ease-out;
}

.pl-landing-v4 .pl-landing-cta-btn.is-fed::before {
    animation: pl-landing-cta-feed-ring 0.85s ease-out;
}

@keyframes pl-landing-cta-glow-breathe {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 0.88; }
}

@keyframes pl-landing-cta-feed-pulse {
    0%, 100% {
        box-shadow: 0 0 32px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.22);
    }
    35% {
        box-shadow:
            0 0 28px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.7),
            0 0 72px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.55),
            0 0 120px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.35);
    }
}

@keyframes pl-landing-cta-feed-ring {
    0%, 100% {
        opacity: 0.72;
        box-shadow: 0 0 40px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.28);
    }
    35% {
        opacity: 1;
        box-shadow:
            0 0 24px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.95),
            0 0 64px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.7),
            0 0 110px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.5);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-landing-v4 .pl-landing-cta-btn::before,
    .pl-landing-v4 .pl-landing-cta-btn.is-fed,
    .pl-landing-v4 .pl-landing-cta-btn.is-fed::before {
        animation: none;
    }
}

.pl-landing-v4 .pl-landing-slide--cta .pl-landing-btn--ghost {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.28);
}

/* ── Footer: see pl-landing-footer.css ── */

@media (max-height: 760px) {
    .pl-landing-v4 .pl-landing-slide--cta .pl-landing-headline {
        font-size: clamp(24px, 4vw, 36px);
        margin-bottom: 12px;
    }

    .pl-landing-v4 .pl-landing-slide--cta .pl-landing-sub {
        margin-bottom: 16px;
    }
}

/* ── Category label (colored stripe) ── */
.pl-landing-v4-cat {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 20px;
    padding: 8px 14px 8px 10px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    background: #fff;
    border: 1px solid var(--pl-border);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
}

.pl-landing-v4-cat-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.pl-landing-v4-cat-dot--blue { background: var(--v4-blue); }
.pl-landing-v4-cat-dot--coral { background: var(--v4-coral); }
.pl-landing-v4-cat-dot--violet { background: var(--v4-violet); }
.pl-landing-v4-cat-dot--sites { background: var(--v4-sites); }
.pl-landing-v4-cat-dot--green { background: var(--v4-green); }

.pl-landing-v4 .pl-landing-eyebrow--blue { color: var(--v4-blue); }
.pl-landing-v4 .pl-landing-eyebrow--coral { color: var(--v4-coral); }
.pl-landing-v4 .pl-landing-eyebrow--violet { color: var(--v4-violet); }
.pl-landing-v4 .pl-landing-eyebrow--sites { color: var(--v4-sites); }
.pl-landing-v4 .pl-landing-eyebrow--green { color: var(--v4-green); }

/* ── Feature grid ── */
.pl-landing-v4-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 28px;
    width: 100%;
    max-width: 1080px;
}

.pl-landing-v4-feature {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.25s ease, transform 0.2s ease;
}

.pl-landing-v4-feature:hover {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.07);
    transform: translateY(-2px);
}

.pl-landing-v4-feature-media {
    aspect-ratio: 4 / 3;
    background: #f4f4f4;
    overflow: hidden;
    border-bottom: 1px solid var(--pl-border);
    border-radius: 10px 10px 0 0;
}

.pl-landing-v4-feature-media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px 10px 0 0;
}

.pl-landing-v4-feature-body {
    padding: 18px 18px 20px;
    flex: 1;
}

.pl-landing-v4-feature-title {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.25;
}

.pl-landing-v4-feature-text {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--pl-muted);
}

/* ── Split layout (text + visual) ── */
.pl-landing-v4-split {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: center;
    width: 100%;
    max-width: 1080px;
}

.pl-landing-v4-split--reverse {
    direction: rtl;
}

.pl-landing-v4-split--reverse > * {
    direction: ltr;
}

.pl-landing-v4-visual {
    border: 1px solid var(--pl-border);
    background: #fff;
    overflow: hidden;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.06);
}

.pl-landing-v4-visual:has(img[src$=".gif"]) {
    border-radius: 10px;
}

.pl-landing-v4-visual img {
    display: block;
    width: 100%;
    height: auto;
}

.pl-landing-v4-visual img[src$=".gif"] {
    border-radius: 10px;
}

.pl-landing-v4-visual--placeholder {
    aspect-ratio: 16 / 10;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

.pl-landing-v4-visual--blue { background: linear-gradient(135deg, #dbeafe, #eff6ff); }
.pl-landing-v4-visual--coral { background: linear-gradient(135deg, #ffe4dd, #fff5f0); }
.pl-landing-v4-visual--violet { background: linear-gradient(135deg, #ede9fe, #f5f3ff); }
.pl-landing-v4-visual--sites {
    background: linear-gradient(135deg, #e0e7ff, #eef2ff);
    border-radius: 10px;
}

.pl-landing-v4-visual--sites img {
    border-radius: 10px;
}

.pl-landing-v4-visual--green { background: linear-gradient(135deg, #d1fae5, #ecfdf5); }

.pl-landing-v4-visual--code {
    border-radius: 14px;
    padding: 10px;
    background: linear-gradient(145deg, rgba(124, 58, 237, 0.12), rgba(255, 255, 255, 0.92));
}

.pl-landing-v4-visual--code .pl-code-window {
    box-shadow: none;
}

/* ── Feature tags ── */
.pl-landing-v4-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
}

.pl-landing-v4-tags li {
    padding: 7px 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    border: 1px solid var(--pl-border);
    background: rgba(255, 255, 255, 0.7);
    color: var(--pl-muted);
}

.pl-landing-v4-tags--blue li:first-child {
    border-color: rgba(23, 116, 255, 0.35);
    color: var(--v4-blue);
    background: rgba(23, 116, 255, 0.08);
}

.pl-landing-v4-tags--coral li:first-child {
    border-color: rgba(255, 92, 69, 0.35);
    color: var(--v4-coral);
    background: rgba(255, 92, 69, 0.08);
}

.pl-landing-v4-tags--violet li:first-child {
    border-color: rgba(124, 58, 237, 0.35);
    color: var(--v4-violet);
    background: rgba(124, 58, 237, 0.08);
}

.pl-landing-v4-tags--teal li:first-child {
    border-color: rgba(13, 148, 136, 0.35);
    color: var(--v4-teal);
    background: rgba(13, 148, 136, 0.08);
}

.pl-landing-v4-tags--green li:first-child {
    border-color: rgba(0, 133, 86, 0.35);
    color: var(--v4-green);
    background: rgba(0, 133, 86, 0.08);
}

/* ── Voice feature tabs ── */
.pl-landing-v4-tabs {
    margin-top: 28px;
    width: 100%;
    max-width: 1080px;
}

.pl-landing-v4-tabs-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.pl-landing-v4-tabs-list button {
    padding: 8px 14px;
    border: 1px solid var(--pl-border);
    background: rgba(255, 255, 255, 0.75);
    color: var(--pl-muted);
    font-family: inherit;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pl-landing-v4-tabs-list button:hover:not(.is-active) {
    border-color: rgba(23, 116, 255, 0.35);
    color: var(--v4-blue);
}

.pl-landing-v4-tabs-list button.is-active {
    border-color: rgba(23, 116, 255, 0.45);
    background: rgba(23, 116, 255, 0.1);
    color: var(--v4-blue);
}

.pl-landing-v4-tabs-panels {
    position: relative;
    min-height: 88px;
}

.pl-landing-v4-tabs-media {
    margin: -20px -22px 16px;
    aspect-ratio: 16 / 10;
    background: #f4f4f4;
    overflow: hidden;
    border-bottom: 1px solid var(--pl-border);
}

.pl-landing-v4-tabs-media video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pl-landing-v4-tabs-panel {
    padding: 20px 22px;
    background: #fff;
    border: 1px solid var(--pl-border);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.04);
}

.pl-landing-v4-tabs-panel[hidden] {
    display: none;
}

.pl-landing-v4-tabs-title {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--pl-text);
}

.pl-landing-v4-tabs-text {
    margin: 0;
    max-width: 62ch;
    font-size: 14px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-v4-tabs-text--follow {
    margin-top: 10px;
}

.pl-landing-v4-tabs--coral .pl-landing-v4-tabs-list button:hover:not(.is-active) {
    border-color: rgba(255, 92, 69, 0.35);
    color: var(--v4-coral);
}

.pl-landing-v4-tabs--coral .pl-landing-v4-tabs-list button.is-active {
    border-color: rgba(255, 92, 69, 0.45);
    background: rgba(255, 92, 69, 0.1);
    color: var(--v4-coral);
}

.pl-landing-v4-tabs--violet .pl-landing-v4-tabs-list button:hover:not(.is-active) {
    border-color: rgba(124, 58, 237, 0.35);
    color: var(--v4-violet);
}

.pl-landing-v4-tabs--violet .pl-landing-v4-tabs-list button.is-active {
    border-color: rgba(124, 58, 237, 0.45);
    background: rgba(124, 58, 237, 0.1);
    color: var(--v4-violet);
}

.pl-landing-v4-tabs--sites .pl-landing-v4-tabs-list button:hover:not(.is-active) {
    border-color: rgba(99, 102, 241, 0.35);
    color: var(--v4-sites);
}

.pl-landing-v4-tabs--sites .pl-landing-v4-tabs-list button.is-active {
    border-color: rgba(99, 102, 241, 0.45);
    background: rgba(99, 102, 241, 0.1);
    color: var(--v4-sites);
}

.pl-landing-v4-tabs--green .pl-landing-v4-tabs-list button:hover:not(.is-active) {
    border-color: rgba(0, 133, 86, 0.35);
    color: var(--v4-green);
}

.pl-landing-v4-tabs--green .pl-landing-v4-tabs-list button.is-active {
    border-color: rgba(0, 133, 86, 0.45);
    background: rgba(0, 133, 86, 0.1);
    color: var(--v4-green);
}

.pl-landing-v4 .pl-landing-slide--hero {
    justify-content: flex-start;
    padding-top: calc(var(--pl-landing-header-h) + clamp(40px, 6vh, 64px));
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

.pl-landing-v4 .pl-landing-slide--hero .pl-landing-slide-inner--wide {
    max-width: none;
    margin: 0;
}

.pl-landing-v4 .pl-landing-slide-inner--wide {
    max-width: 1080px;
    margin-left: auto;
    margin-right: auto;
}

.pl-landing-v4 .pl-landing-headline {
    max-width: 18ch;
}

.pl-landing-v4 .pl-landing-slide--blue .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--coral .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--violet .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--sites .pl-landing-headline,
.pl-landing-v4 .pl-landing-slide--green .pl-landing-headline {
    max-width: 22ch;
}

.pl-landing-v4 .pl-landing-headline--hero {
    max-width: none;
}

.pl-landing-v4 .pl-landing-path-hub {
    display: none;
}

@media (max-width: 960px) {
    .pl-landing-v4-grid {
        grid-template-columns: 1fr;
        max-width: none;
    }

    .pl-landing-v4-split {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        grid-template-columns: none;
        max-width: none;
    }

    .pl-landing-v4-split > div:first-child:not(.pl-landing-v4-visual) {
        display: contents;
    }

    .pl-landing-v4-split .pl-landing-v4-visual {
        order: 1;
        width: 100%;
    }

    .pl-landing-v4-split .pl-landing-v4-tabs {
        order: 2;
        width: 100%;
    }

    .pl-landing-v4-split--reverse {
        direction: ltr;
    }

    .pl-landing-v4-tabs {
        max-width: none;
    }

    .pl-landing-v4 .pl-landing-slide--blue .pl-landing-headline,
    .pl-landing-v4 .pl-landing-slide--coral .pl-landing-headline,
    .pl-landing-v4 .pl-landing-slide--violet .pl-landing-headline,
    .pl-landing-v4 .pl-landing-slide--sites .pl-landing-headline,
    .pl-landing-v4 .pl-landing-slide--green .pl-landing-headline {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .pl-landing-v4 .pl-landing-slide--hero {
        padding: calc(var(--pl-landing-header-h) + 32px) 0 0;
    }
}

/* ── Websites: loading race section ── */
.pl-sites-stack {
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 4vh, 44px);
}

.pl-sites-intro {
    max-width: 720px;
}

.pl-sites-headline {
    max-width: 20ch;
}

.pl-sites-sub {
    max-width: 58ch;
    margin-bottom: 0;
}

.pl-sites-intro .pl-landing-actions {
    margin-top: 20px;
}

.pl-sites-race {
    padding: clamp(18px, 3vw, 28px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 16px;
}

.pl-sites-race-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.pl-sites-race-title {
    margin: 0 0 6px;
    font-size: clamp(18px, 2.4vw, 24px);
    font-weight: 500;
    letter-spacing: -0.02em;
}

.pl-sites-race-lead {
    margin: 0;
    max-width: 42ch;
    font-size: 13px;
    line-height: 1.5;
    color: var(--pl-muted);
}

.pl-sites-race-run {
    flex-shrink: 0;
    padding: 10px 16px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #fff;
    background: var(--v4-green);
    border: none;
    border-radius: 999px;
    cursor: pointer;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.pl-sites-race-run:hover:not(:disabled) {
    opacity: 0.9;
    transform: translateY(-1px);
}

.pl-sites-race-run:disabled {
    opacity: 0.55;
    cursor: wait;
}

.pl-sites-race-lanes {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.pl-sites-race-lane {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 12px;
}

.pl-sites-race-lane--pl {
    border-color: rgba(0, 133, 86, 0.28);
}

.pl-sites-race-lane-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.pl-sites-race-lane-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pl-sites-race-lane-metric {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
    color: var(--pl-muted-2);
}

.pl-sites-race-lane-name {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.01em;
    color: var(--pl-muted);
}

.pl-sites-race-lane--pl .pl-sites-race-lane-name {
    color: var(--v4-green);
}

.pl-sites-race-timer {
    font-variant-numeric: tabular-nums;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-sites-race-lane--wp .pl-sites-race-timer {
    color: var(--pl-muted);
}

.pl-sites-race-lane--pl .pl-sites-race-timer {
    color: var(--v4-green);
}

.pl-sites-race-browser {
    overflow: hidden;
    border: 1px solid rgba(15, 23, 42, 0.1);
    border-radius: 10px;
    background: #fff;
}

.pl-sites-race-browser-bar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    background: #f3f4f6;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.pl-sites-race-browser-bar span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d1d5db;
}

.pl-sites-race-browser-bar span:first-child,
.pl-sites-race-browser-bar span:nth-child(2),
.pl-sites-race-browser-bar span:nth-child(3) {
    background: #d1d5db;
}

.pl-sites-race-lane--pl .pl-sites-race-browser-bar span:first-child,
.pl-sites-race-lane--pl .pl-sites-race-browser-bar span:nth-child(2),
.pl-sites-race-lane--pl .pl-sites-race-browser-bar span:nth-child(3) {
    background: #9eceb8;
}

.pl-sites-race-preview {
    position: relative;
    min-height: 132px;
    padding: 14px;
}

.pl-sites-race-preview-skel {
    position: absolute;
    inset: 14px;
    border-radius: 6px;
    background: linear-gradient(90deg, #f0f0f0 0%, #f8f8f8 45%, #f0f0f0 100%);
    background-size: 200% 100%;
    animation: pl-sites-shimmer 1.4s ease-in-out infinite;
    opacity: 1;
    transition: opacity 0.35s ease;
}

.pl-sites-race-lane--pl .pl-sites-race-preview-skel {
    background: linear-gradient(90deg, #e8f5ef 0%, #f4faf7 45%, #e8f5ef 100%);
    background-size: 200% 100%;
}

.pl-sites-race-preview.is-ready .pl-sites-race-preview-skel {
    opacity: 0;
}

.pl-sites-race-preview-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    opacity: 0.35;
    transition: opacity 0.45s ease;
}

.pl-sites-race-preview.is-ready .pl-sites-race-preview-content {
    opacity: 1;
}

.pl-sites-race-preview-hero {
    height: 52px;
    border-radius: 6px;
    background: linear-gradient(135deg, #b8dcc8, #e0f0e8);
}

.pl-sites-race-lane--wp .pl-sites-race-preview-hero {
    background: linear-gradient(135deg, #e8e8e8, #f3f3f3);
}

.pl-sites-race-preview-line {
    height: 8px;
    width: 88%;
    border-radius: 4px;
    background: #e5e7eb;
}

.pl-sites-race-preview-line--short {
    width: 62%;
}

.pl-sites-race-progress {
    height: 4px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.08);
}

.pl-sites-race-progress-fill {
    width: 0%;
    height: 100%;
    border-radius: inherit;
    background: #c4c4c4;
    transition: width 0.08s linear;
}

.pl-sites-race-lane--pl .pl-sites-race-progress-fill {
    background: var(--v4-green);
}

.pl-sites-race-steps {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pl-sites-race-steps li {
    position: relative;
    padding-left: 18px;
    font-size: 11px;
    line-height: 1.4;
    color: var(--pl-muted-2);
    transition: color 0.2s ease;
}

.pl-sites-race-steps li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 1.5px solid #d1d5db;
    background: #fff;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.pl-sites-race-steps li.is-active {
    color: var(--pl-text);
}

.pl-sites-race-steps li.is-active::before {
    border-color: currentColor;
    background: currentColor;
    animation: pl-sites-pulse 0.8s ease-in-out infinite;
}

.pl-sites-race-lane--wp .pl-sites-race-steps li.is-active {
    color: var(--pl-muted);
}

.pl-sites-race-lane--pl .pl-sites-race-steps li.is-active {
    color: var(--v4-green);
}

.pl-sites-race-steps li.is-done {
    color: var(--pl-muted);
}

.pl-sites-race-lane--wp .pl-sites-race-steps li.is-done::before {
    border-color: #c4c4c4;
    background: #c4c4c4;
    animation: none;
}

.pl-sites-race-lane--pl .pl-sites-race-steps li.is-done::before {
    border-color: var(--v4-green);
    background: var(--v4-green);
    animation: none;
}

.pl-sites-race-result {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--pl-border);
}

.pl-sites-race-result-label {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 500;
    color: var(--pl-muted);
}

.pl-sites-race-fcp-bars {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 14px;
}

.pl-sites-race-fcp-bar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 6px;
    font-size: 12px;
    color: var(--pl-muted);
}

.pl-sites-race-fcp-bar-head strong {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--pl-text);
}

.pl-sites-race-fcp-bar--wp .pl-sites-race-fcp-bar-head strong {
    color: var(--pl-muted);
}

.pl-sites-race-fcp-bar--pl .pl-sites-race-fcp-bar-head strong {
    color: var(--v4-green);
}

.pl-sites-race-fcp-bar-track {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.08);
}

.pl-sites-race-fcp-bar-fill {
    height: 100%;
    border-radius: inherit;
}

.pl-sites-race-fcp-bar--wp .pl-sites-race-fcp-bar-fill {
    width: 100%;
    background: #d4d4d4;
}

.pl-sites-race-fcp-bar--pl .pl-sites-race-fcp-bar-fill {
    width: 20%;
    background: var(--v4-green);
}

.pl-sites-race-result-copy {
    margin: 0 0 14px;
    max-width: 58ch;
    font-size: 14px;
    line-height: 1.6;
    color: var(--pl-muted);
}

.pl-sites-race-result-copy strong {
    font-weight: 600;
}

.pl-sites-race-lighthouse {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

.pl-sites-race-lighthouse-col {
    padding: 14px;
    border-radius: 10px;
    background: #fafafa;
    border: 1px solid var(--pl-border);
}

.pl-sites-race-lighthouse-col--wp {
    border-color: var(--pl-border);
    background: #fff;
}

.pl-sites-race-lighthouse-col--wp .pl-sites-race-lighthouse-title,
.pl-sites-race-lighthouse-col--wp .pl-sites-race-lighthouse-scores li span {
    color: var(--pl-muted-2);
}

.pl-sites-race-lighthouse-col--wp .pl-sites-race-lighthouse-scores strong {
    color: var(--pl-muted-2);
}

.pl-sites-race-lighthouse-col--pl {
    border-color: rgba(0, 133, 86, 0.28);
    background: #fff;
}

.pl-sites-race-lighthouse-title {
    margin: 0 0 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.35;
    color: var(--pl-text);
}

.pl-sites-race-lighthouse-site {
    margin: 0 0 10px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-muted);
}

.pl-sites-race-lighthouse-col--pl .pl-sites-race-lighthouse-site {
    color: var(--v4-green);
}

.pl-sites-race-lighthouse-col--wp .pl-sites-race-lighthouse-site {
    color: var(--pl-muted-2);
}

.pl-sites-race-lighthouse-scores {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pl-sites-race-lighthouse-scores li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    color: var(--pl-text);
}

.pl-sites-race-lighthouse-scores strong {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
}

.pl-sites-race-lighthouse-scores strong.is-good {
    color: var(--v4-green);
}

.pl-sites-race-lighthouse-scores strong.is-bad {
    color: var(--pl-muted-2);
}

.pl-sites-race-disclaimer {
    margin: 14px 0 0;
    font-size: 10px;
    line-height: 1.45;
    color: var(--pl-muted-2);
}

.pl-sites-tabs {
    max-width: none;
}

@keyframes pl-sites-shimmer {
    0% { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

@keyframes pl-sites-pulse {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.15); opacity: 0.7; }
}

@media (max-width: 900px) {
    .pl-sites-race-lanes {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .pl-sites-race-head {
        flex-direction: column;
        align-items: stretch;
    }

    .pl-sites-race-run {
        width: 100%;
    }

    .pl-sites-race-lighthouse {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-sites-race-preview-skel {
        animation: none;
    }

    .pl-sites-race-steps li.is-active::before {
        animation: none;
    }

    .pl-sites-race-progress-fill {
        transition: none;
    }
}


/* ---- css/pl-dash/user-menu.css ---- */
/* Shared dashboard user avatar + account dropdown (marketing header + dash topbar) */
:root {
    --pl-text: #0e0e0e;
    --pl-border: #e4e4e4;
    --pl-border-strong: #d4d4d4;
    --pl-muted: #6f6f6f;
    --pl-muted-2: #9a9a9a;
    --pl-red: #b42318;
}

.pl-team-presence-badge {
    --pl-presence-color: #22c55e;
    --pl-presence-dot-size: 10px;
    position: absolute;
    bottom: -1px;
    right: -1px;
    width: var(--pl-presence-dot-size);
    height: var(--pl-presence-dot-size);
    background: var(--pl-presence-color);
    border: 1px solid #fff;
    border-radius: 50%;
    box-sizing: border-box;
    pointer-events: none;
    z-index: 4;
}

.pl-dash-team-presence-dot[hidden],
.pl-team-presence-badge[hidden] {
    display: none !important;
}

.pl-dash-user-menu-wrap {
    position: relative;
}

.pl-dash-user-menu-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: 240px;
    padding: 4px 8px 4px 4px;
    border: 1px solid var(--pl-border);
    background: #fff;
    color: var(--pl-text);
    cursor: pointer;
    border-radius: 0;
    font-family: inherit;
    text-align: left;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.pl-dash-user-menu-btn:hover {
    background: #f7f7f7;
    border-color: var(--pl-border-strong);
}

.pl-dash-user-menu-avatar-wrap {
    position: relative;
    display: inline-flex;
    flex-shrink: 0;
}

.pl-dash-user-menu-avatar-wrap .pl-dash-user-menu-presence-dot {
    --pl-presence-dot-size: max(8px, calc(10px * 28 / 40));
    bottom: 0;
    right: 0;
    z-index: 2;
}

.pl-dash-avatar {
    width: 28px;
    height: 28px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    letter-spacing: 0.02em;
}

.pl-dash-avatar-icon {
    display: block;
    width: 14px;
    height: 14px;
    color: #fff;
}

.pl-dash-avatar.has-photo {
    background: transparent;
    overflow: hidden;
}

.pl-dash-avatar-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.pl-dash-user-menu-text {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    flex: 1 1 auto;
}

.pl-dash-user-menu-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
}

.pl-dash-user-menu-meta {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--pl-muted-2);
    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
}

.pl-dash-user-menu-meta[hidden] {
    display: none !important;
}

.pl-dash-user-menu-chevron {
    flex-shrink: 0;
    color: var(--pl-muted);
}

.pl-dash-user-menu {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    width: max-content;
    min-width: 220px;
    padding: 4px 0;
    background: #fff;
    border: 1px solid var(--pl-text);
    border-radius: 0;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.1);
    z-index: 40;
}

.pl-dash-user-menu[hidden] {
    display: none !important;
}

.pl-dash-user-menu-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 14px 12px;
    border-bottom: 1px solid var(--pl-border);
    margin-bottom: 4px;
}

.pl-dash-user-menu-head-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--pl-text);
    line-height: 1.3;
}

.pl-dash-user-menu-head-meta {
    font-size: 11px;
    color: var(--pl-muted);
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 240px;
}

.pl-dash-user-menu-head-meta[hidden] {
    display: none !important;
}

@media (max-width: 960px) {
    /* Avatar opens Settings sheet on mobile — never show the desktop dropdown. */
    .pl-dash-user-menu {
        display: none !important;
    }

    .pl-dash-user-menu-btn {
        max-width: none;
        padding: 0;
        border: none;
        background: transparent;
        gap: 0;
    }

    .pl-dash-user-menu-btn:hover,
    .pl-dash-user-menu-btn[aria-expanded='true'] {
        background: transparent;
        border-color: transparent;
    }

    .pl-dash-user-menu-text,
    .pl-dash-user-menu-chevron {
        display: none;
    }

    .pl-dash-avatar {
        width: 32px;
        height: 32px;
    }
}

.pl-dash-user-menu [hidden] {
    display: none !important;
}

.pl-dash-user-menu button,
.pl-dash-user-menu a[role='menuitem'] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: auto;
    min-width: 100%;
    box-sizing: border-box;
    white-space: nowrap;
    padding: 9px 14px;
    border: none;
    background: transparent;
    text-align: left;
    font-family: inherit;
    font-size: 13px;
    color: var(--pl-text);
    cursor: pointer;
    text-decoration: none;
}

.pl-dash-user-menu button:hover,
.pl-dash-user-menu a[role='menuitem']:hover {
    background: #f7f7f7;
}

.pl-dash-user-menu-icon {
    flex-shrink: 0;
    opacity: 0.7;
}

.pl-dash-user-menu button:hover .pl-dash-user-menu-icon,
.pl-dash-user-menu a[role='menuitem']:hover .pl-dash-user-menu-icon {
    opacity: 1;
}

.pl-dash-user-menu button.is-danger {
    color: var(--pl-red);
}

.pl-dash-user-menu button.is-danger .pl-dash-user-menu-icon {
    opacity: 0.85;
}

.pl-dash-user-menu-separator {
    height: 1px;
    margin: 4px 0;
    background: var(--pl-border);
}

.pl-marketing-header__nav .pl-dash-user-menu-wrap {
    flex-shrink: 0;
    position: relative;
    z-index: 60;
}

.pl-marketing-header__nav .pl-dash-user-menu {
    z-index: 60;
}

/* Marketing keeps its compact round account control. */
.pl-marketing-header .pl-dash-user-menu-btn {
    max-width: none;
    padding: 0;
    border: none;
    background: transparent;
    gap: 0;
    border-radius: 50%;
}

.pl-marketing-header .pl-dash-user-menu-btn:hover,
.pl-marketing-header .pl-dash-user-menu-btn[aria-expanded='true'] {
    background: transparent;
    border-color: transparent;
}

.pl-marketing-header .pl-dash-user-menu-text,
.pl-marketing-header .pl-dash-user-menu-chevron,
.pl-marketing-header .pl-dash-user-menu-head {
    display: none;
}

.pl-marketing-header .pl-dash-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}

.pl-marketing-header .pl-dash-user-menu-btn:hover .pl-dash-avatar,
.pl-marketing-header .pl-dash-user-menu-btn[aria-expanded='true'] .pl-dash-avatar {
    outline: 2px solid var(--pl-border-strong);
    outline-offset: 2px;
}


/* ---- css/pl-path-mark.css ---- */
/* Shared stepped-path mark — header mega + /connect coming-soon tile */
.pl-path-mark {
    display: block;
}

.pl-path-mark__track,
.pl-path-mark__draw {
    stroke-width: 3;
    stroke-linecap: square;
    stroke-linejoin: miter;
}

.pl-path-mark__track {
    stroke: rgba(14, 14, 14, 0.12);
}

.pl-path-mark__draw {
    stroke: #0e0e0e;
    /* Total length of the stepped path */
    stroke-dasharray: 164;
    stroke-dashoffset: 164;
    animation: pl-path-mark-draw 3.6s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}

.pl-path-mark__node {
    fill: rgba(14, 14, 14, 0.22);
}

/* Near-zero dash + round cap = a circle riding the same path as the stroke. */
.pl-path-mark__dot {
    fill: none;
    stroke: #1774ff;
    stroke-width: 9;
    stroke-linecap: round;
    stroke-dasharray: 0.1 400;
    stroke-dashoffset: 0;
    animation: pl-path-mark-dot 3.6s cubic-bezier(0.65, 0, 0.35, 1) infinite;
}

.pl-path-mark--on-dark .pl-path-mark__track {
    stroke: rgba(255, 255, 255, 0.16);
}

.pl-path-mark--on-dark .pl-path-mark__draw {
    stroke: #fff;
}

.pl-path-mark--on-dark .pl-path-mark__node {
    fill: rgba(255, 255, 255, 0.3);
}

@keyframes pl-path-mark-draw {
    0%, 6% { stroke-dashoffset: 164; opacity: 0; }
    12% { opacity: 1; }
    78%, 88% { stroke-dashoffset: 0; opacity: 1; }
    100% { stroke-dashoffset: 0; opacity: 0; }
}

/* Keyframe stops mirror pl-path-mark-draw exactly so the dot sits on the head. */
@keyframes pl-path-mark-dot {
    0%, 6% { stroke-dashoffset: 0; opacity: 0; }
    12% { opacity: 1; }
    78%, 88% { stroke-dashoffset: -164; opacity: 1; }
    100% { stroke-dashoffset: -164; opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .pl-path-mark__draw,
    .pl-path-mark__dot {
        animation: none;
        opacity: 1;
    }

    .pl-path-mark__draw {
        stroke-dashoffset: 0;
    }

    .pl-path-mark__dot {
        stroke-dashoffset: -164;
    }
}


/* ---- css/pl-marketing-header.css ---- */
/* Shared marketing header — landing + legal pages */



:root {
    --pl-marketing-inset: clamp(56px, 12vw, 200px);
    /* Legacy max width for pages that still center body copy to the old column */
    --pl-marketing-bar-max: 1120px;
    --pl-marketing-bar-gutter: clamp(20px, 5vw, 48px);
    --pl-marketing-bar-h: 72px;
    --pl-marketing-header-h: var(--pl-marketing-bar-h);
}

/* External / new-tab affordance (same glyph as sales-modal powered-by) */
.pl-link-out-icon {
    display: block;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    position: relative;
    top: -0.5px;
}

a:has(> .pl-link-out-icon) {
    gap: 6px;
}

.pl-marketing-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 200;
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: var(--pl-marketing-header-h, 72px);
    padding: 0;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(228, 228, 228, 0.6);
    /* Must stay visible so Product mega + logged-in user menu aren't clipped */
    overflow: visible;
    transition:
        background 0.25s ease;
}

.pl-marketing-header__promo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    min-height: var(--pl-marketing-promo-h, 36px);
    padding: 8px 16px;
    box-sizing: border-box;
    background: #0e0e0e;
    color: #ffffff;
    text-decoration: none;
    text-align: center;
    transition: background 120ms ease;
}

.pl-marketing-header__promo:hover {
    background: #1a1a1a;
    color: #ffffff;
}

.pl-marketing-header__promo-text {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.01em;
    line-height: 1.35;
}

.pl-marketing-header__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    height: var(--pl-marketing-bar-h, 72px);
    box-sizing: border-box;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 var(--pl-marketing-bar-gutter);
    gap: 20px;
}

.pl-marketing-header__start {
    display: flex;
    align-items: center;
    gap: 28px;
    min-width: 0;
}

.pl-marketing-header__links {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.pl-marketing-header__links a {
    position: relative;
    display: inline-block;
    margin: -8px 0;
    padding: 8px 0;
    color: var(--pl-marketing-header-text, #0e0e0e);
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

.pl-marketing-header__links a::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 4px;
    width: 0;
    height: 0;
    border-bottom: 2px solid currentColor;
    transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.pl-marketing-header__links a:hover::after,
.pl-marketing-header__links a.is-active::after {
    width: 100%;
}

.pl-marketing-header--dark .pl-marketing-header__links a {
    color: #fff;
}

.pl-marketing-header--sticky {
    position: sticky;
    top: 0;
    z-index: 200;
    background: rgba(255, 255, 255, 0.92);
    border-bottom-color: #e4e4e4;
}

.pl-marketing-header--dark {
    background: rgba(10, 10, 10, 0.72);
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

.pl-marketing-header__logo {
    display: block;
    flex-shrink: 0;
    line-height: 0;
    text-decoration: none;
}

.pl-marketing-header__logo:hover {
    opacity: 0.82;
}

.pl-marketing-header__logo img {
    display: block;
    height: 24px;
    width: auto;
    object-fit: contain;
}

.pl-marketing-header--dark .pl-marketing-header__logo img {
    filter: invert(1);
}

.pl-marketing-header__nav {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-shrink: 0;
}

.pl-marketing-header__dropdown {
    position: relative;
}

.pl-marketing-header__dropdown-trigger {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: -8px 0;
    padding: 8px 0;
    border: 0;
    background: transparent;
    color: var(--pl-marketing-header-text, #0e0e0e);
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.01em;
    cursor: pointer;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.pl-marketing-header__dropdown-label {
    position: relative;
    display: inline-block;
}

.pl-marketing-header__dropdown-label::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 0;
    border-bottom: 2px solid currentColor;
    transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

.pl-marketing-header__dropdown-trigger:hover .pl-marketing-header__dropdown-label::after,
.pl-marketing-header__dropdown-trigger.is-active .pl-marketing-header__dropdown-label::after,
.pl-marketing-header__dropdown.is-open .pl-marketing-header__dropdown-label::after {
    width: 100%;
}

.pl-marketing-header__dropdown-chevron {
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
}

.pl-marketing-header__dropdown.is-open .pl-marketing-header__dropdown-chevron {
    transform: rotate(180deg);
}

.pl-marketing-header__dropdown-menu {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 3;
    min-width: 216px;
    padding: 8px 0;
    background: #fff;
    border: 1px solid #e5e5e5;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.1);
}

.pl-marketing-header__dropdown-menu::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: 12px;
}

.pl-marketing-header__dropdown-menu[hidden] {
    display: none !important;
}

.pl-marketing-header__dropdown-menu a {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 8px 16px;
    color: #0e0e0e;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-decoration: none;
    white-space: nowrap;
}

.pl-marketing-header__dropdown-menu a::after {
    content: none;
}

.pl-marketing-header__dropdown-menu a:hover,
.pl-marketing-header__dropdown-menu a.is-active {
    background: #f5f5f5;
}

.pl-marketing-header--dark .pl-marketing-header__dropdown-menu {
    background: #111;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
}

.pl-marketing-header--dark .pl-marketing-header__dropdown-menu a {
    color: #fff;
}

.pl-marketing-header--dark .pl-marketing-header__dropdown-menu a:hover,
.pl-marketing-header--dark .pl-marketing-header__dropdown-menu a.is-active {
    background: #1a1a1a;
}

/* Desktop: Product mega — panel under header content width */
@media (min-width: 769px) {
    .pl-marketing-header {
        height: auto;
        min-height: var(--pl-marketing-header-h, 72px);
        overflow: visible;
    }

    .pl-marketing-header.is-nav-open,
    .pl-marketing-header:has(.pl-marketing-header__dropdown.is-open) {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .pl-marketing-header__mega {
        position: absolute;
        top: 100%;
        left: var(--pl-mega-menu-left, var(--pl-marketing-bar-gutter));
        right: auto;
        transform: none;
        z-index: 1;
        width: min(760px, calc(100vw - var(--pl-mega-menu-left, var(--pl-marketing-bar-gutter)) - var(--pl-marketing-bar-gutter)));
        max-width: 760px;
        min-width: 0;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        background: transparent;
        border: none;
        box-shadow: none;
        visibility: hidden;
        pointer-events: none;
        max-height: 0;
        overflow: hidden;
        transition:
            max-height 0.42s cubic-bezier(0.16, 1, 0.3, 1),
            visibility 0s linear 0.42s;
    }

    .pl-marketing-header__mega[hidden] {
        display: block;
    }

    .pl-marketing-header.is-nav-open .pl-marketing-header__mega {
        visibility: visible;
        pointer-events: auto;
        max-height: 520px;
        overflow: visible;
        transition:
            max-height 0.42s cubic-bezier(0.16, 1, 0.3, 1),
            visibility 0s linear 0s;
    }

    .pl-marketing-header__mega-inner {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(180px, 220px);
        gap: 0;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        background: #fff;
        border: 1px solid #e5e5e5;
        border-radius: 0;
        box-shadow: 0 18px 48px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        transform: translateY(-8px);
        opacity: 0;
        transition:
            transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
            opacity 0.32s ease;
    }

    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-inner {
        transform: translateY(0);
        opacity: 1;
    }

    .pl-marketing-header__mega-main {
        display: flex;
        flex-direction: column;
        min-width: 0;
        background: #fff;
    }

    .pl-marketing-header__mega-split {
        display: grid;
        grid-template-columns: minmax(160px, 200px) minmax(0, 1fr);
        gap: 0;
        min-height: 260px;
        flex: 1 1 auto;
    }

    .pl-marketing-header__mega-cats {
        display: flex;
        flex-direction: column;
        gap: 4px;
        padding: 24px 16px 24px 24px;
        border-right: 1px solid #ececec;
        background: #fafafa;
    }

    .pl-marketing-header__mega-cat {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        margin: 0;
        padding: 12px 14px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #0e0e0e;
        font: inherit;
        font-size: 15px;
        font-weight: 600;
        letter-spacing: -0.02em;
        text-align: left;
        cursor: pointer;
        transition: background 0.15s ease, color 0.15s ease;
    }

    .pl-marketing-header__mega-cat::after {
        content: '';
        width: 7px;
        height: 7px;
        border-right: 1.75px solid currentColor;
        border-top: 1.75px solid currentColor;
        transform: rotate(45deg);
        opacity: 0.35;
        flex-shrink: 0;
    }

    .pl-marketing-header__mega-cat:hover,
    .pl-marketing-header__mega-cat.is-active {
        background: #fff;
        box-shadow: 0 0 0 1px #e8e8e8;
    }

    .pl-marketing-header__mega-cat.is-active::after {
        opacity: 0.7;
    }

    .pl-marketing-header__mega-panels {
        position: relative;
        min-width: 0;
        padding: 28px 32px 24px;
    }

    .pl-marketing-header__mega-panel {
        display: none;
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
        min-width: 0;
    }

    .pl-marketing-header__mega-panel.is-active {
        display: flex;
    }

    .pl-marketing-header__mega-panel[hidden] {
        display: none !important;
    }

    .pl-marketing-header__mega-cols {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px 28px;
        padding: 28px 32px 24px;
        flex: 1 1 auto;
    }

    .pl-marketing-header__mega-col {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        min-width: 0;
    }

    .pl-marketing-header__mega-col-title {
        margin: 0 0 4px;
        font-size: 18px;
        font-weight: 700;
        letter-spacing: -0.03em;
        color: #0e0e0e;
        line-height: 1.2;
    }

    .pl-marketing-header__mega-foot {
        margin-top: auto;
        padding: 16px 32px;
        border-top: 1px solid #ececec;
        background: #fff;
    }

    .pl-marketing-header__mega-foot a {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        color: #0e0e0e;
        text-decoration: none;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: -0.01em;
        transition: opacity 0.15s ease;
    }

    .pl-marketing-header__mega-foot a:hover {
        opacity: 0.7;
    }

    .pl-marketing-header__mega-aside {
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 100%;
        align-self: stretch;
        border-left: 1px solid #ececec;
        background: #f5f5f5;
    }

    .pl-marketing-header__mega-aside-visual {
        flex: 1 1 auto;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 28px 20px;
        min-height: 140px;
    }

    .pl-marketing-header__mega-aside-visual .pl-path-mark {
        width: 108px;
        height: 108px;
    }

    .pl-marketing-header__mega-aside-visual img {
        display: block;
        width: 72px;
        height: 72px;
        object-fit: contain;
        border-radius: 0;
    }

    .pl-marketing-header__mega-aside-cta {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        margin: 0;
        margin-top: auto;
        flex-shrink: 0;
        padding: 16px 18px;
        border-top: 1px solid #e4e4e4;
        background: #ececec;
        color: #0e0e0e;
        text-decoration: none;
        font-size: 14px;
        font-weight: 650;
        letter-spacing: -0.02em;
        transition: background 0.15s ease;
    }

    .pl-marketing-header__mega-aside-cta:hover {
        background: #e4e4e4;
    }

    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-col {
        animation: pl-mega-col-in 0.42s cubic-bezier(0.16, 1, 0.3, 1) backwards;
    }

    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-col:nth-child(1) { animation-delay: 0.04s; }
    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-col:nth-child(2) { animation-delay: 0.08s; }
    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-col:nth-child(3) { animation-delay: 0.12s; }
}

@media (min-width: 769px) and (max-width: 1100px) {
    .pl-marketing-header__mega-inner {
        grid-template-columns: minmax(0, 1fr) minmax(150px, 180px);
    }

    .pl-marketing-header__mega-cols {
        gap: 8px 18px;
        padding: 22px 20px 18px;
    }

    .pl-marketing-header__mega-col-title {
        font-size: 16px;
    }

    .pl-marketing-header__mega-foot {
        padding: 14px 20px;
    }
}

@media (max-width: 768px) {
    .pl-marketing-header__mega {
        display: none !important;
    }
}

.pl-marketing-header__mega-item {
    display: block;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #0e0e0e;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    line-height: 1.35;
    transition: opacity 0.15s ease;
}

.pl-marketing-header__mega-item:hover,
.pl-marketing-header__mega-item.is-active {
    opacity: 0.62;
    background: transparent;
    border-color: transparent;
}

span.pl-marketing-header__mega-item {
    cursor: default;
}

span.pl-marketing-header__mega-item:hover {
    opacity: 1;
}

.pl-marketing-header__mega-item strong,
.pl-marketing-header__mega-item span {
    display: none;
}

@keyframes pl-mega-col-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Path mark animation lives in pl-path-mark.css — pause until the mega is open */
.pl-marketing-header:not(.is-nav-open) .pl-path-mark__draw,
.pl-marketing-header:not(.is-nav-open) .pl-path-mark__dot {
    animation-play-state: paused;
}

.pl-marketing-header--dark .pl-path-mark__track {
    stroke: rgba(255, 255, 255, 0.16);
}

.pl-marketing-header--dark .pl-path-mark__draw {
    stroke: #fff;
}

.pl-marketing-header--dark .pl-path-mark__node {
    fill: rgba(255, 255, 255, 0.3);
}

.pl-marketing-header--dark .pl-marketing-header__dropdown-trigger {
    color: #fff;
}

.pl-marketing-header--dark.is-nav-open,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) {
    background: #fff;
    border-bottom-color: rgba(228, 228, 228, 0.6);
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__logo img,
.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__logo img,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__logo img {
    filter: none;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__dropdown-trigger,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__links a,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__nav a,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-trigger,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__links a,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__nav a {
    color: #0e0e0e;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__auth-sep,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__auth-sep {
    color: rgba(14, 14, 14, 0.28);
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-inner,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu {
    background: #fff;
    border-color: #e5e5e5;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.1);
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-main,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot {
    background: #fff;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-col-title,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot a,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a {
    color: #0e0e0e;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside {
    border-color: #ececec;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside {
    background: #f5f5f5;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta {
    background: #ececec;
    border-top-color: #e4e4e4;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta:hover,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a:hover,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a.is-active {
    background: #f5f5f5;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item:hover,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item.is-active {
    opacity: 0.62;
    background: transparent;
}

.pl-marketing-header--dark .pl-marketing-header__mega-inner {
    background: #111;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
}

.pl-marketing-header--dark .pl-marketing-header__mega-main,
.pl-marketing-header--dark .pl-marketing-header__mega-foot {
    background: #111;
}

.pl-marketing-header--dark .pl-marketing-header__mega-col-title,
.pl-marketing-header--dark .pl-marketing-header__mega-item,
.pl-marketing-header--dark .pl-marketing-header__mega-foot a,
.pl-marketing-header--dark .pl-marketing-header__mega-aside-cta {
    color: #fff;
}

.pl-marketing-header--dark .pl-marketing-header__mega-foot,
.pl-marketing-header--dark .pl-marketing-header__mega-aside {
    border-color: rgba(255, 255, 255, 0.1);
}

.pl-marketing-header--dark .pl-marketing-header__mega-aside {
    background: #1a1a1a;
}

.pl-marketing-header--dark .pl-marketing-header__mega-aside-cta {
    background: #222;
    border-top-color: rgba(255, 255, 255, 0.1);
}

.pl-marketing-header--dark .pl-marketing-header__mega-aside-cta:hover {
    background: #2a2a2a;
}

.pl-marketing-header--dark .pl-marketing-header__mega-item {
    background: transparent;
}

.pl-marketing-header--dark .pl-marketing-header__mega-item:hover,
.pl-marketing-header--dark .pl-marketing-header__mega-item.is-active {
    background: transparent;
    border-color: transparent;
    opacity: 0.65;
}

.pl-marketing-header--dark .pl-marketing-header__mega-cats {
    background: #141414;
    border-right-color: #2a2a2a;
}

.pl-marketing-header--dark .pl-marketing-header__mega-cat {
    color: #fff;
}

.pl-marketing-header--dark .pl-marketing-header__mega-cat:hover,
.pl-marketing-header--dark .pl-marketing-header__mega-cat.is-active {
    background: #1c1c1c;
    box-shadow: 0 0 0 1px #2a2a2a;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-cats {
    background: #fafafa;
    border-right-color: #ececec;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-cat {
    color: #0e0e0e;
}

.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-cat:hover,
.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-cat.is-active {
    background: #fff;
    box-shadow: 0 0 0 1px #e8e8e8;
}

.pl-marketing-header__nav a {
    color: var(--pl-marketing-header-text, #0e0e0e);
    text-decoration: none;
    font-size: 13px;
    letter-spacing: -0.01em;
    transition: opacity 0.15s ease;
}

/* Hide primary CTA / account bits until we know activate vs contact sales. */
html.pl-marketing-auth-pending .pl-marketing-header__cta,
html.pl-marketing-auth-pending .pl-marketing-header__mobile-cta,
html.pl-marketing-auth-pending [data-pl-marketing-dashboard],
html.pl-marketing-auth-pending [data-pl-marketing-mobile-dashboard] {
    visibility: hidden;
}

.pl-marketing-header__nav a:not(.pl-marketing-header__cta--activate):hover {
    opacity: 0.65;
}

.pl-marketing-header--dark .pl-marketing-header__nav a {
    color: #fff;
}

.pl-marketing-header__signin,
.pl-marketing-header__dashboard,
.pl-marketing-header__nav a.pl-marketing-header__cta:not(.pl-marketing-header__cta--activate) {
    font-weight: 500;
}

.pl-marketing-header__auth-links {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.pl-marketing-header__auth-sep {
    color: rgba(14, 14, 14, 0.28);
    font-size: 13px;
    line-height: 1;
    user-select: none;
}

.pl-marketing-header--dark .pl-marketing-header__auth-sep {
    color: rgba(255, 255, 255, 0.35);
}

.pl-marketing-header--signed-in .pl-marketing-header__signin,
.pl-marketing-header--signed-in [data-pl-marketing-signin-sep] {
    display: none !important;
}

.pl-marketing-header__pick-plan[hidden] {
    display: none !important;
}

.pl-marketing-header__nav a.pl-marketing-header__pick-plan {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    background: #1774ff;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 0;
    transition: background 0.2s ease, transform 0.15s ease;
}

.pl-marketing-header__nav a.pl-marketing-header__pick-plan:hover {
    background: #0f5fe0;
    color: #fff;
    opacity: 1;
}

.pl-marketing-header__nav a.pl-marketing-header__pick-plan:active {
    transform: scale(0.995);
}

.pl-marketing-header__dashboard {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--pl-marketing-header-text, #0e0e0e);
    text-decoration: none;
    white-space: nowrap;
}

.pl-marketing-header__dashboard:hover {
    opacity: 0.72;
}

.pl-marketing-header--dark .pl-marketing-header__dashboard {
    color: #fff;
}

body.pl-marketing--needs-plan .pl-marketing-header__dashboard,
body.pl-marketing--needs-plan [data-pl-marketing-dashboard-sep],
body.pl-marketing--needs-plan [data-pl-marketing-mobile-dashboard] {
    display: none !important;
}

.pl-marketing-header__nav .pl-marketing-header__download {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 10px 16px;
    line-height: 1;
    background: transparent;
    color: var(--pl-marketing-header-text, #0e0e0e);
    border: 1px solid #0e0e0e;
    box-shadow: none;
    box-sizing: border-box;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 0;
    transition: background 0.2s ease, transform 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.pl-marketing-header__nav .pl-marketing-header__download::after {
    content: none;
}

.pl-marketing-header__nav .pl-marketing-header__download:hover,
.pl-marketing-header__dropdown--download.is-open .pl-marketing-header__download {
    background: #fafafa;
    color: var(--pl-marketing-header-text, #0e0e0e);
    opacity: 1;
}

.pl-marketing-header__nav .pl-marketing-header__download:active {
    transform: scale(0.995);
}

.pl-marketing-header__dropdown--download {
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
}

.pl-marketing-header__dropdown--download .pl-marketing-header__dropdown-menu {
    left: 0;
    right: 0;
    top: 100%;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    padding: 0;
}

.pl-marketing-header__dropdown--download .pl-marketing-header__dropdown-menu a {
    justify-content: space-between;
    padding: 10px 12px;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-weight: 700;
}

.pl-marketing-header--dark .pl-marketing-header__nav .pl-marketing-header__download {
    color: #fff;
    border-color: #fff;
    box-shadow: none;
}

.pl-marketing-header--dark .pl-marketing-header__nav .pl-marketing-header__download:hover,
.pl-marketing-header--dark .pl-marketing-header__dropdown--download.is-open .pl-marketing-header__download {
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
}

.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__nav .pl-marketing-header__download {
    color: #0e0e0e;
    border-color: #0e0e0e;
}

.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__nav .pl-marketing-header__download:hover,
.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown--download.is-open .pl-marketing-header__download {
    background: #fafafa;
    color: #0e0e0e;
}

.pl-marketing-header__nav a.pl-marketing-header__cta--activate {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    line-height: 1;
    background: #0e0e0e;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none;
    border-radius: 0;
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease, transform 0.15s ease;
}

.pl-marketing-header__nav a.pl-marketing-header__cta--activate::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--pl-cta-underline, #1774ff);
    transform: scaleX(0);
    transform-origin: left;
    transition:
        transform 0.25s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.15s ease;
}

.pl-marketing-header__nav a.pl-marketing-header__cta--activate:hover {
    background: #1a1a1a;
    color: #fff;
    opacity: 1;
}

.pl-marketing-header__nav a.pl-marketing-header__cta--activate:hover::before {
    transform: scaleX(1);
}

.pl-marketing-header__nav a.pl-marketing-header__cta--activate:active {
    transform: scale(0.995);
}

.pl-marketing-header--dark .pl-marketing-header__nav a.pl-marketing-header__cta--activate {
    background: #fff;
    color: #0e0e0e;
}

.pl-marketing-header--dark .pl-marketing-header__nav a.pl-marketing-header__cta--activate:hover {
    background: #f0f0f0;
    color: #0e0e0e;
}

.pl-marketing-header__progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: rgba(0, 0, 0, 0.08);
    pointer-events: none;
}

.pl-marketing-header--dark .pl-marketing-header__progress {
    background: rgba(255, 255, 255, 0.1);
}

.pl-marketing-header__progress span {
    display: block;
    height: 100%;
    width: 0;
    background: #1774ff;
    transition: width 0.12s ease-out;
}

@media (max-width: 640px) {
    .pl-marketing-header__progress span {
        transition: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-marketing-header__progress span {
        transition: none;
    }

    .pl-marketing-header,
    .pl-marketing-header__mega,
    .pl-marketing-header__mega-inner {
        transition: none;
    }

    .pl-marketing-header.is-nav-open .pl-marketing-header__mega-item {
        animation: none;
    }
}

body.pl-sales-modal-open .pl-marketing-header {
    z-index: 1;
}

/* Mobile-only controls — hidden on desktop */
.pl-marketing-header__menu-toggle,
.pl-marketing-header__mobile {
    display: none;
}

@media (max-width: 768px) {
    .pl-marketing-header {
        --pl-marketing-inset: clamp(16px, 5vw, 24px);
        --pl-marketing-bar-gutter: clamp(16px, 5vw, 24px);
        height: auto;
        min-height: var(--pl-marketing-header-h, 72px);
        overflow: visible;
    }

    .pl-marketing-header__bar {
        gap: 8px;
    }

    .pl-marketing-header.is-mobile-open,
    .pl-marketing-header--dark.is-mobile-open {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-bottom-color: rgba(228, 228, 228, 0.6);
    }

    .pl-marketing-header__start {
        gap: 10px;
        flex: 1 1 auto;
        min-width: 0;
    }

    .pl-marketing-header__logo {
        flex-shrink: 1;
        min-width: 0;
    }

    .pl-marketing-header__logo img {
        height: 20px;
        max-width: min(120px, 32vw);
        width: auto;
    }

    .pl-marketing-header__links {
        display: none;
    }

    .pl-marketing-header__dropdown {
        display: none;
    }

    .pl-marketing-header__menu-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin: -8px -6px -8px 0;
        padding: 0;
        border: 0;
        border-radius: 8px;
        background: transparent;
        color: var(--pl-marketing-header-text, #0e0e0e);
        cursor: pointer;
        flex-shrink: 0;
    }

    .pl-marketing-header--dark .pl-marketing-header__menu-toggle {
        color: #fff;
    }

    .pl-marketing-header--dark.is-mobile-open .pl-marketing-header__menu-toggle {
        color: #0e0e0e;
    }

    .pl-marketing-header__menu-toggle:hover {
        background: rgba(0, 0, 0, 0.04);
    }

    .pl-marketing-header--dark .pl-marketing-header__menu-toggle:hover {
        background: rgba(255, 255, 255, 0.08);
    }

    .pl-marketing-header__menu-icon {
        position: relative;
        display: block;
        width: 18px;
        height: 10px;
    }

    .pl-marketing-header__menu-icon span {
        position: absolute;
        left: 0;
        right: 0;
        height: 1.5px;
        border-radius: 1px;
        background: currentColor;
        transition:
            transform 0.22s cubic-bezier(0.22, 1, 0.36, 1),
            top 0.22s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .pl-marketing-header__menu-icon span:nth-child(1) { top: 0; }
    .pl-marketing-header__menu-icon span:nth-child(2) { top: 8px; }

    .pl-marketing-header.is-mobile-open .pl-marketing-header__menu-icon span:nth-child(1) {
        top: 4px;
        transform: rotate(45deg);
    }

    .pl-marketing-header.is-mobile-open .pl-marketing-header__menu-icon span:nth-child(2) {
        top: 4px;
        transform: rotate(-45deg);
    }

    .pl-marketing-header__mobile {
        position: fixed;
        top: var(--pl-marketing-header-h, 72px);
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 29;
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        height: calc(100vh - var(--pl-marketing-header-h, 72px));
        height: calc(100dvh - var(--pl-marketing-header-h, 72px));
        max-height: calc(100svh - var(--pl-marketing-header-h, 72px));
        overflow: hidden;
        padding: 4px 0 0;
        background: #fff;
        border-top: 1px solid rgba(228, 228, 228, 0.9);
    }

    .pl-marketing-header__mobile[hidden] {
        display: none;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile {
        background: #0a0a0a;
        border-top-color: rgba(255, 255, 255, 0.1);
    }

    .pl-marketing-header__mobile-inner {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        width: 100%;
        max-width: none;
        min-height: 0;
        height: 100%;
        margin: 0;
        padding: 0 var(--pl-marketing-bar-gutter);
        box-sizing: border-box;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    .pl-marketing-header__mobile-section {
        flex: 0 0 auto;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-section {
        border-bottom-color: rgba(255, 255, 255, 0.1);
    }

    .pl-marketing-header__mobile-section-trigger,
    .pl-marketing-header__mobile-top-link {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        margin: 0;
        padding: 14px 0;
        border: 0;
        background: transparent;
        color: #0e0e0e;
        font: inherit;
        font-size: 16px;
        font-weight: 550;
        letter-spacing: -0.02em;
        line-height: 1.2;
        text-align: left;
        text-decoration: none;
        cursor: pointer;
    }

    .pl-marketing-header__mobile-top-link {
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
        box-sizing: border-box;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-top-link {
        border-bottom-color: rgba(255, 255, 255, 0.1);
    }

    .pl-marketing-header__mobile-section-trigger .pl-marketing-header__dropdown-chevron {
        flex-shrink: 0;
        opacity: 0.55;
    }

    .pl-marketing-header__mobile-section.is-open .pl-marketing-header__dropdown-chevron {
        transform: rotate(180deg);
    }

    .pl-marketing-header__mobile-section-trigger.is-active,
    .pl-marketing-header__mobile-top-link.is-active {
        font-weight: 650;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-section-trigger,
    .pl-marketing-header--dark .pl-marketing-header__mobile-top-link {
        color: #fff;
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links {
        padding: 0 0 10px 12px;
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > a {
        color: #6f6f6f;
        font-size: 15px;
        font-weight: 500;
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > .pl-marketing-header__mobile-static {
        display: block;
        padding: 8px 0;
        color: #6f6f6f;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.2;
        letter-spacing: -0.02em;
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > .pl-marketing-header__mobile-group {
        display: block;
        margin: 12px 0 2px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #9a9a9a;
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li:first-child > .pl-marketing-header__mobile-group {
        margin-top: 4px;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > a {
        color: rgba(255, 255, 255, 0.62);
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > .pl-marketing-header__mobile-static {
        color: rgba(255, 255, 255, 0.62);
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links > li > .pl-marketing-header__mobile-group {
        color: rgba(255, 255, 255, 0.38);
    }

    .pl-marketing-header__mobile-section .pl-marketing-header__mobile-links[hidden] {
        display: none;
    }

    .pl-marketing-header__mobile-links {
        list-style: none;
        margin: 0;
        padding: 0 0 calc(16px + env(safe-area-inset-bottom, 0px));
    }

    .pl-marketing-header__mobile-links > li > a {
        position: relative;
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 8px 0;
        color: #0e0e0e;
        font-size: 16px;
        font-weight: 550;
        letter-spacing: -0.02em;
        text-decoration: none;
        line-height: 1.2;
        white-space: nowrap;
    }

    .pl-marketing-header__mobile-links > li > a::after {
        content: '';
        position: absolute;
        left: 0;
        width: 100%;
        bottom: 2px;
        height: 2px;
        background: currentColor;
        transform: scaleX(0);
        transform-origin: left;
        transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .pl-marketing-header__mobile-links > li > a.is-active::after {
        transform: scaleX(1);
    }

    .pl-marketing-header__mobile-links > li > a:active {
        opacity: 0.65;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-links > li > a {
        color: #fff;
    }

    .pl-marketing-header__mobile-divider {
        margin: 12px 0 4px;
        padding: 0;
        border-top: 1px solid rgba(0, 0, 0, 0.08);
        list-style: none;
    }

    .pl-marketing-header--dark .pl-marketing-header__mobile-divider {
        border-top-color: rgba(255, 255, 255, 0.1);
    }

    .pl-marketing-header__mobile-account {
        padding-top: 14px;
    }

    .pl-marketing-header__mobile-links > li:has(> a:only-child[hidden]) {
        display: none;
    }

    .pl-marketing-header__mobile-links > li > a.pl-marketing-header__mobile-cta {
        display: inline-flex;
        align-items: center;
        gap: 6px;
    }

    .pl-marketing-header__mobile-cta.pl-marketing-header__cta--activate .pl-link-out-icon {
        display: none;
    }

    .pl-marketing-header__nav {
        gap: 8px;
        flex-shrink: 0;
    }

    .pl-marketing-header__dashboard {
        font-size: 12px;
    }

    .pl-marketing-header__auth-links {
        display: none;
    }

    .pl-marketing-header__nav > .pl-marketing-header__dropdown--download {
        display: none;
    }

    body.pl-marketing--needs-plan .pl-marketing-header__auth-links {
        display: inline-flex;
    }

    body.pl-marketing--needs-plan .pl-marketing-header__nav .pl-marketing-header__cta--activate {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 10px 14px;
        font-size: 10px;
    }

    body.pl-marketing-menu-open {
        overflow: hidden;
    }

    body.pl-marketing--needs-plan {
        padding-bottom: 0;
    }

    .pl-marketing-header .pl-marketing-header__pick-plan,
    body > .pl-marketing-header__pick-plan.pl-marketing-header__pick-plan--bottom {
        display: none !important;
    }
}


/* ---- css/pl-sales-modal.css ---- */
/* Contact sales modal — VIP transactional theme */
.pl-sales-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

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

.pl-sales-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.pl-sales-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(480px, 100%);
    max-height: calc(100vh - 48px);
    overflow: auto;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 12px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.12);
}

.pl-sales-modal__close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid #e4e4e4;
    border-radius: 50%;
    background: #fff;
    color: #0e0e0e;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.pl-sales-modal__close svg {
    display: block;
}

.pl-sales-modal__close:hover {
    background: #f4f4f4;
    border-color: #d4d4d4;
}

.pl-sales-modal__panel {
    padding: 40px 36px 36px;
}

.pl-sales-modal__logo {
    display: block;
    height: 24px;
    width: auto;
    margin: 0 0 28px;
}

.pl-sales-modal__eyebrow {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6f6f6f;
}

.pl-sales-modal__title {
    margin: 0 0 8px;
    font-size: clamp(24px, 4vw, 28px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: #0e0e0e;
}

.pl-sales-modal__lead {
    margin: 0 0 28px;
    font-size: 15px;
    line-height: 1.55;
    color: #6f6f6f;
}

.pl-sales-modal__form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.pl-sales-modal__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pl-sales-modal__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6f6f6f;
}

.pl-sales-modal__label--required::after {
    content: " *";
    color: #c2410c;
    font-weight: 700;
}

.pl-sales-modal__input,
.pl-sales-modal__select {
    width: 100%;
    padding: 13px 14px;
    border: 1px solid #e4e4e4;
    border-radius: 8px;
    background: #fff;
    color: #0e0e0e;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.4;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    box-sizing: border-box;
}

.pl-sales-modal__input::placeholder {
    color: #949494;
}

.pl-sales-modal__input:focus,
.pl-sales-modal__select:focus {
    outline: none;
    border-color: #0e0e0e;
    box-shadow: 0 0 0 1px #0e0e0e;
}

.pl-sales-modal__select-wrap {
    position: relative;
}

.pl-sales-modal__select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 40px;
    cursor: pointer;
}

.pl-sales-modal__select-wrap::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 16px;
    width: 8px;
    height: 8px;
    border-right: 1.5px solid #6f6f6f;
    border-bottom: 1.5px solid #6f6f6f;
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}

.pl-sales-modal__select option {
    color: #0e0e0e;
}

.pl-sales-modal__submit {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin-top: 6px;
    padding: 14px 28px;
    border: 1px solid #0e0e0e;
    border-radius: 0;
    background: #0e0e0e;
    color: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-transform: none;
    cursor: pointer;
    overflow: hidden;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

.pl-sales-modal__submit::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: #1774ff;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.pl-sales-modal__submit:hover:not(:disabled) {
    background: #1a1a1a;
}

.pl-sales-modal__submit:hover:not(:disabled)::before {
    transform: scaleX(1);
}

.pl-sales-modal__submit:active:not(:disabled) {
    transform: scale(0.995);
}

.pl-sales-modal__submit:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.pl-sales-modal__powered {
    margin: 16px 0 0;
    text-align: center;
    font-size: 12px;
    font-style: italic;
    line-height: 1.35;
    letter-spacing: 0.01em;
    color: #949494;
}

.pl-sales-modal__powered-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    max-width: 100%;
    color: inherit;
    text-decoration: none;
    line-height: 1;
}

.pl-sales-modal__powered-link:hover {
    color: #0e0e0e;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pl-sales-modal__powered-icon {
    display: block;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    position: relative;
    top: -1px;
}

.pl-sales-modal__error {
    margin: 0;
    padding: 12px 14px;
    border-left: 3px solid #0e0e0e;
    background: #f5f5f5;
    font-size: 14px;
    line-height: 1.45;
    color: #0e0e0e;
}

.pl-sales-modal__error[hidden] {
    display: none;
}

.pl-sales-modal__success-copy {
    margin: 0 0 28px;
    font-size: 15px;
    line-height: 1.6;
    color: #6f6f6f;
}

.pl-sales-modal__botcheck {
    position: absolute;
    left: -9999px;
    opacity: 0;
    pointer-events: none;
}

body.pl-sales-modal-open {
    overflow: hidden;
}

.pl-sales-modal--wide .pl-sales-modal__dialog {
    width: min(720px, 100%);
}

.pl-sales-modal__form--two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 18px;
}

.pl-sales-modal__form--two-col .pl-sales-modal__botcheck,
.pl-sales-modal__form--two-col input[type="hidden"] {
    grid-column: 1 / -1;
}

.pl-sales-modal__form--two-col .pl-sales-modal__field--span {
    grid-column: 1 / -1;
}

@media (max-width: 640px) {
    .pl-sales-modal {
        padding: 0;
        align-items: stretch;
        justify-content: stretch;
    }

    .pl-sales-modal__backdrop {
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    .pl-sales-modal__dialog {
        width: 100%;
        max-width: none;
        height: 100%;
        min-height: 100dvh;
        max-height: none;
        border: none;
        border-radius: 0;
        box-shadow: none;
    }

    .pl-sales-modal__form--two-col {
        grid-template-columns: 1fr;
    }

    .pl-sales-modal__panel {
        padding:
            calc(env(safe-area-inset-top, 0px) + 28px)
            24px
            calc(env(safe-area-inset-bottom, 0px) + 28px);
    }

    .pl-sales-modal__close {
        top: calc(env(safe-area-inset-top, 0px) + 12px);
        right: 12px;
    }

    /* iOS Safari zooms focused inputs under 16px. */
    .pl-sales-modal__input,
    .pl-sales-modal__select {
        font-size: 16px;
    }
}


/* ---- css/pl-landing-time.css ---- */
/**
 * /time landing — layout, type, bento grid (no card animations).
 * Bento animations live in /css/pl-time-anims/*.css — load per page.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time {
    --pl-bg: #ffffff;
    --pl-surface: #f4f4f4;
    --pl-text: #0e0e0e;
    --pl-muted: #6f6f6f;
    --pl-muted-2: #949494;
    --pl-border: #e4e4e4;
    --pl-border-strong: #d4d4d4;
    --pl-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --pl-time-inset: var(--pl-marketing-bar-gutter, clamp(20px, 5vw, 48px));
    --pl-time-max: var(--pl-marketing-bar-max, 1120px);
    --pl-time-content-offset: calc(
        (100vw - min(100vw - (2 * var(--pl-time-inset)), var(--pl-time-max))) / 2
    );
    --pl-time-copy-col: calc(26rem + (2 * var(--pl-time-content-offset)));
    --pl-time-section-eyebrow: 11px;
    --pl-time-section-title: clamp(26px, 2.8vw, 34px);
    background: #fff;
    color: #0e0e0e;
    font-family: var(--pl-font);
}

/* Kill colored v4 slide chrome if anything leaks */
body.pl-landing-time .pl-landing-slide-num {
    display: none !important;
}

body.pl-landing-time .pl-landing-scroll {
    background: #fff;
}

/* Index video hero — lighter glass header over video */
body.pl-landing-time .pl-marketing-header {
    transition:
        background 0.45s ease,
        border-color 0.45s ease,
        backdrop-filter 0.45s ease;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark {
    background: rgba(6, 6, 6, 0.16);
    border-bottom-color: rgba(255, 255, 255, 0.04);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

body.pl-landing-time .pl-marketing-header:not(.pl-marketing-header--dark) {
    background: rgba(255, 255, 255, 0.52);
    border-bottom-color: rgba(228, 228, 228, 0.4);
}

/* Any menu open → solid white header bar (no glass) */
body.pl-landing-time .pl-marketing-header.is-nav-open,
body.pl-landing-time .pl-marketing-header.is-mobile-open,
body.pl-landing-time .pl-marketing-header:has(.pl-marketing-header__dropdown.is-open),
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open),
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open {
    background: #fff;
    border-bottom-color: rgba(228, 228, 228, 0.6);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__logo img,
body.pl-landing-time .pl-marketing-header.is-nav-open .pl-marketing-header__logo img,
body.pl-landing-time .pl-marketing-header.is-mobile-open .pl-marketing-header__logo img,
body.pl-landing-time .pl-marketing-header:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__logo img,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__logo img,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__logo img {
    filter: none;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__dropdown-trigger,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__links a,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__nav a,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-trigger,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__links a,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__nav a,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__menu-toggle {
    color: #0e0e0e;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__auth-sep,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__auth-sep {
    color: rgba(14, 14, 14, 0.28);
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-inner,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu {
    background: #fff;
    border-color: #e5e5e5;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.1);
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-main,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot {
    background: #fff;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-col-title,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot a,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a {
    color: #0e0e0e;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-foot,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside {
    border-color: #ececec;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside {
    background: #f5f5f5;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta {
    background: #ececec;
    border-top-color: #e4e4e4;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-aside-cta:hover,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a:hover,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark:has(.pl-marketing-header__dropdown.is-open) .pl-marketing-header__dropdown-menu a.is-active {
    background: #f5f5f5;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item:hover,
body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-marketing-header__mega-item.is-active {
    opacity: 0.62;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-path-mark__track {
    stroke: rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-path-mark__draw {
    stroke: #0e0e0e;
}

body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-nav-open .pl-path-mark__node {
    fill: rgba(0, 0, 0, 0.35);
}

@media (max-width: 768px) {
    body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__mobile {
        background: #fff;
        border-top-color: rgba(228, 228, 228, 0.9);
    }

    body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__mobile-section-trigger,
    body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__mobile-top-link,
    body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__mobile-links > li > a {
        color: #0e0e0e;
    }

    body.pl-landing-time .pl-marketing-header.pl-marketing-header--dark.is-mobile-open .pl-marketing-header__mobile-section {
        border-bottom-color: rgba(0, 0, 0, 0.08);
    }
}

/* ── Shared type / buttons ── */
body.pl-landing-time .pl-time-eyebrow {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-title {
    margin: 0 0 12px;
    font-size: clamp(36px, 4.2vw, 52px);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.12;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-lead {
    margin: 0;
    font-size: 17px;
    line-height: 1.5;
    color: var(--pl-muted);
    max-width: 38em;
}

body.pl-landing-time .pl-time-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 12px 20px;
    border-radius: 0;
    border: 1px solid #0e0e0e;
    background: #0e0e0e;
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-decoration: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
}

body.pl-landing-time .pl-time-btn::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--pl-cta-underline, var(--pl-blue));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

body.pl-landing-time .pl-time-btn:not(.pl-time-cta-btn):hover::before {
    transform: scaleX(1);
}

body.pl-landing-time .pl-time-btn:hover {
    background: #1a1a1a;
    border-color: #1a1a1a;
    color: #fff;
}

body.pl-landing-time .pl-time-btn:active {
    transform: scale(0.995);
}

body.pl-landing-time .pl-time-btn--ghost {
    background: #fff;
    color: #0e0e0e;
    border-color: var(--pl-border-strong);
}

body.pl-landing-time .pl-time-btn--ghost::before {
    display: none;
}

body.pl-landing-time .pl-time-btn--ghost:hover {
    background: #fafafa;
    border-color: #0e0e0e;
    color: #0e0e0e;
}

body.pl-landing-time .pl-time-btn--light {
    background: #fff;
    color: #0e0e0e;
    border-color: #fff;
}

body.pl-landing-time .pl-time-btn--light:hover {
    background: #f3f3f3;
    color: #0e0e0e;
}

/* ── Video hero (scroll fade to tagline) ── */
body.pl-landing-time .pl-time-hero-video {
    --pl-hero-progress: 0;
    background: #fff;
}

body.pl-landing-time .pl-time-hero-video__stage {
    height: 125vh;
    position: relative;
}

body.pl-landing-time .pl-time-hero-video__sticky {
    position: sticky;
    top: 0;
    height: 100vh;
    width: 100%;
    overflow: hidden;
    background: #fff;
}

body.pl-landing-time .pl-time-hero-video__frame {
    position: absolute;
    inset: 0;
    z-index: 1;
    will-change: opacity;
}

body.pl-landing-time .pl-time-hero-video__shade {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    pointer-events: none;
}

body.pl-landing-time .pl-time-hero-video__media {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pl-landing-time .pl-time-hero-video__copy {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: calc(var(--pl-marketing-header-h, 72px) + 24px) var(--pl-time-inset) 48px;
    box-sizing: border-box;
    text-align: center;
    pointer-events: none;
}

body.pl-landing-time .pl-time-hero-video__titles {
    display: grid;
    margin: 0 0 24px;
}

body.pl-landing-time .pl-time-hero-video__title {
    grid-area: 1 / 1;
    margin: 0;
    transition: opacity 0.3s ease;
}

body.pl-landing-time .pl-time-hero-video__copy .pl-time-hero-title.pl-time-hero-video__title--video {
    color: #fff;
    opacity: 1;
}

body.pl-landing-time .pl-time-hero-video__copy .pl-time-hero-title.pl-time-hero-video__title--faded {
    color: var(--pl-text);
    opacity: 0;
    pointer-events: none;
}

body.pl-landing-time .pl-time-hero-video.is-faded .pl-time-hero-video__copy .pl-time-hero-title.pl-time-hero-video__title--video {
    opacity: 0;
}

body.pl-landing-time .pl-time-hero-video.is-faded .pl-time-hero-video__copy .pl-time-hero-title.pl-time-hero-video__title--faded {
    opacity: 1;
}

body.pl-landing-time .pl-time-hero-video__copy .pl-time-hero-actions {
    pointer-events: auto;
}

body.pl-landing-time .pl-time-hero-video__copy .pl-time-btn--ghost.pl-time-btn--on-dark {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
    transition: background 0.2s ease, transform 0.15s ease;
}

body.pl-landing-time .pl-time-hero-video__copy .pl-time-btn--ghost.pl-time-btn--on-dark:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 255, 255, 0.85);
    color: #fff;
}

body.pl-landing-time .pl-time-hero-video.is-faded .pl-time-hero-video__copy .pl-time-btn--ghost.pl-time-btn--on-dark {
    background: transparent;
    color: var(--pl-text);
    border-color: var(--pl-text);
}

body.pl-landing-time .pl-time-hero-video.is-faded .pl-time-hero-video__copy .pl-time-btn--ghost.pl-time-btn--on-dark:hover {
    background: transparent;
    border-color: #0e0e0e;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-hero-video__after {
    position: relative;
    z-index: 3;
    background: #fff;
    margin-top: 0;
    padding: 0 var(--pl-time-inset) 0;
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-hero-video__after .pl-time-hero-dash {
    width: calc(100% + (2 * clamp(64px, 12vw, 180px)));
    max-width: min(calc(1520px + 240px), calc(100vw - 16px));
    margin-inline: calc(-1 * clamp(64px, 12vw, 180px));
    margin-left: auto;
    margin-right: auto;
    padding: clamp(16px, 3vh, 28px) clamp(56px, 10vw, 120px) 0;
    background: var(--pl-surface);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-hero-video__after .pl-landing-v4-trusted {
    max-width: 1000px;
    margin: 0 auto;
    padding: clamp(28px, 4vh, 44px) 0;
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-hero-video__stage {
        height: 100vh;
    }
}

/* ── Benefits accordion + sticky image ── */
body.pl-landing-time .pl-time-benefits {
    background: #fff;
    overflow: hidden;
    min-height: 100vh;
}

body.pl-landing-time .pl-time-benefits__grid {
    display: grid;
    grid-template-columns: var(--pl-time-copy-col) minmax(0, 1fr);
    align-items: stretch;
    min-height: 100vh;
    position: relative;
}

body.pl-landing-time .pl-time-benefits__copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    z-index: 1;
    min-height: 100vh;
    gap: clamp(18px, 2.5vh, 24px);
    padding:
        clamp(40px, 6vh, 72px)
        var(--pl-time-content-offset);
    box-sizing: border-box;
    background: #fff;
}

body.pl-landing-time .pl-time-benefits__head,
body.pl-landing-time .pl-time-benefits__accordion,
body.pl-landing-time .pl-time-benefits__stores {
    width: min(100%, 26rem);
    max-width: 26rem;
    align-self: flex-start;
    text-align: left;
}

body.pl-landing-time .pl-time-benefits__head .pl-time-eyebrow {
    margin: 0 0 8px;
    font-size: var(--pl-time-section-eyebrow);
    letter-spacing: 0.1em;
}

body.pl-landing-time .pl-time-benefits__head .pl-time-title {
    margin: 0;
    font-size: var(--pl-time-section-title);
    line-height: 1.12;
}

body.pl-landing-time .pl-time-benefits__title {
    display: block;
    width: 100%;
}

body.pl-landing-time .pl-time-benefits__title .pl-time-typewriter-line {
    display: block;
}

body.pl-landing-time .pl-time-benefits__title .pl-time-typewriter-cursor {
    display: inline-block;
    width: 1.5px;
    height: 0.9em;
    margin-left: 2px;
    background: currentColor;
    vertical-align: -0.08em;
    opacity: 0.7;
    animation: pl-time-typewriter-cursor 0.9s step-end infinite;
}

body.pl-landing-time .pl-time-benefits__title.is-done .pl-time-typewriter-cursor {
    display: none;
}

@keyframes pl-time-typewriter-cursor {
    50% {
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-benefits__title .pl-time-typewriter-cursor {
        display: none;
        animation: none;
    }
}

body.pl-landing-time .pl-time-benefits__head .pl-time-lead {
    margin: 0;
}

body.pl-landing-time .pl-time-benefits__stores {
    margin-top: 0;
}

body.pl-landing-time .pl-time-benefits__item {
    border-bottom: 1px solid var(--pl-border);
}

body.pl-landing-time .pl-time-benefits__item:last-child {
    border-bottom: none;
}

body.pl-landing-time .pl-time-benefits__trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    padding: clamp(12px, 1.6vh, 15px) 0;
    border: none;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-benefits__trigger-label {
    font-size: clamp(14px, 1.5vw, 16px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.25;
}

body.pl-landing-time .pl-time-benefits__icon {
    position: relative;
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-benefits__icon::before,
body.pl-landing-time .pl-time-benefits__icon::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    background: currentColor;
    transform: translate(-50%, -50%);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

body.pl-landing-time .pl-time-benefits__icon::before {
    width: 12px;
    height: 1.5px;
}

body.pl-landing-time .pl-time-benefits__icon::after {
    width: 1.5px;
    height: 12px;
}

body.pl-landing-time .pl-time-benefits__item.is-open .pl-time-benefits__icon::after {
    opacity: 0;
    transform: translate(-50%, -50%) scaleY(0);
}

body.pl-landing-time .pl-time-benefits__panel {
    padding: 0 0 clamp(12px, 1.6vh, 15px);
}

body.pl-landing-time .pl-time-benefits__text {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-benefits__action {
    display: inline-block;
    margin-top: 8px;
    font-size: 13px;
    font-weight: 500;
    color: var(--pl-text);
    text-decoration: none;
}

body.pl-landing-time .pl-time-benefits__stores.pl-landing-v4-footer-stores {
    gap: 8px;
    margin-top: 0;
}

body.pl-landing-time .pl-time-benefits__stores .pl-landing-v4-footer-appstore-img {
    height: 40px;
}

body.pl-landing-time .pl-time-benefits__stores .pl-landing-v4-footer-appstore-img--light {
    display: none;
}

body.pl-landing-time .pl-time-benefits__stores .pl-landing-v4-footer-appstore-img--dark {
    display: block;
}

body.pl-landing-time .pl-time-benefits__action:hover {
    text-decoration: underline;
}

body.pl-landing-time .pl-time-benefits__visual {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    margin: 0;
    background: transparent;
    overflow: hidden;
    z-index: 0;
}

body.pl-landing-time .pl-time-benefits__visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center right;
}

@media (max-width: 900px) {
    body.pl-landing-time .pl-time-benefits {
        min-height: 0;
        overflow-x: clip;
    }

    body.pl-landing-time .pl-time-benefits__grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    body.pl-landing-time .pl-time-benefits__copy {
        min-height: 0;
        align-items: flex-start;
        padding:
            clamp(32px, 5vh, 48px)
            var(--pl-time-inset)
            clamp(40px, 6vh, 56px);
    }

    body.pl-landing-time .pl-time-benefits__visual {
        order: -1;
        min-height: 0;
        height: clamp(360px, 62vh, 560px);
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    body.pl-landing-time .pl-time-benefits__visual img {
        object-position: top center;
    }

    body.pl-landing-time .pl-time-benefits__head,
    body.pl-landing-time .pl-time-benefits__accordion,
    body.pl-landing-time .pl-time-benefits__stores {
        width: 100%;
        max-width: none;
    }

    body.pl-landing-time .pl-time-benefits__head .pl-time-title {
        font-size: clamp(24px, 6.5vw, 30px);
    }
}

/* ── Hero (legacy / shared type) ── */
body.pl-landing-time .pl-time-hero {
    padding: calc(var(--pl-marketing-header-h, 72px) + 48px) 0 0;
    background: #fff;
    overflow-x: clip;
}

body.pl-landing-time .pl-time-hero-inner {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(24px, 4vh, 40px);
    padding: 0 var(--pl-time-inset) 28px;
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-hero-copy {
    text-align: center;
    width: 100%;
    max-width: 820px;
    margin: 0 auto;
}

body.pl-landing-time .pl-time-trustpilot {
    display: block;
    width: fit-content;
    margin: 0 auto 16px;
    line-height: 0;
}

body.pl-landing-time .pl-time-trustpilot img {
    display: block;
    height: clamp(32px, 4vw, 44px);
    width: auto;
}

body.pl-landing-time .pl-time-hero-title {
    margin: 0 auto 14px;
    font-size: clamp(48px, 8vw, 80px);
    font-weight: 400;
    letter-spacing: -0.035em;
    line-height: 1.02;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-hero-lead {
    margin: 0 auto 24px;
    font-size: 18px;
    line-height: 1.5;
    color: var(--pl-muted);
    max-width: 42ch;
}

body.pl-landing-time .pl-time-hero-lead--lg {
    font-size: clamp(18px, 2.2vw, 20px);
    line-height: 1.5;
    max-width: 48ch;
}

body.pl-landing-time .pl-time-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 10px;
}

body.pl-landing-time .pl-time-hero-dash {
    --pl-hero-dash-pad-x: clamp(56px, 10vw, 120px);
    --pl-hero-dash-pad-top: clamp(28px, 5vh, 56px);
    --pl-hero-dash-breakout: clamp(64px, 12vw, 180px);
    width: calc(100% + (2 * var(--pl-hero-dash-breakout)));
    max-width: min(calc(1520px + (2 * var(--pl-hero-dash-pad-x))), calc(100vw - 16px));
    margin-inline: calc(-1 * var(--pl-hero-dash-breakout));
    padding: var(--pl-hero-dash-pad-top) var(--pl-hero-dash-pad-x) 0;
    background: var(--pl-surface);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-hero-dash img {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
    border-radius: 0;
}

body.pl-landing-time .pl-time-hero .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: clamp(28px, 4vh, 44px) 0 clamp(28px, 4vh, 44px);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-hero .pl-landing-v4-trusted-rule {
    margin-top: clamp(20px, 3vh, 28px);
}

/* ── Compare band ── */
body.pl-landing-time .pl-time-compare {
    padding: clamp(28px, 4vh, 48px) var(--pl-time-inset) clamp(72px, 10vh, 112px);
    background: #fff;
}

body.pl-landing-time .pl-time-compare-inner {
    max-width: 980px;
    margin: 0 auto;
}

body.pl-landing-time .pl-time-compare-head {
    max-width: 34em;
    margin: 0 0 40px;
    text-align: left;
}

body.pl-landing-time .pl-time-compare-head .pl-time-title {
    margin-left: 0;
    margin-right: 0;
}

body.pl-landing-time .pl-time-compare-head .pl-time-lead {
    margin: 0;
}

body.pl-landing-time .pl-time-compare-sub {
    font-size: clamp(16px, 2vw, 18px);
}

body.pl-landing-time .pl-time-compare-steps {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(20px, 3vw, 40px);
    padding-top: 0;
}

body.pl-landing-time .pl-time-compare-pathline {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 110px;
    z-index: 0;
    overflow: visible;
    pointer-events: none;
}

body.pl-landing-time .pl-time-compare-pathline-track {
    fill: none;
    stroke: #e6e6e6;
    stroke-width: 10;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}

body.pl-landing-time .pl-time-compare-pathline-draw {
    fill: none;
    stroke: #0e0e0e;
    stroke-width: 10;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
    transition: none;
    vector-effect: non-scaling-stroke;
}

body.pl-landing-time .pl-time-compare-col {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding-top: 118px;
}

body.pl-landing-time .pl-time-compare-dot {
    position: absolute;
    top: 46px;
    left: 0;
    width: 18px;
    height: 18px;
    margin-left: 0;
    border-radius: 50%;
    background: #fff;
    border: 2.5px solid #d4d4d4;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
    z-index: 2;
    transition:
        background 0.08s ease,
        border-color 0.08s ease,
        transform 0.12s ease,
        box-shadow 0.12s ease;
    /* top is set by JS to sit on the sine wave */
}

body.pl-landing-time .pl-time-compare-dot.is-active {
    background: #0e0e0e;
    border-color: #0e0e0e;
    transform: scale(1.12);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.16);
}

body.pl-landing-time .pl-time-compare-chip {
    margin: 0 0 10px;
    padding: 5px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #666;
}

body.pl-landing-time .pl-time-compare-col h3 {
    margin: 0 0 8px;
    font-size: 16px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-compare-col > p:not(.pl-time-compare-chip) {
    margin: 0;
    max-width: none;
    font-size: 14px;
    line-height: 1.55;
    color: var(--pl-muted);
}

@media (max-width: 760px) {
    body.pl-landing-time .pl-time-compare-steps {
        grid-template-columns: 1fr;
        gap: 14px;
        padding-left: 36px;
    }

    body.pl-landing-time .pl-time-compare-pathline {
        display: block;
        left: 0;
        top: 0;
        width: 40px;
        height: 100%;
    }

    body.pl-landing-time .pl-time-compare-pathline-track,
    body.pl-landing-time .pl-time-compare-pathline-draw {
        stroke-width: 8;
    }

    body.pl-landing-time .pl-time-compare-col {
        align-items: flex-start;
        text-align: left;
        padding: 20px 18px;
        border-radius: 14px;
        border: 1px solid rgba(0, 0, 0, 0.06);
        background: #f7f7f7;
    }

    body.pl-landing-time .pl-time-compare-dot {
        display: block;
        position: absolute;
        left: 0;
        top: 50%;
        z-index: 3;
    }

    body.pl-landing-time .pl-time-compare-chip {
        box-shadow: none;
        background: #fff;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-compare-dot {
        transition: none;
    }

    body.pl-landing-time .pl-time-compare-pathline-draw {
        stroke-dashoffset: 0;
    }
}

/* ── Feature rows (index — no bento) ── */
body.pl-landing-time .pl-time-features {
    padding: clamp(56px, 8vh, 96px) var(--pl-time-inset) clamp(64px, 10vh, 104px);
    background: #fff;
    border-top: 1px solid var(--pl-border);
}

body.pl-landing-time .pl-time-features-inner {
    max-width: var(--pl-time-max);
    margin: 0 auto;
}

body.pl-landing-time .pl-time-features-head {
    max-width: 36em;
    margin: 0 auto clamp(48px, 7vh, 80px);
    text-align: center;
}

body.pl-landing-time .pl-time-features-head .pl-time-lead {
    margin: 0 auto;
}

body.pl-landing-time .pl-time-feature {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(32px, 5vw, 72px);
    align-items: center;
    padding: clamp(48px, 7vh, 72px) 0;
    border-top: 1px solid var(--pl-border);
}

body.pl-landing-time .pl-time-feature__copy .pl-time-eyebrow {
    margin-bottom: 12px;
}

body.pl-landing-time .pl-time-feature__copy h3 {
    margin: 0 0 14px;
    font-size: clamp(26px, 3.2vw, 36px);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.12;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-feature__copy > p {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--pl-muted);
    max-width: 40ch;
}

body.pl-landing-time .pl-time-feature-aside {
    list-style: none;
    margin: 22px 0 0;
    padding: 20px 0 0;
    border-top: 1px solid var(--pl-border);
    max-width: 36ch;
}

body.pl-landing-time .pl-time-feature-aside li {
    position: relative;
    margin: 0 0 12px;
    padding-left: 26px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-feature-aside li:last-child {
    margin-bottom: 0;
}

body.pl-landing-time .pl-time-feature-aside li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.12em;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: var(--pl-text);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M2.5 6l2.5 2.5 4.5-5' stroke='%23fff' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
}

body.pl-landing-time .pl-time-feature-aside strong {
    font-weight: 550;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-feature__visual {
    margin: 0;
    padding: 20px;
    background: var(--pl-surface);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-feature__visual img {
    display: block;
    width: 100%;
    height: auto;
}

body.pl-landing-time .pl-time-feature__visual--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(220px, 30vw, 340px);
}

body.pl-landing-time .pl-time-feature__placeholder-label {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

body.pl-landing-time .pl-time-feature-stores {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
}

body.pl-landing-time .pl-time-feature-store {
    display: block;
    line-height: 0;
    text-decoration: none;
}

body.pl-landing-time .pl-time-feature-store:hover {
    opacity: 0.85;
}

body.pl-landing-time .pl-time-feature-store-img {
    display: block;
    height: 30px;
    width: auto;
}

body.pl-landing-time .pl-time-feature-store-img--light {
    display: none;
}

body.pl-landing-time .pl-time-feature-store-img--dark {
    display: block;
}

body.pl-landing-time .pl-time-feature--reverse .pl-time-feature__copy {
    order: 2;
}

body.pl-landing-time .pl-time-feature--reverse .pl-time-feature__visual {
    order: 1;
}

@media (max-width: 820px) {
    body.pl-landing-time .pl-time-feature,
    body.pl-landing-time .pl-time-feature--reverse {
        grid-template-columns: 1fr;
        gap: 28px;
        padding: 40px 0;
    }

    body.pl-landing-time .pl-time-feature--reverse .pl-time-feature__copy,
    body.pl-landing-time .pl-time-feature--reverse .pl-time-feature__visual {
        order: unset;
    }

    body.pl-landing-time .pl-time-feature__copy > p {
        max-width: none;
    }

    body.pl-landing-time .pl-time-feature-aside {
        max-width: none;
    }
}

/* ── Dark band: industries ── */
body.pl-landing-time .pl-time-dark-band {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: #000;
    color: #fff;
    box-sizing: border-box;
    overflow-x: clip;
}

/* ── Industry card switcher ── */
body.pl-landing-time .pl-time-industries {
    position: relative;
    padding: clamp(72px, 10vh, 104px) 0 clamp(56px, 8vh, 80px);
    box-sizing: border-box;
    overflow: hidden;
}

body.pl-landing-time .pl-time-industries-inner {
    display: flex;
    justify-content: flex-start;
    width: var(--pl-time-copy-col);
    max-width: var(--pl-time-copy-col);
    margin: 0;
    padding: 0 var(--pl-time-content-offset);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-industries-head {
    width: min(100%, 26rem);
    max-width: 26rem;
    margin: 0 0 clamp(32px, 5vh, 48px);
    text-align: left;
}

body.pl-landing-time .pl-time-industries-eyebrow {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
}

body.pl-landing-time .pl-time-industries-title {
    margin: 0;
    max-width: none;
    font-size: var(--pl-time-section-title);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.08;
    color: #fff;
    white-space: nowrap;
}

body.pl-landing-time .pl-time-industry-cards {
    --pl-time-industry-gap: clamp(14px, 1.6vw, 22px);
    display: flex;
    gap: var(--pl-time-industry-gap);
    width: 100vw;
    height: clamp(480px, 68vh, 680px);
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: var(--pl-time-industry-gap);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-industry-card {
    position: relative;
    flex: 1;
    min-width: 64px;
    overflow: hidden;
    cursor: default;
    border: none;
    border-radius: 0;
    transition: flex 0.75s cubic-bezier(0.25, 0.1, 0.25, 1);
}

body.pl-landing-time .pl-time-industry-cards .pl-time-industry-card:first-child {
    flex: 4.2;
}

@media (min-width: 821px) {
    body.pl-landing-time .pl-time-industry-cards:hover .pl-time-industry-card {
        flex: 0.75;
    }

    body.pl-landing-time .pl-time-industry-cards:hover .pl-time-industry-card:hover {
        flex: 4.2;
    }

    body.pl-landing-time .pl-time-industry-card:hover .pl-time-industry-card__overlay,
    body.pl-landing-time .pl-time-industry-cards:not(:hover) .pl-time-industry-card:first-child .pl-time-industry-card__overlay {
        background: linear-gradient(
            to top,
            rgba(0, 0, 0, 0.88) 0%,
            rgba(0, 0, 0, 0.15) 55%,
            rgba(0, 0, 0, 0.35) 100%
        );
    }

    body.pl-landing-time .pl-time-industry-card:hover .pl-time-industry-card__label,
    body.pl-landing-time .pl-time-industry-cards:not(:hover) .pl-time-industry-card:first-child .pl-time-industry-card__label {
        margin: 0;
        writing-mode: horizontal-tb;
        transform: none;
        align-self: flex-start;
        font-size: clamp(18px, 2vw, 24px);
        opacity: 1;
    }
}

body.pl-landing-time .pl-time-industry-card__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: none;
}

body.pl-landing-time .pl-time-industry-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.82) 0%,
        rgba(0, 0, 0, 0.25) 45%,
        rgba(0, 0, 0, 0.4) 100%
    );
    transition: opacity 0.4s ease;
}

body.pl-landing-time .pl-time-industry-card__content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    height: 100%;
    padding: clamp(20px, 3vw, 28px);
    box-sizing: border-box;
    color: #fff;
    pointer-events: none;
}

body.pl-landing-time .pl-time-industry-card__label {
    margin: 0;
    align-self: flex-start;
    font-size: clamp(14px, 1.4vw, 17px);
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    writing-mode: horizontal-tb;
    transform: none;
    white-space: nowrap;
    opacity: 0.88;
    transition: opacity 0.4s ease, font-size 0.5s cubic-bezier(0.25, 0.1, 0.25, 1);
}

body.pl-landing-time .pl-time-industry-card__detail {
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    overflow: hidden;
    margin: 0;
    transform: translateY(16px);
    transition:
        opacity 0.35s ease,
        transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
        max-height 0.45s cubic-bezier(0.4, 0, 0.2, 1),
        visibility 0.35s ease;
}

body.pl-landing-time .pl-time-industry-card__stat {
    margin: 0 0 10px;
    font-size: clamp(22px, 2.8vw, 32px);
    font-weight: 400;
    letter-spacing: -0.025em;
    line-height: 1.15;
    color: #fff;
}

body.pl-landing-time .pl-time-industry-card__copy {
    margin: 0;
    max-width: 36ch;
    font-size: 14px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.72);
}

@media (max-width: 820px) {
    body.pl-landing-time .pl-time-industries {
        padding: clamp(48px, 8vh, 72px) 0 clamp(40px, 6vh, 56px);
    }

    body.pl-landing-time .pl-time-industries-inner {
        width: 100%;
        max-width: none;
        padding: 0 var(--pl-time-inset);
    }

    body.pl-landing-time .pl-time-industries-head {
        width: 100%;
        max-width: none;
        margin: 0 0 clamp(24px, 4vh, 36px);
    }

    body.pl-landing-time .pl-time-industries-title {
        white-space: normal;
        font-size: clamp(24px, 7vw, 32px);
        line-height: 1.12;
    }

    body.pl-landing-time .pl-time-industry-cards {
        --pl-time-industry-gap: clamp(10px, 2.5vw, 14px);
        flex-direction: column;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
        height: auto;
        gap: var(--pl-time-industry-gap);
        padding-inline: var(--pl-time-inset);
    }

    body.pl-landing-time .pl-time-industry-card,
    body.pl-landing-time .pl-time-industry-cards:hover .pl-time-industry-card,
    body.pl-landing-time .pl-time-industry-cards .pl-time-industry-card:hover,
    body.pl-landing-time .pl-time-industry-cards .pl-time-industry-card.is-active {
        flex: none;
        min-height: 88px;
    }

    body.pl-landing-time .pl-time-industry-cards .pl-time-industry-card.is-active {
        min-height: clamp(360px, 58vh, 520px);
    }

    body.pl-landing-time .pl-time-industry-card.is-active .pl-time-industry-card__overlay {
        background: linear-gradient(
            to top,
            rgba(0, 0, 0, 0.88) 0%,
            rgba(0, 0, 0, 0.15) 55%,
            rgba(0, 0, 0, 0.35) 100%
        );
    }

    body.pl-landing-time .pl-time-industry-card.is-active .pl-time-industry-card__label {
        font-size: clamp(16px, 4.5vw, 20px);
        opacity: 1;
    }

    body.pl-landing-time .pl-time-industry-card__label {
        writing-mode: horizontal-tb;
        transform: none;
        margin: 0;
        font-size: 12px;
        opacity: 0.88;
        white-space: normal;
    }

    body.pl-landing-time .pl-time-industry-card {
        cursor: pointer;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-industry-card,
    body.pl-landing-time .pl-time-industry-card__bg,
    body.pl-landing-time .pl-time-industry-card__label,
    body.pl-landing-time .pl-time-industry-card__detail {
        transition: none;
    }
}

/* ── Testimonials ── */
body.pl-landing-time .pl-time-testimonials {
    position: relative;
    padding: 0 var(--pl-time-inset) clamp(80px, 12vh, 120px);
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-testimonials-glow {
    display: none;
}

body.pl-landing-time .pl-time-testimonials-inner {
    position: relative;
    z-index: 1;
    max-width: min(1040px, 100%);
    margin: 0 auto;
}

body.pl-landing-time .pl-time-testimonials-head {
    max-width: none;
    margin: 0 0 clamp(48px, 7vh, 72px);
    text-align: center;
}

body.pl-landing-time .pl-time-testimonials-eyebrow {
    margin: 0 0 16px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
}

body.pl-landing-time .pl-time-testimonials-title {
    margin: 0;
    font-size: clamp(36px, 5.5vw, 56px);
    font-weight: 400;
    letter-spacing: -0.04em;
    line-height: 1.02;
    color: #fff;
}

body.pl-landing-time .pl-time-testimonials-badges {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px 32px;
    margin-top: clamp(24px, 3.5vh, 36px);
}

body.pl-landing-time .pl-time-testimonials-badges img {
    display: block;
    width: auto;
    height: clamp(24px, 3vw, 30px);
    opacity: 0.88;
}

body.pl-landing-time .pl-time-testimonial {
    position: relative;
    margin: 0;
    padding: 0;
    border: none;
}

body.pl-landing-time .pl-time-testimonial--featured {
    margin-bottom: clamp(20px, 3vh, 28px);
    padding: clamp(36px, 5vw, 56px) clamp(32px, 5vw, 64px);
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.1);
    text-align: center;
}

body.pl-landing-time .pl-time-testimonial-mark {
    position: absolute;
    top: clamp(12px, 2vh, 20px);
    left: clamp(20px, 4vw, 40px);
    font-size: clamp(80px, 12vw, 140px);
    line-height: 1;
    font-family: Georgia, "Times New Roman", serif;
    color: rgba(255, 255, 255, 0.06);
    pointer-events: none;
    user-select: none;
}

body.pl-landing-time .pl-time-testimonial-stars {
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-bottom: clamp(16px, 2.5vh, 24px);
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial .pl-time-testimonial-stars {
    justify-content: flex-start;
    margin-bottom: 16px;
}

body.pl-landing-time .pl-time-testimonial-stars span {
    width: 14px;
    height: 14px;
    background: #fff;
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    opacity: 0.9;
}

body.pl-landing-time .pl-time-testimonial--featured p {
    position: relative;
    z-index: 1;
    margin: 0 auto clamp(28px, 4vh, 40px);
    max-width: 22em;
    font-size: clamp(22px, 3.2vw, 34px);
    font-weight: 400;
    letter-spacing: -0.025em;
    line-height: 1.35;
    color: #fff;
}

body.pl-landing-time .pl-time-testimonials-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial {
    --mx: 50%;
    --my: 50%;
    --pl-grow-flash: #2563eb;
    --pl-grow-ink: #bdd7ff;
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: clamp(28px, 4vw, 36px);
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.08);
    overflow: hidden;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial--blue {
    --pl-grow-flash: #2563eb;
    --pl-grow-ink: #bdd7ff;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial--pink {
    --pl-grow-flash: #ec4899;
    --pl-grow-ink: #ffd4e6;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial--mint {
    --pl-grow-flash: #0d9488;
    --pl-grow-ink: #c5efd9;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial--violet {
    --pl-grow-flash: #7c3aed;
    --pl-grow-ink: #d9d0ff;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--pl-grow-flash);
    clip-path: circle(0% at var(--mx) var(--my));
    transition:
        clip-path 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1) 0.12s;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot::before {
    clip-path: circle(160% at var(--mx) var(--my));
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink::before {
    background-color: var(--pl-grow-ink);
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-leaving::before {
    clip-path: circle(0% at var(--mx) var(--my));
    background-color: var(--pl-grow-flash);
    transition:
        clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.2s ease;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial > * {
    position: relative;
    z-index: 1;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot:not(.is-ink) p,
body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot:not(.is-ink) .pl-time-testimonial-meta cite,
body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot:not(.is-ink) .pl-time-testimonial-who span {
    color: #fff;
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot:not(.is-ink) .pl-time-testimonial-stars span {
    background: #fff;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink {
    border-color: rgba(14, 14, 14, 0.1);
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink p,
body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink .pl-time-testimonial-meta cite {
    color: #0e0e0e;
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink .pl-time-testimonial-who span {
    color: rgba(14, 14, 14, 0.55);
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink .pl-time-testimonial-stars span {
    background: #0e0e0e;
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-ink .pl-time-testimonial-avatar {
    box-shadow: 0 0 0 2px rgba(14, 14, 14, 0.12);
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial::before {
        transition: none;
    }

    body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial.is-hot::before {
        clip-path: none;
        background: var(--pl-grow-ink);
    }
}

body.pl-landing-time .pl-time-testimonials-row .pl-time-testimonial p {
    flex: 1 1 auto;
    margin: 0 0 24px;
    font-size: clamp(15px, 1.6vw, 17px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.82);
}

body.pl-landing-time .pl-time-testimonial--featured .pl-time-testimonial-meta {
    justify-content: center;
}

body.pl-landing-time .pl-time-testimonial-meta {
    display: flex;
    align-items: center;
    gap: 14px;
}

body.pl-landing-time .pl-time-testimonial-avatar {
    flex: 0 0 auto;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.15);
}

body.pl-landing-time .pl-time-testimonial--featured .pl-time-testimonial-avatar {
    width: 72px;
    height: 72px;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.2);
}

body.pl-landing-time .pl-time-testimonial-who {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-width: 0;
    text-align: left;
}

body.pl-landing-time .pl-time-testimonial--featured .pl-time-testimonial-who {
    align-items: center;
    text-align: center;
}

body.pl-landing-time .pl-time-testimonial-meta cite {
    font-style: normal;
    font-size: 15px;
    font-weight: 500;
    color: #fff;
}

body.pl-landing-time .pl-time-testimonial--featured .pl-time-testimonial-meta cite {
    font-size: 16px;
}

body.pl-landing-time .pl-time-testimonial-who span {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.5);
}

@media (max-width: 900px) {
    body.pl-landing-time .pl-time-testimonials-row {
        grid-template-columns: 1fr;
    }

    body.pl-landing-time .pl-time-testimonial--featured p {
        max-width: none;
    }

    body.pl-landing-time .pl-time-testimonial-mark {
        left: 16px;
        font-size: 72px;
    }
}

/* ── Pricing snapshot ── */
body.pl-landing-time .pl-time-pricing {
    padding: clamp(72px, 10vh, 104px) var(--pl-time-inset) clamp(64px, 8vh, 88px);
    background: #fff;
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-pricing__inner {
    max-width: var(--pl-time-max);
    margin: 0 auto;
}

body.pl-landing-time .pl-time-pricing__head {
    max-width: 28rem;
    margin: 0 auto clamp(40px, 6vh, 56px);
    text-align: center;
}

body.pl-landing-time .pl-time-pricing__title {
    margin-bottom: 0;
    line-height: 1.1;
}

body.pl-landing-time .pl-time-pricing__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

body.pl-landing-time .pl-time-pricing__grid--tiers {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.pl-landing-time .pl-time-pricing__card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(36px, 4vw, 44px) clamp(18px, 2.5vw, 24px) clamp(22px, 3vw, 28px);
    border: 1px solid var(--pl-border);
    background: #fff;
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-pricing__card--featured {
    border: 2px solid var(--pl-text);
}

body.pl-landing-time .pl-time-pricing__badge {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 4px 8px;
    background: #ffe566;
    color: var(--pl-text);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1.25;
}

body.pl-landing-time .pl-time-pricing__badge--muted {
    background: var(--pl-surface);
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-pricing__name {
    margin: 0;
    font-size: clamp(16px, 1.6vw, 18px);
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.2;
}

body.pl-landing-time .pl-time-pricing__tag {
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-pricing__price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px;
    margin: auto 0 0;
    padding-top: clamp(18px, 2.5vh, 24px);
}

body.pl-landing-time .pl-time-pricing__was {
    margin-right: 2px;
    color: #c43a3a;
    font-size: clamp(18px, 2vw, 22px);
    font-weight: 600;
    letter-spacing: -0.03em;
    text-decoration: line-through;
}

body.pl-landing-time .pl-time-pricing__amt {
    font-size: clamp(26px, 2.8vw, 32px);
    font-weight: 600;
    letter-spacing: -0.04em;
    line-height: 1;
}

body.pl-landing-time .pl-time-pricing__per {
    font-size: 13px;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-pricing__note {
    margin: 6px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-pricing__link {
    display: inline-block;
    margin-top: clamp(14px, 2vh, 18px);
    font-size: 13px;
    font-weight: 600;
    color: var(--pl-text);
    text-decoration: none;
    transition: color 0.15s ease;
}

body.pl-landing-time .pl-time-pricing__link:hover {
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-pricing__cta {
    align-self: flex-start;
    margin-top: clamp(14px, 2vh, 18px);
    width: 100%;
    justify-content: center;
    text-align: center;
}

body.pl-landing-time .pl-time-pricing__footer {
    margin: clamp(28px, 4vh, 36px) 0 0;
    text-align: center;
}

body.pl-landing-time .pl-time-pricing__footer-link {
    display: inline;
    margin: 0;
    padding: 0;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    color: var(--pl-text);
    text-decoration: none;
    border: 0;
    border-bottom: 1px solid var(--pl-border-strong);
    background: transparent;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

body.pl-landing-time .pl-time-pricing__footer-link:hover {
    color: var(--pl-muted);
    border-bottom-color: var(--pl-muted-2);
}

/* Pricing on dark band */
body.pl-landing-time .pl-time-pricing--dark {
    background: transparent;
    color: #fff;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-eyebrow {
    color: rgba(255, 255, 255, 0.45);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__title {
    color: #fff;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__card {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.08);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__card--featured {
    border-color: rgba(255, 255, 255, 0.28);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__name,
body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__amt {
    color: #fff;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__tag,
body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__per,
body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__note {
    color: rgba(255, 255, 255, 0.55);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__was {
    color: #ff8a8a;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__link {
    color: #fff;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__link:hover {
    color: rgba(255, 255, 255, 0.72);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__cta {
    background: #fff;
    color: var(--pl-text);
    border-color: #fff;
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__cta:hover {
    background: #e6e6e6;
    border-color: #e6e6e6;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__footer-link {
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.35);
}

body.pl-landing-time .pl-time-pricing--dark .pl-time-pricing__footer-link:hover {
    color: rgba(255, 255, 255, 0.72);
    border-bottom-color: rgba(255, 255, 255, 0.55);
}

@media (max-width: 960px) {
    body.pl-landing-time .pl-time-pricing__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    body.pl-landing-time .pl-time-pricing__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body.pl-landing-time .pl-time-pricing__head {
        text-align: left;
        margin-inline: 0;
    }
}

body.pl-landing-time .pl-time-pricing:has(+ .pl-time-founder) {
    padding-bottom: 0;
}

/* ── Founder note ── */
body.pl-landing-time .pl-time-founder {
    padding: clamp(48px, 6vh, 64px) var(--pl-time-inset);
    background: #fff;
}

body.pl-landing-time .pl-time-founder-inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: clamp(24px, 4vw, 40px);
    max-width: 720px;
    margin: 0 auto;
}

body.pl-landing-time .pl-time-founder-photo {
    margin: 0;
    width: 88px;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 50%;
    background: var(--pl-surface);
    flex-shrink: 0;
}

body.pl-landing-time .pl-time-founder-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pl-landing-time .pl-time-founder-copy .pl-time-eyebrow {
    margin-bottom: 14px;
}

body.pl-landing-time .pl-time-founder-quote {
    margin: 0 0 20px;
    padding: 0;
    border: none;
}

body.pl-landing-time .pl-time-founder-quote p {
    margin: 0 0 14px;
    font-size: clamp(17px, 2.2vw, 20px);
    line-height: 1.6;
    letter-spacing: -0.01em;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-founder-quote p:last-child {
    margin-bottom: 0;
}

body.pl-landing-time .pl-time-founder-quote strong {
    font-weight: 600;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-stealth-link {
    color: inherit;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.15s ease;
}

body.pl-landing-time .pl-time-stealth-link:hover {
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-founder-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 20px;
}

body.pl-landing-time .pl-time-founder-signature {
    font-family: "Caveat", "Segoe Script", "Brush Script MT", cursive;
    font-size: clamp(34px, 4.8vw, 44px);
    font-weight: 600;
    font-style: normal;
    line-height: 1;
    letter-spacing: 0.01em;
    color: var(--pl-text);
    transform: rotate(-2deg);
    transform-origin: left center;
    display: block;
    margin: 0 0 6px;
}

body.pl-landing-time .pl-time-founder-meta span {
    font-size: 13px;
    color: var(--pl-muted);
}

@media (max-width: 640px) {
    body.pl-landing-time .pl-time-founder-inner {
        grid-template-columns: auto minmax(0, 1fr);
        justify-items: start;
        text-align: left;
    }

    body.pl-landing-time .pl-time-founder-copy {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    body.pl-landing-time .pl-time-founder-signature {
        transform-origin: left center;
    }
}

/* ── Bento ── */
body.pl-landing-time .pl-time-bento-section {
    padding: 24px var(--pl-time-inset) 80px;
    background: #fff;
}

body.pl-landing-time .pl-time-bento-inner {
    max-width: var(--pl-time-max);
    margin: 0 auto;
}

body.pl-landing-time .pl-time-bento-head {
    max-width: 34em;
    margin: 0 auto 36px;
    text-align: center;
}

body.pl-landing-time .pl-time-bento-head .pl-time-lead {
    margin: 0 auto;
}

body.pl-landing-time .pl-time-bento {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

body.pl-landing-time .pl-time-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 320px;
    padding: 28px 28px 0;
    border-radius: 0;
    background: #fff;
    border: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    overflow: hidden;
}

body.pl-landing-time .pl-time-card-replay {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 4;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: rgba(255, 255, 255, 0.92);
    color: #0e0e0e;
    display: grid;
    place-items: center;
    padding: 0;
    margin: 0;
    font: inherit;
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0, 4px, 0);
    transition:
        opacity 0.28s ease,
        transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
    -webkit-tap-highlight-color: transparent;
}

body.pl-landing-time .pl-time-card-replay:hover {
    background: #fff;
}

body.pl-landing-time .pl-time-card-replay svg {
    display: block;
    width: 14px;
    height: 14px;
}

body.pl-landing-time .pl-time-card.is-anim-done .pl-time-card-replay {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    pointer-events: auto;
    cursor: pointer;
}

body.pl-landing-time .pl-time-card.is-anim-playing .pl-time-card-replay {
    opacity: 0;
    transform: translate3d(0, 4px, 0);
}

/* Bento color variants */
body.pl-landing-time .pl-time-card--blue {
    background: #bdd7ff;
    border-color: rgba(37, 99, 235, 0.12);
}

body.pl-landing-time .pl-time-card--blue .pl-time-card-kicker {
    color: #3b6fb8;
}

body.pl-landing-time .pl-time-card--pink {
    background: #ffd4e6;
    border-color: rgba(190, 24, 93, 0.12);
}

body.pl-landing-time .pl-time-card--pink .pl-time-card-kicker {
    color: #a8557a;
}

body.pl-landing-time .pl-time-card--mint {
    background: #c5efd9;
    border-color: rgba(5, 150, 105, 0.12);
}

body.pl-landing-time .pl-time-card--mint .pl-time-card-kicker {
    color: #3d8f72;
}

body.pl-landing-time .pl-time-card--violet {
    background: #d9d0ff;
    border-color: rgba(109, 40, 217, 0.12);
}

body.pl-landing-time .pl-time-card--violet .pl-time-card-kicker {
    color: #7c6aad;
}

body.pl-landing-time .pl-time-card--amber {
    background: #f5e8cc;
    border-color: rgba(161, 98, 7, 0.1);
}

body.pl-landing-time .pl-time-card--amber .pl-time-card-kicker {
    color: #92702a;
}

body.pl-landing-time .pl-time-card--teal {
    background: #cce5e1;
    border-color: rgba(15, 118, 110, 0.1);
}

body.pl-landing-time .pl-time-card--teal .pl-time-card-kicker {
    color: #2f7170;
}

body.pl-landing-time .pl-time-card--slate {
    background: #e8eaed;
    border-color: rgba(71, 85, 105, 0.1);
}

body.pl-landing-time .pl-time-card--slate .pl-time-card-kicker {
    color: #5c6570;
}

body.pl-landing-time .pl-time-card--lilac {
    background: #e8e4f2;
    border-color: rgba(91, 73, 130, 0.1);
}

body.pl-landing-time .pl-time-card--lilac .pl-time-card-kicker {
    color: #6b5d8f;
}

body.pl-landing-time.pl-bento-reveal .pl-time-card {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
        opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--pl-bento-delay, 0ms);
}

body.pl-landing-time.pl-bento-reveal .pl-time-card.is-inview {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}


body.pl-landing-time .pl-time-card--wide {
    grid-column: span 2;
}

body.pl-landing-time .pl-time-card--narrow {
    grid-column: span 1;
}

body.pl-landing-time .pl-time-bento--text .pl-time-card {
    min-height: 0;
    padding: 28px;
}

body.pl-landing-time .pl-time-bento--text .pl-time-card p:last-child {
    margin-bottom: 0;
}

body.pl-landing-time .pl-time-card-kicker {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

body.pl-landing-time .pl-time-card h3 {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-card p {
    margin: 0 0 14px;
    font-size: 17px;
    line-height: 1.45;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-card-media {
    margin-top: auto;
    border-radius: 12px 12px 0 0;
    overflow: hidden;
    border: 1px solid var(--pl-border);
    border-bottom: none;
    background: #fff;
    min-height: 160px;
}

body.pl-landing-time .pl-time-card-media img,
body.pl-landing-time .pl-time-card-media video {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 160px;
    max-height: 220px;
    object-fit: cover;
    object-position: top center;
}


body.pl-landing-time .pl-time-card--narrow .pl-time-card-media img,
body.pl-landing-time .pl-time-card--narrow .pl-time-card-media video {
    max-height: 260px;
}

/* Product screenshots (index bento) — static assets, no CSS animations */
body.pl-landing-time .pl-time-card-media--shot {
    border-radius: 0;
    border: none;
    border-top: 1px solid var(--pl-border);
    background: var(--pl-surface);
    min-height: 0;
}

body.pl-landing-time .pl-time-card-media--shot img {
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
    object-position: center bottom;
}

body.pl-landing-time .pl-time-card--wide .pl-time-card-media--shot img {
    min-height: clamp(180px, 28vw, 320px);
}

body.pl-landing-time .pl-time-card--narrow .pl-time-card-media--shot img {
    min-height: clamp(160px, 32vw, 280px);
}

body.pl-landing-time .pl-time-card-media--shot.pl-time-card-media--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(180px, 32vw, 280px);
}

body.pl-landing-time .pl-time-card-shot-label {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

body.pl-landing-time .pl-time-card-store {
    display: inline-flex;
    margin: 0 0 12px;
    line-height: 0;
}

body.pl-landing-time .pl-time-card-store img {
    height: 28px;
    width: auto;
}

body.pl-landing-time .pl-time-card-store:hover {
    opacity: 0.88;
}

body.pl-landing-time .pl-time-flow {
    margin-top: auto;
    margin-bottom: 24px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.pl-landing-time .pl-time-flow-step {
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid var(--pl-border);
    background: #fff;
    font-size: 13px;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-flow-step strong {
    display: block;
    margin-bottom: 2px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-flow-arrow {
    text-align: center;
    color: var(--pl-muted-2);
    font-size: 12px;
    line-height: 1;
}

/* ── Grow online (two-up) ── */
body.pl-landing-time .pl-time-grow {
    padding: 72px var(--pl-time-inset) 80px;
    background: #fff;
    border-top: 1px solid var(--pl-border);
}

body.pl-landing-time .pl-time-grow-inner {
    max-width: var(--pl-time-max);
    margin: 0 auto;
}

body.pl-landing-time .pl-time-grow-head {
    max-width: 34em;
    margin: 0 auto 36px;
    text-align: center;
}

body.pl-landing-time .pl-time-grow-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

body.pl-landing-time .pl-time-grow-col {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    padding: 28px 28px 24px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 18px;
    background: #fff;
}

body.pl-landing-time .pl-time-grow-col--lilac {
    background: #f1eff8;
    border-color: rgba(109, 40, 217, 0.08);
}

body.pl-landing-time .pl-time-grow-col--lilac .pl-time-grow-kicker {
    color: #7c6aad;
}

body.pl-landing-time .pl-time-grow-col--sky {
    background: #eaf1fb;
    border-color: rgba(37, 99, 235, 0.08);
}

body.pl-landing-time .pl-time-grow-col--sky .pl-time-grow-kicker {
    color: #3b6fb8;
}

body.pl-landing-time .pl-time-grow-kicker {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

body.pl-landing-time .pl-time-grow-col h3 {
    margin: 0 0 10px;
    font-size: clamp(20px, 2.4vw, 24px);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: var(--pl-text);
}

body.pl-landing-time .pl-time-grow-col > p {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--pl-muted);
}

body.pl-landing-time .pl-time-grow-media {
    margin-top: auto;
    margin-bottom: 20px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    overflow: hidden;
    background: #fafafa;
    line-height: 1.2;
    min-height: 220px;
}

/* Web Studio — flat static UI */
body.pl-landing-time .pl-web-graphic {
    padding: 14px 14px 0;
}

body.pl-landing-time .pl-web-ui {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(108px, 0.75fr);
    gap: 10px;
    align-items: stretch;
    min-height: 192px;
}

body.pl-landing-time .pl-web-ui__browser {
    display: flex;
    flex-direction: column;
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    overflow: hidden;
    min-height: 0;
}

body.pl-landing-time .pl-web-ui__chrome {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 10px;
    background: #f3f4f6;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-web-ui__chrome > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d1d5db;
}

body.pl-landing-time .pl-web-ui__chrome > span:nth-child(1) { background: #111; }
body.pl-landing-time .pl-web-ui__chrome > span:nth-child(2) { background: #9ca3af; }
body.pl-landing-time .pl-web-ui__chrome > span:nth-child(3) { background: #d1d5db; }

body.pl-landing-time .pl-web-ui__url {
    flex: 1;
    margin-left: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 9px;
    font-weight: 600;
    color: #111;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-web-ui__url em {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #16a34a;
    font-style: normal;
}

body.pl-landing-time .pl-web-ui__canvas {
    flex: 1;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
    background: #fff;
}

body.pl-landing-time .pl-web-ui__nav {
    display: flex;
    align-items: center;
    gap: 6px;
}

body.pl-landing-time .pl-web-ui__nav strong {
    margin-right: auto;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-web-ui__nav span {
    width: 18px;
    height: 4px;
    border-radius: 999px;
    background: #e5e7eb;
}

body.pl-landing-time .pl-web-ui__hero {
    height: 48px;
    border-radius: 8px;
    background: #111;
}

body.pl-landing-time .pl-web-ui__lines {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

body.pl-landing-time .pl-web-ui__lines i {
    display: block;
    height: 6px;
    border-radius: 999px;
    background: #e5e7eb;
}

body.pl-landing-time .pl-web-ui__cta {
    width: fit-content;
    margin-top: 2px;
    padding: 5px 10px;
    border-radius: 6px;
    background: #155eef;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-web-ui__side {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 0;
}

body.pl-landing-time .pl-web-ui__domain {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px;
    border-radius: 10px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

body.pl-landing-time .pl-web-ui__domain-label {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-web-ui__domain strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-web-ui__domain-status {
    margin-top: 2px;
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    color: #16a34a;
}

body.pl-landing-time .pl-web-ui__pages {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

body.pl-landing-time .pl-web-ui__page {
    padding: 7px 9px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 10px;
    font-weight: 600;
    color: #6b7280;
}

body.pl-landing-time .pl-web-ui__page.is-on {
    color: #111;
    border-color: rgba(0, 0, 0, 0.14);
    box-shadow: inset 2px 0 0 #155eef;
}

body.pl-landing-time .pl-web-ui__lead {
    margin-top: auto;
    margin-bottom: 10px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    padding: 5px 9px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
}

body.pl-landing-time .pl-web-ui__lead-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #155eef;
}

/* Email marketing — flat static UI */
body.pl-landing-time .pl-email-graphic {
    padding: 14px 14px 0;
}

body.pl-landing-time .pl-email-ui {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) 28px minmax(0, 1fr);
    align-items: stretch;
    gap: 6px;
    min-height: 192px;
}

body.pl-landing-time .pl-email-ui__campaign,
body.pl-landing-time .pl-email-ui__inbox {
    display: flex;
    flex-direction: column;
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    overflow: hidden;
    min-height: 0;
}

body.pl-landing-time .pl-email-ui__camp-bar {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 10px 12px;
    background: #fafafa;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-ui__camp-bar span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-ui__camp-bar strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-ui__camp-body {
    padding: 12px;
    flex: 1;
}

body.pl-landing-time .pl-email-ui__subject {
    margin: 0 0 10px !important;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    line-height: 1.3;
}

body.pl-landing-time .pl-email-ui__preview {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

body.pl-landing-time .pl-email-ui__preview i {
    display: block;
    height: 5px;
    border-radius: 999px;
    background: #e5e7eb;
}

body.pl-landing-time .pl-email-ui__sent {
    margin: 0 12px 12px;
    width: fit-content;
    padding: 6px 10px;
    border-radius: 7px;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #047857;
    font-size: 10px;
    font-weight: 650;
}

body.pl-landing-time .pl-email-ui__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.28);
}

body.pl-landing-time .pl-email-ui__inbox-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    background: #fafafa;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-ui__inbox-bar img {
    display: block;
    height: 12px;
    width: auto;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-email-ui__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #155eef;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
}

body.pl-landing-time .pl-email-ui__thread {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 14px 12px 10px;
}

body.pl-landing-time .pl-email-ui__avatar {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
}

body.pl-landing-time .pl-email-ui__thread-body {
    min-width: 0;
    flex: 1;
}

body.pl-landing-time .pl-email-ui__thread-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 2px;
}

body.pl-landing-time .pl-email-ui__thread-top strong {
    font-size: 11px;
    font-weight: 650;
    color: #111;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-email-ui__thread-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #155eef;
}

body.pl-landing-time .pl-email-ui__thread-body p {
    margin: 0 !important;
    font-size: 10px;
    line-height: 1.35;
    color: #6b7280;
}

body.pl-landing-time .pl-email-ui__reply-pill {
    margin: 0 12px 12px;
    width: fit-content;
    padding: 5px 9px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-web-ui,
    body.pl-landing-time .pl-email-ui {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    body.pl-landing-time .pl-email-ui__arrow {
        min-height: 24px;
        transform: rotate(90deg);
    }
}

body.pl-landing-time .pl-time-grow-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 20px;
}

body.pl-landing-time .pl-time-grow-link {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-text);
    text-decoration: none;
}

body.pl-landing-time .pl-time-grow-link::after {
    content: "→";
    margin-left: 6px;
    transition: transform 0.15s ease;
}

body.pl-landing-time .pl-time-grow-link:hover {
    color: #000;
}

body.pl-landing-time .pl-time-grow-link:hover::after {
    transform: translateX(3px);
}

body.pl-landing-time .pl-time-grow-link:has(.pl-link-out-icon) {
    gap: 6px;
}

body.pl-landing-time .pl-time-grow-link:has(.pl-link-out-icon)::after {
    content: none;
    margin: 0;
}

/* ── Grow online A/B: full-bleed 50/50, no graphics ── */
body.pl-landing-time .pl-time-grow-split {
    position: relative;
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: #fff;
    border-top: 1px solid var(--pl-border);
    border-bottom: 1px solid var(--pl-border-strong);
    overflow: hidden;
    padding: 0;
    box-sizing: border-box;
}

body.pl-landing-time .pl-time-grow-split__grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: clamp(420px, 62vh, 640px);
    max-width: none;
    margin: 0;
    border: none;
    border-radius: 0;
    overflow: hidden;
    background: #fff;
}

body.pl-landing-time .pl-time-grow-split__pane {
    --mx: 50%;
    --my: 50%;
    --pl-grow-flash: #3b82f6;
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0;
    padding: clamp(48px, 8vw, 96px) clamp(28px, 6vw, 80px);
    box-sizing: border-box;
    min-height: 100%;
    background: #fff;
    color: var(--pl-text);
    overflow: hidden;
    cursor: default;
}

body.pl-landing-time .pl-time-grow-split__pane--web {
    --pl-grow-flash: #2563eb;
    border-right: 1px solid var(--pl-border);
}

body.pl-landing-time .pl-time-grow-split__pane--email {
    --pl-grow-flash: #ec4899;
    border-right: none;
}

/* Color → black ripple from pointer origin */
body.pl-landing-time .pl-time-grow-split__pane::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--pl-grow-flash);
    clip-path: circle(0% at var(--mx) var(--my));
    transition:
        clip-path 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1) 0.12s;
}

body.pl-landing-time .pl-time-grow-split__pane.is-hot::before {
    clip-path: circle(160% at var(--mx) var(--my));
}

body.pl-landing-time .pl-time-grow-split__pane.is-ink::before {
    background-color: #0e0e0e;
}

body.pl-landing-time .pl-time-grow-split__pane.is-leaving::before {
    clip-path: circle(0% at var(--mx) var(--my));
    background-color: var(--pl-grow-flash);
    transition:
        clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.2s ease;
}

body.pl-landing-time .pl-time-grow-split__pane > * {
    position: relative;
    z-index: 1;
}

body.pl-landing-time .pl-time-grow-split__kicker {
    margin: 0 0 16px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted);
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__title {
    margin: 0 0 18px;
    max-width: 11em;
    font-size: clamp(28px, 4.2vw, 48px);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1.08;
    color: var(--pl-text);
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__copy {
    margin: 0 0 20px;
    max-width: 28em;
    font-size: clamp(15px, 1.5vw, 17px);
    line-height: 1.55;
    color: var(--pl-muted);
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__bullets {
    list-style: none;
    margin: 0 0 28px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

body.pl-landing-time .pl-time-grow-split__bullets li {
    position: relative;
    padding-left: 18px;
    font-size: 14px;
    font-weight: 550;
    letter-spacing: -0.01em;
    line-height: 1.35;
    color: var(--pl-text);
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__bullets li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0e0e0e;
    transition: background 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 22px;
    margin-top: auto;
    padding-top: 20px;
}

body.pl-landing-time .pl-time-grow-split__pane .pl-time-grow-link {
    transition: color 0.12s ease;
}

/* White text as soon as the color ripple starts */
body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__kicker,
body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__title,
body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__copy,
body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__bullets li,
body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-link {
    color: #fff;
    transition: color 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__bullets li::before {
    background: #fff;
    transition: background 0.12s ease;
}

body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-link:hover {
    color: #fff;
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-grow-split__pane::before {
        transition: none;
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot::before {
        clip-path: none;
        background: #0e0e0e;
    }
}

@media (max-width: 800px) {
    body.pl-landing-time .pl-time-hero-dash {
        --pl-hero-dash-pad-x: clamp(28px, 8vw, 48px);
        --pl-hero-dash-pad-top: clamp(18px, 4vh, 32px);
        --pl-hero-dash-breakout: clamp(16px, 5vw, 28px);
    }

    /* Match bento gutters: drop full-bleed breakout on mobile */
    body.pl-landing-time .pl-time-grow-split {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        padding: 0 var(--pl-time-inset) 24px;
        border-top: none;
        overflow: visible;
    }

    body.pl-landing-time .pl-time-grow-split__grid {
        grid-template-columns: 1fr;
        gap: 16px;
        min-height: 0;
        max-width: none;
        border: none;
        border-radius: 0;
        overflow: visible;
        background: transparent;
    }

    body.pl-landing-time .pl-time-grow-split__pane {
        padding: 40px 28px;
        min-height: 280px;
        border-radius: 12px;
        border: 1px solid var(--pl-border-strong);
    }

    body.pl-landing-time .pl-time-grow-split__pane--web {
        border-right: 1px solid var(--pl-border-strong);
    }

    /* No hover / ripple invert on mobile */
    body.pl-landing-time .pl-time-grow-split__pane::before {
        content: none;
        display: none;
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__kicker,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__title,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__copy,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__bullets li,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-link {
        color: inherit;
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__kicker {
        color: var(--pl-muted);
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__title,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__bullets li,
    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-link {
        color: var(--pl-text);
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__copy {
        color: var(--pl-muted);
    }

    body.pl-landing-time .pl-time-grow-split__pane.is-hot .pl-time-grow-split__bullets li::before {
        background: #0e0e0e;
    }
}

/* ── CTA ── */
body.pl-landing-time .pl-time-code-sample {
    margin: 0;
    padding: 18px 20px;
    overflow-x: auto;
    border: 1px solid #e4e4e4;
    background: #f7f7f7;
    font-size: 15px;
    line-height: 1.5;
    text-align: left;
}

body.pl-landing-time .pl-time-code-sample code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: inherit;
    color: #0e0e0e;
}

body.pl-landing-time .pl-time-lead--after-code {
    margin-top: 1rem;
}

body.pl-landing-time .pl-time-cta {
    position: relative;
    overflow: visible;
    display: flex;
    flex-direction: column;
    padding: 88px var(--pl-time-inset) 0;
    background: #0e0e0e;
    color: #fff;
    text-align: center;
}

body.pl-landing-time .pl-time-cta--footer {
    padding: 0;
}

body.pl-landing-time .pl-time-cta-paths {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

body.pl-landing-time .pl-time-cta-inner,
body.pl-landing-time .pl-landing-v4-footer {
    position: relative;
    z-index: 1;
    padding-left: var(--pl-time-inset);
    padding-right: var(--pl-time-inset);
}

body.pl-landing-time .pl-landing-v4-footer-logo img {
    filter: invert(1);
}

body.pl-landing-time .pl-time-cta-btn {
    position: relative;
    isolation: isolate;
    border-radius: 0;
    --pl-cta-feed-r: 236;
    --pl-cta-feed-g: 72;
    --pl-cta-feed-b: 153;
    box-shadow: 0 0 32px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.22);
    transition: box-shadow 0.35s ease;
}

body.pl-landing-time .pl-time-cta-btn::before {
    content: '';
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    transform: none;
    background: none;
    border-radius: inherit;
    z-index: -1;
    pointer-events: none;
    box-shadow: 0 0 40px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.28);
    opacity: 0.72;
    animation: pl-time-cta-glow-breathe 3.4s ease-in-out infinite;
}

body.pl-landing-time .pl-time-cta-btn:hover::before {
    transform: none;
}

body.pl-landing-time .pl-time-cta-btn.is-fed {
    animation: pl-time-cta-feed-pulse 0.85s ease-out;
}

body.pl-landing-time .pl-time-cta-btn.is-fed::before {
    animation: pl-time-cta-feed-ring 0.85s ease-out;
}

@keyframes pl-time-cta-glow-breathe {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 0.88; }
}

@keyframes pl-time-cta-feed-pulse {
    0%, 100% {
        box-shadow: 0 0 32px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.22);
    }
    35% {
        box-shadow:
            0 0 28px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.7),
            0 0 72px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.55),
            0 0 120px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.35);
    }
}

@keyframes pl-time-cta-feed-ring {
    0%, 100% {
        opacity: 0.72;
        box-shadow: 0 0 40px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.28);
    }
    35% {
        opacity: 1;
        box-shadow:
            0 0 24px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.95),
            0 0 64px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.7),
            0 0 110px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.5);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-time-cta-btn::before,
    body.pl-landing-time .pl-time-cta-btn.is-fed,
    body.pl-landing-time .pl-time-cta-btn.is-fed::before {
        animation: none;
    }
}

body.pl-landing-time .pl-time-cta-inner {
    max-width: 640px;
    margin: 0 auto;
    padding-bottom: 64px;
}

body.pl-landing-time .pl-time-cta h2 {
    margin: 0 0 14px;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: #fff;
}

body.pl-landing-time .pl-time-cta-inner > p {
    margin: 0 0 24px;
    font-size: 15px;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.62);
}

body.pl-landing-time .pl-sales-modal__submit {
    background: #0e0e0e;
    border-radius: 8px;
    text-transform: none;
    letter-spacing: -0.01em;
    font-weight: 600;
}

body.pl-landing-time .pl-sales-modal__textarea {
    resize: vertical;
    min-height: 96px;
}

@media (max-width: 960px) {
    body.pl-landing-time .pl-time-bento-head,
    body.pl-landing-time .pl-time-grow-head {
        margin-left: 0;
        margin-right: 0;
        text-align: left;
    }

    body.pl-landing-time .pl-time-bento-head .pl-time-lead {
        margin-left: 0;
        margin-right: 0;
    }

    body.pl-landing-time .pl-time-bento {
        grid-template-columns: 1fr;
    }

    body.pl-landing-time .pl-time-card--wide,
    body.pl-landing-time .pl-time-card--narrow {
        grid-column: span 1;
        min-height: 0;
    }

    body.pl-landing-time .pl-time-grow-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 961px) and (max-width: 1100px) {
    body.pl-landing-time .pl-time-bento {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.pl-landing-time .pl-time-card--wide,
    body.pl-landing-time .pl-time-card--narrow {
        grid-column: span 1;
    }
}

/* ── Email campaigns — preview cards in bento ── */
body.pl-landing-time .pl-time-email-previews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 14px 14px 0;
}

body.pl-landing-time .pl-time-email-preview {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 10px 10px 0 0;
    overflow: hidden;
    min-height: 140px;
}

body.pl-landing-time .pl-time-email-preview--promo {
    border-top: 3px solid #ff5c45;
}

body.pl-landing-time .pl-time-email-preview--newsletter {
    border-top: 3px solid #ff8a65;
}

body.pl-landing-time .pl-time-email-preview--update {
    border-top: 3px solid #fb7185;
}

body.pl-landing-time .pl-time-email-preview-label {
    margin: 0;
    padding: 10px 12px 0;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-time-email-preview-body {
    padding: 8px 12px 12px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.pl-landing-time .pl-time-email-preview-subject {
    margin: 0;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #111;
    line-height: 1.35;
}

body.pl-landing-time .pl-time-email-preview-snippet {
    margin: 0;
    font-size: 10px;
    line-height: 1.45;
    color: #6b7280;
}

body.pl-landing-time .pl-time-email-preview-block {
    height: 5px;
    border-radius: 999px;
    background: #e5e7eb;
}

body.pl-landing-time .pl-time-email-preview-block--accent {
    background: linear-gradient(90deg, rgba(255, 92, 69, 0.35), rgba(255, 138, 101, 0.2));
}

body.pl-landing-time .pl-time-email-preview-block--short {
    width: 62%;
}

body.pl-landing-time .pl-time-email-preview-cta {
    display: inline-block;
    align-self: flex-start;
    margin-top: auto;
    padding: 5px 10px;
    font-size: 9px;
    font-weight: 650;
    border-radius: 999px;
    background: #ff5c45;
    color: #fff;
}

body.pl-landing-time .pl-time-email-preview--newsletter .pl-time-email-preview-cta {
    background: #ff8a65;
    border-radius: 5px;
}

body.pl-landing-time .pl-time-email-preview--update .pl-time-email-preview-cta {
    background: #111;
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-time-email-previews {
        grid-template-columns: 1fr;
    }
}

/* ── Scroll reveal (excludes hero video + benefits visual) ── */
body.pl-landing-time [data-pl-reveal] {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition:
        opacity 0.85s ease,
        transform 0.95s cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--pl-reveal-delay, 0ms);
    will-change: opacity, transform;
}

body.pl-landing-time [data-pl-reveal].is-inview {
    opacity: 1;
    transform: none;
}

/* Benefits copy: softer rise, no background fade */
body.pl-landing-time .pl-time-benefits [data-pl-reveal] {
    transform: translate3d(0, 18px, 0);
    transition:
        opacity 0.9s ease,
        transform 1s cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--pl-reveal-delay, 0ms);
}

body.pl-landing-time .pl-time-benefits [data-pl-reveal].is-inview {
    opacity: 1;
    transform: none;
}

body.pl-landing-time [data-pl-reveal='scale'] {
    transform: translate3d(0, 18px, 0) scale(0.88);
    transform-origin: center center;
}

body.pl-landing-time [data-pl-reveal='scale'].is-inview {
    transform: none;
}

body.pl-landing-time .pl-time-industry-cards[data-pl-reveal='scale'] {
    transform: translate3d(0, 10px, 0);
    transform-origin: center bottom;
}

/* Industries — subtle reveal only, no scale or spin */
body.pl-landing-time .pl-time-industries [data-pl-reveal] {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
    transition:
        opacity 0.6s ease,
        transform 0.6s ease;
    transition-delay: var(--pl-reveal-delay, 0ms);
    will-change: opacity, transform;
}

body.pl-landing-time .pl-time-industries [data-pl-reveal].is-inview {
    opacity: 1;
    transform: none;
}

body.pl-landing-time [data-pl-reveal='left'] {
    transform: translate3d(-28px, 0, 0);
}

body.pl-landing-time [data-pl-reveal='right'] {
    transform: translate3d(28px, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time [data-pl-reveal] {
        opacity: 1;
        transform: none;
        transition: none;
    }
}


/* ---- css/pl-landing-index.css ---- */
/**
 * Homepage cut. Scoped to body.pl-index.
 */

@property --sun-x { syntax: '<percentage>'; inherits: true; initial-value: 72%; }
@property --sun-y { syntax: '<percentage>'; inherits: true; initial-value: 92%; }
@property --sun-size { syntax: '<length>'; inherits: true; initial-value: 90px; }
@property --sun-opacity { syntax: '<number>'; inherits: true; initial-value: 0.55; }
@property --moon-x { syntax: '<percentage>'; inherits: true; initial-value: 24%; }
@property --moon-y { syntax: '<percentage>'; inherits: true; initial-value: 18%; }
@property --moon-opacity { syntax: '<number>'; inherits: true; initial-value: 0.55; }
@property --stars-opacity { syntax: '<number>'; inherits: true; initial-value: 0.55; }
@property --heat-opacity { syntax: '<number>'; inherits: true; initial-value: 0.12; }
@property --sky-a { syntax: '<color>'; inherits: true; initial-value: #070714; }
@property --sky-b { syntax: '<color>'; inherits: true; initial-value: #24143c; }
@property --sky-c { syntax: '<color>'; inherits: true; initial-value: #5c3d6e; }
@property --sky-d { syntax: '<color>'; inherits: true; initial-value: #c97b63; }
@property --glow { syntax: '<color>'; inherits: true; initial-value: rgba(180, 80, 120, 0.4); }
@property --sun-core { syntax: '<color>'; inherits: true; initial-value: #ffb38a; }
@property --sun-bloom { syntax: '<color>'; inherits: true; initial-value: rgba(200, 70, 90, 0.45); }

body.pl-index {
    --pl4-ink: #0e0e0e;
    --pl4-muted: #6a645c;
    --pl4-rule: #e4e4e4;
}

/* ── Sky theater ── */
body.pl-index .pl4-sky {
    --sky-a: #070714;
    --sky-b: #24143c;
    --sky-c: #5c3d6e;
    --sky-d: #c97b63;
    --glow: rgba(180, 80, 120, 0.4);
    --sun-x: 72%;
    --sun-y: 92%;
    --sun-size: 90px;
    --sun-core: #ffb38a;
    --sun-bloom: rgba(200, 70, 90, 0.45);
    --sun-opacity: 0.55;
    --moon-x: 24%;
    --moon-y: 18%;
    --moon-opacity: 0.55;
    --stars-opacity: 0.55;
    --heat-opacity: 0.12;
    --ink: #f6eefe;
    --muted: rgba(246, 238, 254, 0.7);
    --rule: rgba(246, 238, 254, 0.2);
    --gaze-x: 0px;
    --gaze-y: 0px;
    position: relative;
    isolation: isolate;
    height: 100vh;
    min-height: 680px;
    overflow: hidden;
    color: var(--ink);
    background:
        radial-gradient(ellipse 90% 55% at 50% 118%, var(--glow), transparent 58%),
        linear-gradient(180deg, var(--sky-a) 0%, var(--sky-b) 38%, var(--sky-c) 72%, var(--sky-d) 100%);
}

body.pl-index .pl4-sky[data-pl4-sky='sunrise'] {
    --sky-a: #2a3a72;
    --sky-b: #e07a5f;
    --sky-c: #f2cc8f;
    --sky-d: #ffe8c8;
    --glow: rgba(255, 186, 120, 0.55);
    --sun-x: 18%;
    --sun-y: 70%;
    --sun-size: 128px;
    --sun-core: #fff4d2;
    --sun-bloom: rgba(255, 170, 90, 0.7);
    --sun-opacity: 1;
    --moon-x: 82%;
    --moon-y: 8%;
    --moon-opacity: 0;
    --stars-opacity: 0;
    --heat-opacity: 0.28;
    --ink: #1c140e;
    --muted: rgba(28, 20, 14, 0.68);
    --rule: rgba(28, 20, 14, 0.18);
}

body.pl-index .pl4-sky[data-pl4-sky='sunset'] {
    --sky-a: #140e28;
    --sky-b: #9b2226;
    --sky-c: #e76f51;
    --sky-d: #f4c095;
    --glow: rgba(255, 90, 40, 0.5);
    --sun-x: 78%;
    --sun-y: 68%;
    --sun-size: 148px;
    --sun-core: #ffd7a1;
    --sun-bloom: rgba(255, 80, 30, 0.7);
    --sun-opacity: 1;
    --moon-opacity: 0;
    --stars-opacity: 0.08;
    --heat-opacity: 0.4;
    --ink: #fff6ee;
    --muted: rgba(255, 246, 238, 0.72);
    --rule: rgba(255, 246, 238, 0.22);
}

body.pl-index .pl4-sky[data-pl4-sky='dusk'] {
    --sky-a: #070714;
    --sky-b: #24143c;
    --sky-c: #5c3d6e;
    --sky-d: #c97b63;
    --glow: rgba(180, 80, 120, 0.4);
    --sun-x: 72%;
    --sun-y: 92%;
    --sun-size: 90px;
    --sun-core: #ffb38a;
    --sun-bloom: rgba(200, 70, 90, 0.45);
    --sun-opacity: 0.55;
    --moon-x: 24%;
    --moon-y: 18%;
    --moon-opacity: 0.55;
    --stars-opacity: 0.55;
    --heat-opacity: 0.12;
    --ink: #f6eefe;
    --muted: rgba(246, 238, 254, 0.7);
    --rule: rgba(246, 238, 254, 0.2);
}

body.pl-index .pl4-sky[data-pl4-sky='twilight'] {
    --sky-a: #02040a;
    --sky-b: #0b1224;
    --sky-c: #15243d;
    --sky-d: #1c3358;
    --glow: rgba(70, 120, 180, 0.28);
    --sun-x: 88%;
    --sun-y: 108%;
    --sun-size: 70px;
    --sun-opacity: 0;
    --moon-x: 70%;
    --moon-y: 22%;
    --moon-opacity: 0.92;
    --stars-opacity: 1;
    --heat-opacity: 0;
    --ink: #eef3fb;
    --muted: rgba(238, 243, 251, 0.68);
    --rule: rgba(238, 243, 251, 0.18);
}

body.pl-index .pl4-sky,
body.pl-index .pl4-sky .pl-time-benefits__grid,
body.pl-index .pl4-sky .pl-time-benefits__copy {
    min-height: 0;
}

body.pl-index .pl4-sky__world {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

body.pl-index .pl4-sky__veil {
    position: absolute;
    inset: -10%;
    background:
        radial-gradient(circle at var(--sun-x) var(--sun-y), var(--sun-bloom), transparent 42%),
        radial-gradient(ellipse 70% 40% at 50% 100%, var(--glow), transparent 70%);
    transform: translate(var(--gaze-x), var(--gaze-y));
}

body.pl-index .pl4-sky__sun {
    position: absolute;
    left: var(--sun-x);
    top: var(--sun-y);
    width: var(--sun-size);
    height: var(--sun-size);
    margin: 0;
    border-radius: 50%;
    background: radial-gradient(circle at 38% 36%, #fff, var(--sun-core) 42%, transparent 72%);
    box-shadow:
        0 0 40px 16px var(--sun-core),
        0 0 120px 48px var(--sun-bloom),
        0 0 220px 90px rgba(255, 140, 60, 0.28);
    opacity: var(--sun-opacity);
    transform: translate(calc(-50% + var(--gaze-x)), calc(-50% + var(--gaze-y)));
    will-change: left, top, opacity;
}

body.pl-index .pl4-sky__moon {
    position: absolute;
    left: var(--moon-x);
    top: var(--moon-y);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background:
        radial-gradient(circle at 32% 30%, #f7f3ea, #cfd6e4 62%, #9aa7bd);
    box-shadow:
        0 0 24px 8px rgba(220, 230, 255, 0.35),
        inset -10px -6px 0 rgba(20, 30, 50, 0.18);
    opacity: var(--moon-opacity);
    transform: translate(calc(-50% + calc(var(--gaze-x) * -0.4)), calc(-50% + calc(var(--gaze-y) * -0.4)));
    will-change: left, top, opacity;
}

body.pl-index .pl4-sky__stars {
    position: absolute;
    inset: 0;
    opacity: var(--stars-opacity);
    background-image:
        radial-gradient(1px 1px at 8% 18%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 22% 12%, #fff, transparent),
        radial-gradient(1px 1px at 31% 28%, rgba(255, 255, 255, 0.7), transparent),
        radial-gradient(1px 1px at 44% 9%, #fff, transparent),
        radial-gradient(2px 2px at 57% 21%, #fff, transparent),
        radial-gradient(1px 1px at 71% 14%, rgba(255, 255, 255, 0.8), transparent),
        radial-gradient(1px 1px at 83% 31%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 91% 11%, #fff, transparent),
        radial-gradient(1px 1px at 14% 41%, #fff, transparent),
        radial-gradient(1px 1px at 39% 36%, rgba(255, 255, 255, 0.55), transparent),
        radial-gradient(1px 1px at 64% 44%, #fff, transparent),
        radial-gradient(1.5px 1.5px at 78% 38%, #fff, transparent),
        radial-gradient(1px 1px at 96% 48%, #fff, transparent),
        radial-gradient(1px 1px at 5% 62%, rgba(255, 255, 255, 0.5), transparent),
        radial-gradient(1px 1px at 27% 58%, #fff, transparent);
    animation: pl4-twinkle 5.5s ease-in-out infinite;
}

body.pl-index .pl4-sky__heat {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 18%;
    height: 28%;
    background: linear-gradient(180deg, transparent, rgba(255, 180, 90, 0.18), transparent);
    opacity: var(--heat-opacity);
    filter: blur(18px);
    transform: scaleX(1.15);
    animation: pl4-heat 7s ease-in-out infinite;
}

body.pl-index .pl4-sky__grain {
    position: absolute;
    inset: 0;
    opacity: 0.18;
    mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
    background-size: 180px 180px;
}

body.pl-index .pl4-sky__center {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0 var(--pl-time-inset);
    box-sizing: border-box;
}

body.pl-index .pl4-sky .pl-time-benefits__copy {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    width: min(100%, 36rem);
    max-width: 36rem;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    gap: 22px;
}

body.pl-index .pl4-sky .pl-time-benefits__head,
body.pl-index .pl4-sky .pl-time-benefits__accordion {
    width: 100%;
    max-width: none;
    align-self: stretch;
    text-align: left;
}

body.pl-index .pl4-sky .pl-time-benefits__head .pl-time-title {
    font-size: clamp(36px, 5.5vw, 56px);
    font-weight: 400;
    letter-spacing: -0.04em;
    line-height: 1.02;
}

body.pl-index .pl4-sky .pl-time-eyebrow,
body.pl-index .pl4-sky .pl-time-title,
body.pl-index .pl4-sky .pl-time-benefits__trigger,
body.pl-index .pl4-sky .pl-time-benefits__icon {
    color: var(--ink);
}

body.pl-index .pl4-sky .pl-time-benefits__item {
    border-bottom-color: var(--rule);
}

body.pl-index .pl4-sky .pl-time-benefits__trigger-label {
    font-size: clamp(18px, 2vw, 22px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.25;
}

body.pl-index .pl4-sky .pl-time-benefits__text {
    font-size: 15px;
    line-height: 1.5;
    color: var(--muted);
}

body.pl-index .pl4-sky .pl-time-benefits__title .pl-time-typewriter-cursor {
    background: currentColor;
}

body.pl-index .pl4-sky .pl-time-benefits__visual {
    display: none;
}

body.pl-index .pl4-sky__hours {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: max(28px, env(safe-area-inset-bottom));
    display: flex;
    gap: 4px;
    padding: 5px;
    transform: translateX(-50%);
    background: rgba(8, 6, 12, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.16);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

body.pl-index .pl4-sky__hours button {
    appearance: none;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, 0.62);
    font: inherit;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    padding: 10px 16px;
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease;
}

body.pl-index .pl4-sky__hours button[aria-selected='true'] {
    color: #0e0e0e;
    background: #fff;
}

body.pl-index .pl4-sky__hours button:hover {
    color: #fff;
}

body.pl-index .pl4-sky__hours button[aria-selected='true']:hover {
    color: #0e0e0e;
}

@keyframes pl4-twinkle {
    0%,
    100% { opacity: var(--stars-opacity); }
    50% { opacity: calc(var(--stars-opacity) * 0.55); }
}

@keyframes pl4-heat {
    0%,
    100% { transform: scaleX(1.1) translateY(0); }
    50% { transform: scaleX(1.22) translateY(-8px); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-index .pl4-sky,
    body.pl-index .pl4-sky__sun,
    body.pl-index .pl4-sky__moon,
    body.pl-index .pl4-sky__veil,
    body.pl-index .pl4-sky__stars {
        transition: none;
        animation: none;
    }

    body.pl-index .pl4-sky__heat {
        animation: none;
    }

}

/* ── Lamp: light finds the line ── */
body.pl-index .pl4-lamp,
body.pl-landing-about .pl4-lamp {
    --sx: 42%;
    --sy: 48%;
    position: relative;
    height: 100vh;
    min-height: 680px;
    overflow: hidden;
    background: #070707;
    color: #fff;
}

body.pl-index .pl4-lamp__spot,
body.pl-landing-about .pl4-lamp__spot {
    position: absolute;
    z-index: 1;
    left: var(--sx);
    top: var(--sy);
    width: 72vmax;
    height: 72vmax;
    transform: translate(-50%, -50%);
    background: radial-gradient(
        circle,
        rgba(255, 228, 186, 0.22) 0%,
        rgba(255, 196, 120, 0.08) 32%,
        transparent 62%
    );
    pointer-events: none;
    mix-blend-mode: screen;
    transition: width 0.4s ease, height 0.4s ease;
}

body.pl-index .pl4-lamp__ghost,
body.pl-index .pl4-lamp__word,
body.pl-landing-about .pl4-lamp__ghost,
body.pl-landing-about .pl4-lamp__word {
    position: absolute;
    z-index: 2;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0 4vw 48px;
    font-size: clamp(72px, 22vw, 280px);
    font-weight: 600;
    letter-spacing: -0.07em;
    line-height: 0.82;
    text-align: center;
    pointer-events: none;
    user-select: none;
}

body.pl-index .pl4-lamp__ghost,
body.pl-landing-about .pl4-lamp__ghost {
    color: #fff;
    opacity: 0.045;
}

body.pl-index .pl4-lamp__word,
body.pl-landing-about .pl4-lamp__word {
    z-index: 3;
    color: #fff8ee;
    -webkit-mask-image: radial-gradient(
        circle 38vmax at var(--sx) var(--sy),
        #000 0%,
        rgba(0, 0, 0, 0.55) 38%,
        transparent 70%
    );
    mask-image: radial-gradient(
        circle 38vmax at var(--sx) var(--sy),
        #000 0%,
        rgba(0, 0, 0, 0.55) 38%,
        transparent 70%
    );
}

body.pl-index .pl4-lamp__note,
body.pl-landing-about .pl4-lamp__note {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: max(36px, env(safe-area-inset-bottom));
    margin: 0;
    transform: translateX(-50%);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.38);
}

@media (max-width: 860px) {
    body.pl-index .pl4-sky {
        min-height: 100svh;
    }

    body.pl-index .pl4-sky .pl-time-benefits__head .pl-time-title {
        font-size: clamp(36px, 5.5vw, 56px);
    }

    body.pl-index .pl4-lamp,
    body.pl-landing-about .pl4-lamp {
        min-height: 100svh;
    }

    body.pl-index .pl4-lamp__ghost,
    body.pl-index .pl4-lamp__word,
    body.pl-landing-about .pl4-lamp__ghost,
    body.pl-landing-about .pl4-lamp__word {
        font-size: clamp(64px, 28vw, 140px);
    }

}

/* ── Benefits: black split with cycling bento ── */
body.pl-index .pl-time-benefits--dark {
    position: relative;
    background: #0e0e0e;
    color: #f4f4f4;
    min-height: 100vh;
    overflow: hidden;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__grid {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: none;
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--pl-time-inset, clamp(20px, 5vw, 48px));
    box-sizing: border-box;
    grid-template-columns: none;
    gap: 0;
    min-height: 100vh;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__copy {
    position: relative;
    z-index: 1;
    width: min(100%, 36rem);
    max-width: 36rem;
    min-height: 0;
    justify-content: center;
    align-items: stretch;
    padding: clamp(72px, 12vh, 120px) 0;
    margin: 0 auto;
    background: transparent;
    color: inherit;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__head,
body.pl-index .pl-time-benefits--dark .pl-time-benefits__accordion {
    width: 100%;
    max-width: none;
    align-self: stretch;
    text-align: left;
}

body.pl-index .pl-time-benefits--dark .pl-time-eyebrow {
    color: rgba(244, 244, 244, 0.55);
}

body.pl-index .pl-time-benefits--dark .pl-time-title,
body.pl-index .pl-time-benefits--dark .pl-time-benefits__trigger,
body.pl-index .pl-time-benefits--dark .pl-time-benefits__icon {
    color: #f4f4f4;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__title {
    font-size: clamp(32px, 4.6vw, 48px);
    font-weight: 500;
    letter-spacing: -0.045em;
    line-height: 1.05;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__item {
    border-bottom-color: rgba(255, 255, 255, 0.12);
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__trigger-label {
    font-size: clamp(22px, 2.1vw, 26px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.2;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__trigger {
    padding: clamp(14px, 1.8vh, 18px) 0;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__item:not(.is-open) .pl-time-benefits__trigger-label {
    color: rgba(244, 244, 244, 0.55);
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__text {
    font-size: 18px;
    line-height: 1.5;
    color: rgba(244, 244, 244, 0.78);
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual {
    --aura-a: #4f7cff;
    --aura-b: #8eb4ff;
    --aura-c: #c4b5fd;
    position: absolute;
    inset: 0;
    width: auto;
    max-width: none;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: transparent;
    z-index: 0;
    pointer-events: none;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual[data-pl-benefits-mood='line'] {
    --aura-a: #38bdf8;
    --aura-b: #7dd3fc;
    --aura-c: #bae6fd;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual[data-pl-benefits-mood='leads'] {
    --aura-a: #4f7cff;
    --aura-b: #93c5fd;
    --aura-c: #c4b5fd;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual[data-pl-benefits-mood='pay'] {
    --aura-a: #34d399;
    --aura-b: #6ee7b7;
    --aura-c: #a7f3d0;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual[data-pl-benefits-mood='inbox'] {
    --aura-a: #22d3ee;
    --aura-b: #67e8f9;
    --aura-c: #a5b4fc;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual[data-pl-benefits-mood='grow'] {
    --aura-a: #fb7185;
    --aura-b: #fdba74;
    --aura-c: #fde68a;
}

body.pl-index .pl-time-benefits--dark .pl-time-aura {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    isolation: isolate;
}

body.pl-index .pl-time-benefits--dark .pl-time-aura__orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.7;
    will-change: transform;
    background: var(--aura-a);
    transition: background 0.9s ease;
}

body.pl-index .pl-time-benefits--dark .pl-time-aura__orb--a {
    width: 56%;
    height: 78%;
    top: -12%;
    left: -8%;
    background: var(--aura-a);
    animation: plIndexAuraA 16s ease-in-out infinite alternate;
}

body.pl-index .pl-time-benefits--dark .pl-time-aura__orb--b {
    width: 52%;
    height: 72%;
    right: -10%;
    bottom: -14%;
    background: var(--aura-b);
    animation: plIndexAuraB 20s ease-in-out infinite alternate;
}

body.pl-index .pl-time-benefits--dark .pl-time-aura__orb--c {
    width: 38%;
    height: 58%;
    left: 32%;
    top: 18%;
    background: var(--aura-c);
    opacity: 0.5;
    animation: plIndexAuraC 14s ease-in-out infinite alternate;
}

body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual:not(.is-playing) .pl-time-aura__orb {
    animation-play-state: paused;
}

@keyframes plIndexAuraA {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(12%, 8%, 0) scale(1.1); }
}

@keyframes plIndexAuraB {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    100% { transform: translate3d(-12%, -6%, 0) scale(1.14); }
}

@keyframes plIndexAuraC {
    0% { transform: translate3d(0, 0, 0) scale(0.94); }
    100% { transform: translate3d(6%, -10%, 0) scale(1.16); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-index .pl-time-benefits--dark .pl-time-aura__orb {
        animation: none;
    }
}

@media (max-width: 900px) {
    body.pl-index .pl-time-benefits--dark {
        overflow-x: clip;
    }

    body.pl-index .pl-time-benefits--dark .pl-time-benefits__grid {
        min-height: 100svh;
    }

    body.pl-index .pl-time-benefits--dark .pl-time-benefits__visual {
        position: absolute;
        inset: 0;
        width: auto;
        height: auto;
        margin: 0;
        min-height: 0;
        padding: 0;
    }

    body.pl-index .pl-time-benefits--dark .pl-time-benefits__copy {
        min-height: 0;
        padding-top: clamp(56px, 10vh, 80px);
        padding-bottom: clamp(40px, 8vh, 64px);
    }

    body.pl-index .pl-time-benefits--dark .pl-time-aura {
        position: absolute;
        inset: 0;
        width: auto;
        height: auto;
        margin: 0;
    }
}

/* ── Carrier-style white break after the accordion ── */
body.pl-index .pl-index-line {
    background: #fff;
    color: #0e0e0e;
    min-height: 100vh;
    display: flex;
    align-items: center;
    padding: clamp(96px, 14vh, 140px) var(--pl-time-inset, clamp(20px, 5vw, 48px));
    box-sizing: border-box;
}

body.pl-index .pl-index-line__inner {
    max-width: 920px;
    margin: 0 auto;
    text-align: center;
}

body.pl-index .pl-index-line .pl-time-eyebrow,
body.pl-index .pl-index-line__eyebrow {
    color: #8a8a8a;
    margin-bottom: 18px;
}

body.pl-index .pl-index-line__title {
    margin: 0;
    font-size: clamp(40px, 8vw, 88px);
    font-weight: 400;
    letter-spacing: -0.055em;
    line-height: 0.95;
    color: #0e0e0e;
}

body.pl-index .pl-index-line__title-line {
    display: block;
    overflow: hidden;
}

body.pl-index .pl-index-line__title-line > span {
    display: block;
}

body.pl-index .pl-index-line__lead {
    margin: 28px auto 0;
    max-width: 28em;
    font-size: clamp(16px, 1.6vw, 19px);
    line-height: 1.45;
    color: #6f6f6f;
    font-weight: 400;
}

body.pl-index .pl-index-line__grid {
    list-style: none;
    margin: clamp(56px, 9vh, 88px) 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    text-align: left;
    border-top: 1px solid #e8e8e8;
    position: relative;
}

/* Signal: hard three-way split — Call / Text / Pay */
body.pl-index .pl-index-line__grid::before {
    content: '';
    position: absolute;
    top: -1.5px;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(
        90deg,
        #1774ff 0%,
        #1774ff 33.333%,
        #ec4899 33.333%,
        #ec4899 66.666%,
        #0d9488 66.666%,
        #0d9488 100%
    );
    transform: scaleX(0);
    transform-origin: left center;
    z-index: 1;
    pointer-events: none;
}

body.pl-index .pl-index-line__grid li {
    position: relative;
    padding: 28px 32px 0 0;
}

body.pl-index .pl-index-line__grid li + li {
    padding-left: 32px;
    padding-right: 32px;
    border-left: 1px solid #e8e8e8;
}

body.pl-index .pl-index-line__grid li:last-child {
    padding-right: 0;
}

body.pl-index .pl-index-line__grid h3 {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #0e0e0e;
}

body.pl-index .pl-index-line__grid p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: #6f6f6f;
}

body.pl-index .pl-index-line__plan {
    margin: clamp(48px, 8vh, 72px) auto 0;
    padding-top: clamp(36px, 6vh, 52px);
    border-top: 1px solid #e8e8e8;
    max-width: 20em;
    text-align: center;
}

body.pl-index .pl-index-line__plan-kicker {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #8a8a8a;
}

body.pl-index .pl-index-line__plan-price {
    margin: 12px 0 0;
    font-size: clamp(36px, 5vw, 48px);
    font-weight: 400;
    letter-spacing: -0.04em;
    line-height: 1;
    color: #0e0e0e;
}

body.pl-index .pl-index-line__plan-price small {
    margin-left: 4px;
    font-size: 0.38em;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #6f6f6f;
    vertical-align: 0.35em;
}

body.pl-index .pl-index-line__plan-link {
    position: relative;
    display: inline-block;
    margin-top: 20px;
    padding-bottom: 3px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-decoration: none;
    color: transparent;
    --pl-plan-link-accent: #1774ff;
    background-image: linear-gradient(
        90deg,
        var(--pl-plan-link-accent) 50%,
        #0e0e0e 50%
    );
    background-size: 200% 100%;
    background-position: 100% 0;
    -webkit-background-clip: text;
    background-clip: text;
    transition: background-position 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

body.pl-index .pl-index-line__plan-link::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: #0e0e0e;
}

body.pl-index .pl-index-line__plan-link::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1px;
    background: var(--pl-plan-link-accent, #1774ff);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.2s ease;
}

body.pl-index .pl-index-line__plan-link:hover {
    background-position: 0 0;
}

body.pl-index .pl-index-line__plan-link:hover::after {
    transform: scaleX(1);
}

/* ── Entrance: signal draws through Call → Text → Pay ── */
body.pl-index .pl-index-line:not(.is-live) .pl-index-line__eyebrow,
body.pl-index .pl-index-line:not(.is-live) .pl-index-line__lead,
body.pl-index .pl-index-line:not(.is-live) .pl-index-line__grid li,
body.pl-index .pl-index-line:not(.is-live) .pl-index-line__plan {
    opacity: 0;
}

body.pl-index .pl-index-line:not(.is-live) .pl-index-line__eyebrow,
body.pl-index .pl-index-line:not(.is-live) .pl-index-line__lead {
    transform: translate3d(0, 14px, 0);
}

body.pl-index .pl-index-line:not(.is-live) .pl-index-line__title-line > span {
    transform: translate3d(0, 110%, 0);
}

body.pl-index .pl-index-line:not(.is-live) .pl-index-line__grid li {
    transform: translate3d(0, 22px, 0);
}

body.pl-index .pl-index-line:not(.is-live) .pl-index-line__plan {
    transform: translate3d(0, 18px, 0) scale(0.98);
}

body.pl-index .pl-index-line .pl-index-line__eyebrow,
body.pl-index .pl-index-line .pl-index-line__title-line > span,
body.pl-index .pl-index-line .pl-index-line__lead,
body.pl-index .pl-index-line .pl-index-line__grid li,
body.pl-index .pl-index-line .pl-index-line__plan {
    transition:
        opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.9s cubic-bezier(0.16, 1, 0.3, 1),
        color 0.35s ease;
}

body.pl-index .pl-index-line .pl-index-line__grid::before {
    transition: transform 1.15s cubic-bezier(0.22, 1, 0.36, 1);
}

body.pl-index .pl-index-line.is-live .pl-index-line__eyebrow {
    opacity: 1;
    transform: none;
    transition-delay: 0.05s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__title-line:nth-child(1) > span {
    transform: none;
    transition-delay: 0.12s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__title-line:nth-child(2) > span {
    transform: none;
    transition-delay: 0.26s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__lead {
    opacity: 1;
    transform: none;
    transition-delay: 0.38s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid::before {
    transform: scaleX(1);
    transition-delay: 0.52s;
}

/* Color + reveal timed to each third of the 1.15s line draw */
body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(1) {
    opacity: 1;
    transform: none;
    transition-delay: 0.52s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(2) {
    opacity: 1;
    transform: none;
    transition-delay: 0.9s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(3) {
    opacity: 1;
    transform: none;
    transition-delay: 1.29s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(1) h3 {
    color: #1774ff;
    transition: color 0.2s ease 0.52s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(2) h3 {
    color: #ec4899;
    transition: color 0.2s ease 0.9s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__grid li:nth-child(3) h3 {
    color: #0d9488;
    transition: color 0.2s ease 1.29s;
}

body.pl-index .pl-index-line.is-live .pl-index-line__plan {
    opacity: 1;
    transform: none;
    transition-delay: 1.55s;
}

@media (prefers-reduced-motion: reduce) {
    body.pl-index .pl-index-line .pl-index-line__eyebrow,
    body.pl-index .pl-index-line .pl-index-line__title-line > span,
    body.pl-index .pl-index-line .pl-index-line__lead,
    body.pl-index .pl-index-line .pl-index-line__grid li,
    body.pl-index .pl-index-line .pl-index-line__plan,
    body.pl-index .pl-index-line .pl-index-line__grid::before {
        transition: none !important;
        transition-delay: 0s !important;
    }

    body.pl-index .pl-index-line:not(.is-live) .pl-index-line__eyebrow,
    body.pl-index .pl-index-line:not(.is-live) .pl-index-line__lead,
    body.pl-index .pl-index-line:not(.is-live) .pl-index-line__grid li,
    body.pl-index .pl-index-line:not(.is-live) .pl-index-line__plan,
    body.pl-index .pl-index-line:not(.is-live) .pl-index-line__title-line > span {
        opacity: 1;
        transform: none;
    }

    body.pl-index .pl-index-line .pl-index-line__grid::before {
        transform: scaleX(1);
    }

    body.pl-index .pl-index-line .pl-index-line__grid li:nth-child(1) h3 {
        color: #1774ff;
    }

    body.pl-index .pl-index-line .pl-index-line__grid li:nth-child(2) h3 {
        color: #ec4899;
    }

    body.pl-index .pl-index-line .pl-index-line__grid li:nth-child(3) h3 {
        color: #0d9488;
    }
}

@media (max-width: 760px) {
    body.pl-index .pl-index-line {
        padding-top: 80px;
        padding-bottom: 80px;
        min-height: 100svh;
    }

    body.pl-index .pl-index-line__grid {
        grid-template-columns: 1fr;
        margin-top: 48px;
        text-align: center;
    }

    body.pl-index .pl-index-line__grid::before {
        display: none;
    }

    body.pl-index .pl-index-line__grid li,
    body.pl-index .pl-index-line__grid li + li {
        padding: 28px 0 0;
        border-left: 0;
    }

    body.pl-index .pl-index-line__grid li + li {
        border-top: 1px solid #e8e8e8;
        margin-top: 8px;
        padding-top: 28px;
    }

    body.pl-index .pl-index-line__plan {
        margin-top: 40px;
        padding-top: 36px;
    }
}


/* ---- css/pl-landing-about.css ---- */
/* Footer sits on white scroll — give it a dark band */
body.pl-landing-about .pl-landing-v4-footer {
    background: #0e0e0e;
    margin-top: 0;
}

/* ── Hero: full-viewport display typography ── */
body.pl-landing-about .pl-about-hero {
    display: flex;
    align-items: stretch;
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100dvh;
    padding: calc(var(--pl-marketing-header-h, 72px) + clamp(28px, 5vh, 48px)) var(--pl-time-inset, clamp(20px, 5vw, 48px)) clamp(36px, 6vh, 56px);
    background: var(--pl-about-paper);
    border-bottom: 1px solid #ececec;
}

body.pl-landing-about .pl-about-hero-inner {
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    width: 100%;
    max-width: none;
    min-height: 0;
}

body.pl-landing-about .pl-about-hero-title {
    display: flex;
    flex-direction: column;
    margin: 0;
    max-width: 14ch;
    font-size: clamp(44px, 11vw, 128px);
    font-weight: 500;
    letter-spacing: -0.055em;
    line-height: 0.92;
    color: var(--pl-about-ink);
}

body.pl-landing-about .pl-about-hero-title span {
    display: block;
}

body.pl-landing-about .pl-about-hero-lead {
    margin: clamp(20px, 3vh, 32px) 0 0;
    max-width: 34em;
    font-size: clamp(16px, 1.6vw, 18px);
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 1.45;
    color: #666;
}

/* ── Shared type ── */
body.pl-landing-about .pl-about-kicker {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-about .pl-about-display {
    margin: 0 0 18px;
    font-size: clamp(28px, 4.5vw, 44px);
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1.1;
    color: var(--pl-about-ink);
}

/* ── Founder ── */
body.pl-landing-about .pl-about-founder {
    padding: clamp(64px, 10vh, 112px) var(--pl-time-inset, clamp(20px, 5vw, 48px));
    background: #fff;
    border-top: 1px solid #ececec;
}

body.pl-landing-about .pl-about-founder-grid {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 20px;
    max-width: 36em;
    margin: 0 auto;
}

body.pl-landing-about .pl-about-founder-photo {
    margin: 0;
    width: 120px;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 50%;
    background: #f0f0f0;
    flex-shrink: 0;
}

body.pl-landing-about .pl-about-founder-photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pl-landing-about .pl-about-founder-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
}

body.pl-landing-about .pl-about-founder-copy .pl-about-display {
    margin-bottom: 8px;
}

body.pl-landing-about .pl-about-founder-copy p {
    margin: 0 0 14px;
    max-width: 34em;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
}

body.pl-landing-about .pl-about-founder-copy p:last-child {
    margin-bottom: 0;
}

body.pl-landing-about .pl-about-founder-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 12px 24px;
    margin: 0 0 18px;
}

body.pl-landing-about .pl-about-founder-link {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    color: #0e0e0e;
    border-bottom: 2px solid #1774ff;
    padding-bottom: 2px;
}

body.pl-landing-about .pl-about-founder-link:hover {
    color: #1774ff;
}

body.pl-landing-about .pl-about-founder-inline {
    color: #0e0e0e;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

body.pl-landing-about .pl-about-founder-inline:hover {
    color: #1774ff;
}

/* ── Careers (inside founder) ── */
body.pl-landing-about .pl-about-careers {
    max-width: 36em;
    margin: clamp(48px, 8vh, 72px) auto 0;
    padding-top: clamp(40px, 6vh, 56px);
    border-top: 1px solid #e4e4e4;
    text-align: left;
}

body.pl-landing-about .pl-about-careers .pl-about-display {
    margin-bottom: 14px;
}

body.pl-landing-about .pl-about-careers > p {
    margin: 0 0 14px;
    font-size: 16px;
    line-height: 1.6;
    color: #555;
}

body.pl-landing-about .pl-about-careers-roles {
    margin: 28px 0 0;
    padding-top: 24px;
    border-top: 1px solid #e4e4e4;
}

body.pl-landing-about .pl-about-careers-roles-title {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-about .pl-about-careers-roles-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

body.pl-landing-about .pl-about-careers-roles-list li {
    margin: 0;
    padding: 12px 0;
    border-bottom: 1px solid #e8e8e8;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: var(--pl-about-ink);
}

body.pl-landing-about .pl-about-careers-roles-list li:last-child {
    border-bottom: none;
}

body.pl-landing-about .pl-about-careers-actions {
    margin: 28px 0 0;
}

@media (max-width: 900px) {
    body.pl-landing-about .pl-about-founder-photo {
        width: 96px;
    }
}

@media (max-width: 720px) {
    body.pl-landing-about .pl-about-hero {
        min-height: 100svh;
        padding: calc(var(--pl-marketing-header-h, 72px) + 28px) var(--pl-time-inset, clamp(20px, 5vw, 48px)) 32px;
    }

    body.pl-landing-about .pl-about-hero-title {
        max-width: none;
        font-size: clamp(40px, 12vw, 64px);
    }
}


/* ---- css/pl-offers.css ---- */
/* /pricing — tooltips and feature compare table. */

.pl-offers-proto a.pl-plan-col-select {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    box-sizing: border-box;
}

.pl-offers-proto a.pl-plan-close {
    text-decoration: none;
    line-height: 1;
}

.pl-offers-proto .pl-plan-breadcrumb a {
    color: inherit;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    padding-bottom: 2px;
}

.pl-offers-proto .pl-plan-breadcrumb a:hover {
    border-bottom-color: currentColor;
}

.pl-offers-proto .pl-plan-col-body {
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    padding: 36px 24px 28px;
    text-align: left;
}

.pl-offers-proto .pl-plan-col-name,
.pl-offers-proto .pl-plan-col-class,
.pl-offers-proto .pl-plan-col-price,
.pl-offers-proto .pl-plan-col-per {
    text-align: left;
}

.pl-offers-proto .pl-plan-col-name {
    font-size: 18px;
}

.pl-offers-proto .pl-plan-col-class {
    margin-top: 6px;
}

.pl-offers-proto .pl-plan-col-price {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 4px;
    margin-top: 14px;
}

.pl-offers-proto .pl-plan-col-per {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-highlights {
    list-style: none;
    margin: 22px 0 24px;
    padding: 18px 0 0;
    border-top: 1px solid var(--pl-line, #e4e4e4);
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

.pl-offers-proto .pl-offers-highlights li {
    position: relative;
    padding-left: 22px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--pl-ink, #0e0e0e);
}

.pl-offers-proto .pl-offers-highlights li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--pl-ink, #0e0e0e);
}

.pl-offers-proto .pl-offers-highlights li.pl-offers-highlights-title {
    padding-left: 0;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-transform: none;
    text-align: left;
    color: var(--pl-ink, #0e0e0e);
}

.pl-offers-proto .pl-offers-highlights li.pl-offers-highlights-title::before {
    content: none;
    display: none;
}

.pl-offers-proto .pl-plan-col-select {
    align-self: stretch;
    margin-top: auto;
    max-width: none;
    width: 100%;
}

.pl-offers-proto .pl-plan-table,
.pl-offers-proto .pl-plan-table tr,
.pl-offers-proto .pl-plan-table td,
.pl-offers-proto .pl-plan-table .pl-plan-feat-col {
    overflow: visible;
}

.pl-offers-proto .pl-offers-tip {
    position: relative;
    display: inline-block;
    cursor: default;
    border-bottom: 1px dashed var(--pl-muted, #8a8a8a);
    white-space: nowrap;
}

.pl-offers-proto .pl-offers-tip:hover,
.pl-offers-proto .pl-offers-tip:focus {
    color: var(--pl-ink, #0e0e0e);
    border-bottom-color: var(--pl-ink, #0e0e0e);
}

.pl-offers-proto .pl-offers-tip:focus {
    outline: none;
}

.pl-offers-proto .pl-offers-tip-pop {
    position: absolute;
    left: calc(100% + 16px);
    top: 50%;
    z-index: 40;
    width: max-content;
    max-width: 300px;
    padding: 16px 18px;
    border-radius: 8px;
    background: #fff;
    color: var(--pl-ink, #0e0e0e);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(0, 0, 0, 0.06);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-50%) translateX(6px);
    transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
    text-align: left;
}

.pl-offers-proto .pl-offers-tip-pop::before {
    content: "";
    position: absolute;
    right: 100%;
    top: 50%;
    transform: translateY(-50%);
    border: 9px solid transparent;
    border-right-color: #fff;
    filter: drop-shadow(-1px 0 0 rgba(0, 0, 0, 0.05));
}

.pl-offers-proto .pl-offers-tip-pop-title {
    display: block;
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -0.01em;
}

.pl-offers-proto .pl-offers-tip-pop-body {
    display: block;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.45;
    color: var(--pl-muted, #5c5c5c);
    white-space: pre-line;
}

.pl-offers-proto .pl-offers-tip:hover .pl-offers-tip-pop,
.pl-offers-proto .pl-offers-tip:focus .pl-offers-tip-pop,
.pl-offers-proto .pl-offers-tip:focus-within .pl-offers-tip-pop {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
}

.pl-offers-proto .pl-plan-table tr:has(.pl-offers-tip:hover),
.pl-offers-proto .pl-plan-table tr:has(.pl-offers-tip:focus-within),
.pl-offers-proto .pl-crew-include-row:has(.pl-offers-tip:hover),
.pl-offers-proto .pl-crew-include-row:has(.pl-offers-tip:focus-within) {
    position: relative;
    z-index: 5;
}

.pl-offers-proto .pl-plan-val--promo {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    line-height: 1.25;
    justify-content: center;
}

.pl-offers-proto .pl-plan-was {
    color: var(--pl-muted, #6f6f6f);
    text-decoration: line-through;
    font-weight: 400;
}

.pl-offers-proto .pl-plan-now {
    color: var(--pl-ink, #0e0e0e);
    font-weight: 600;
}

@media (max-width: 760px) {
    .pl-offers-proto .pl-plan-col-body {
        padding: 28px 20px 24px;
    }

    .pl-offers-proto .pl-offers-tip-pop {
        left: 0;
        top: calc(100% + 12px);
        max-width: min(300px, 85vw);
        transform: translateY(6px);
    }

    .pl-offers-proto .pl-offers-tip-pop::before {
        right: auto;
        left: 18px;
        top: -9px;
        transform: none;
        border: 9px solid transparent;
        border-bottom-color: #fff;
        filter: drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.05));
    }

    .pl-offers-proto .pl-offers-tip:hover .pl-offers-tip-pop,
    .pl-offers-proto .pl-offers-tip:focus .pl-offers-tip-pop,
    .pl-offers-proto .pl-offers-tip:focus-within .pl-offers-tip-pop {
        transform: translateY(0);
    }
}

/* Replacements / savings */
.pl-offers-proto .pl-offers-replace {
    margin-top: 56px;
    padding-top: 40px;
    border-top: 1px solid var(--pl-line-strong, #d4d4d4);
}

.pl-offers-proto .pl-offers-replace-head {
    max-width: 560px;
    margin-bottom: 28px;
}

.pl-offers-proto .pl-offers-replace-eyebrow {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-head h2 {
    margin: 0 0 10px;
    font-size: 26px;
    font-weight: 400;
    letter-spacing: -0.02em;
}

.pl-offers-proto .pl-offers-replace-head p {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
    gap: 28px;
    align-items: stretch;
}

.pl-offers-proto .pl-offers-replace-stack,
.pl-offers-proto .pl-offers-replace-savings {
    border: 1px solid var(--pl-line-strong, #d4d4d4);
    padding: 22px;
}

.pl-offers-proto .pl-offers-replace-savings {
    display: flex;
    flex-direction: column;
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #f5f5f5;
}

.pl-offers-proto .pl-offers-replace-savings .pl-offers-replace-stack-label {
    color: rgba(245, 245, 245, 0.55);
}

.pl-offers-proto .pl-offers-replace-stack-label {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-tools {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.pl-offers-proto .pl-offers-replace-tool {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-top: 1px solid var(--pl-line, #e4e4e4);
}

.pl-offers-proto .pl-offers-replace-tool:first-child {
    border-top: none;
    padding-top: 0;
}

.pl-offers-proto .pl-offers-replace-tool-main {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pl-offers-proto .pl-offers-replace-tool-main strong {
    font-size: 14px;
    font-weight: 600;
}

.pl-offers-proto .pl-offers-replace-tool-main span,
.pl-offers-proto .pl-offers-replace-tool-price span {
    font-size: 12px;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-tool-price {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
    text-align: right;
    flex-shrink: 0;
}

.pl-offers-proto .pl-offers-replace-tool-price strong {
    font-size: 15px;
    font-weight: 600;
}

.pl-offers-proto .pl-offers-replace-silo {
    margin: 8px 0 0;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: #9a3412;
    background: #fff7ed;
    border: 1px solid #fed7aa;
}

.pl-offers-proto .pl-offers-replace-contrast {
    margin: 10px 0 0;
    padding: 12px 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: #166534;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
}

.pl-offers-proto .pl-offers-replace-stack-total {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 18px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--pl-ink, #0e0e0e);
    font-size: 13px;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-stack-total strong {
    font-size: 28px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: var(--pl-ink, #0e0e0e);
}

.pl-offers-proto .pl-offers-replace-stack-total strong span {
    font-size: 14px;
    color: var(--pl-muted, #6f6f6f);
}

.pl-offers-proto .pl-offers-replace-vs {
    display: flex;
    flex-direction: column;
    flex: 1;
    gap: 0;
}

.pl-offers-proto .pl-offers-replace-vs-plan {
    margin-bottom: 22px;
}

.pl-offers-proto .pl-offers-replace-vs-eyebrow {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(245, 245, 245, 0.45);
}

.pl-offers-proto .pl-offers-replace-vs-name {
    margin: 0;
    font-size: 32px;
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

.pl-offers-proto .pl-offers-replace-vs-class {
    margin: 6px 0 0;
    font-size: 14px;
    color: rgba(245, 245, 245, 0.55);
}

.pl-offers-proto .pl-offers-replace-vs-math {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.pl-offers-proto .pl-offers-replace-vs-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    font-size: 14px;
    color: rgba(245, 245, 245, 0.65);
}

.pl-offers-proto .pl-offers-replace-vs-row span {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.pl-offers-proto .pl-offers-replace-vs-sub {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    color: rgba(245, 245, 245, 0.45);
}

.pl-offers-proto .pl-offers-replace-vs-seats {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 0 18px;
}

.pl-offers-proto .pl-offers-replace-vs-seat-opt {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 14px 12px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background: rgba(255, 255, 255, 0.04);
}

.pl-offers-proto .pl-offers-replace-vs-seat-opt.is-active {
    border-color: rgba(245, 245, 245, 0.45);
    background: rgba(255, 255, 255, 0.1);
}

.pl-offers-proto .pl-offers-replace-vs-seat-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(245, 245, 245, 0.5);
}

.pl-offers-proto .pl-offers-replace-vs-seat-opt strong {
    font-size: 22px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #f5f5f5;
}

.pl-offers-proto .pl-offers-replace-vs-seat-opt strong span {
    font-size: 13px;
    color: rgba(245, 245, 245, 0.5);
}

.pl-offers-proto .pl-offers-replace-vs-seat-save {
    font-size: 12px;
    line-height: 1.35;
    color: #bbf7d0;
}

.pl-offers-proto .pl-offers-replace-vs-row strong {
    font-size: 22px;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: #f5f5f5;
    flex-shrink: 0;
}

.pl-offers-proto .pl-offers-replace-vs-row strong span {
    font-size: 13px;
    color: rgba(245, 245, 245, 0.5);
}

.pl-offers-proto .pl-offers-replace-vs-row.is-stack strong {
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    color: rgba(245, 245, 245, 0.45);
}

.pl-offers-proto .pl-offers-replace-vs-row.is-pathline {
    color: #f5f5f5;
}

.pl-offers-proto .pl-offers-replace-vs-row.is-pathline strong {
    font-size: 28px;
}

.pl-offers-proto .pl-offers-replace-vs-result {
    margin: 0 0 18px;
    padding: 16px 18px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
}

.pl-offers-proto .pl-offers-replace-vs-result.is-save {
    border-color: rgba(134, 239, 172, 0.35);
    background: rgba(22, 101, 52, 0.35);
}

.pl-offers-proto .pl-offers-replace-vs-result.is-more {
    border-color: rgba(253, 186, 116, 0.4);
    background: rgba(154, 52, 18, 0.28);
}

.pl-offers-proto .pl-offers-replace-vs-save {
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.pl-offers-proto .pl-offers-replace-vs-result.is-save .pl-offers-replace-vs-save {
    color: #bbf7d0;
}

.pl-offers-proto .pl-offers-replace-vs-year {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: rgba(245, 245, 245, 0.65);
}

.pl-offers-proto .pl-offers-replace-vs-note {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
    color: rgba(245, 245, 245, 0.6);
}

.pl-offers-proto .pl-offers-replace-vs-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    width: 100%;
    padding: 14px 18px;
    border: none;
    background: #f5f5f5;
    color: #0e0e0e;
    font-size: 14px;
    font-weight: 650;
    text-decoration: none;
    text-align: center;
    transition: background 0.15s ease, color 0.15s ease;
}

.pl-offers-proto .pl-offers-replace-vs-cta:hover {
    background: #fff;
    color: #0e0e0e;
}

.pl-offers-proto .pl-offers-replace-footnote {
    margin: 16px 0 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--pl-muted, #6f6f6f);
}

@media (max-width: 900px) {
    .pl-offers-proto .pl-offers-replace-layout {
        grid-template-columns: 1fr;
    }
}


/* ---- css/pl-offers-crew.css ---- */
/* /pricing — white, carrier-simple, seat-first. */

.pl-crew {
    --ink: #0e0e0e;
    --muted: #5c5c5c;
    --line: #e6e6e6;
    --line-strong: #d0d0d0;
    --paper: #ffffff;
    --wash: #f7f7f7;
    --accent: var(--ink);
    --win: #0b7a45;
    --win-bg: #eefbf3;
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.pl-crew-hero a,
.pl-crew-features a,
.pl-crew-fine a {
    color: inherit;
}

.pl-crew-top {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 14px 28px;
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--line);
}

.pl-crew-logo {
    display: inline-flex;
    align-items: center;
}

.pl-crew-logo img {
    height: 22px;
    width: auto;
}

.pl-crew-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--muted);
}

.pl-crew-nav a {
    text-decoration: none;
}

.pl-crew-nav a:hover {
    color: var(--ink);
}

.pl-crew-nav .is-here {
    color: var(--ink);
    font-weight: 600;
}

.pl-crew-top-cta {
    margin-left: auto;
    padding: 9px 14px;
    background: var(--ink);
    color: #fff;
    font-size: 13px;
    font-weight: 650;
    text-decoration: none;
}

.pl-crew-top-cta:hover {
    background: #222;
}

/* Hero — brand + rate card */
.pl-crew-hero {
    max-width: 880px;
    margin: 0 auto;
    padding: 48px 28px 56px;
}

.pl-crew-kicker,
.pl-crew-section-kicker {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--muted);
}

.pl-crew-brand {
    margin: 0;
    font-size: clamp(52px, 11vw, 88px);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.pl-crew-lede {
    margin: 14px 0 0;
    max-width: 20ch;
    font-size: clamp(20px, 3vw, 28px);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--muted);
}

/* Seat calculator (Just me / Me + 1 / A team) */
.pl-crew-hero--calc {
    padding-bottom: 64px;
}

.pl-crew-calc-choices {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 28px;
}

.pl-crew-calc-choice {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-height: 52px;
    padding: 12px 16px;
    border: 2px solid var(--ink);
    background: #fff;
    color: var(--ink);
    font-size: clamp(16px, 2.8vw, 18px);
    font-weight: 650;
    letter-spacing: -0.02em;
    cursor: pointer;
    text-align: left;
    transition: background 120ms ease, color 120ms ease;
}

.pl-crew-calc-choice:hover,
.pl-crew-calc-choice.is-on {
    background: var(--ink);
    color: #fff;
}

.pl-crew-calc-choice small {
    flex-shrink: 0;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    opacity: 0.55;
}

.pl-crew-calc-choice small s {
    margin-right: 6px;
    font-weight: 500;
    opacity: 0.7;
    text-decoration: line-through;
}

.pl-crew-calc-choice:hover small,
.pl-crew-calc-choice.is-on small {
    opacity: 0.75;
}

.pl-crew-calc-price {
    margin-top: 28px;
    padding-top: 24px;
    border-top: 1px solid var(--line);
}

.pl-crew-calc-price-label {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
}

.pl-crew-calc-price-amt {
    margin: 0;
    font-size: clamp(56px, 12vw, 80px);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 0.95;
}

.pl-crew-price-was {
    display: block;
    margin-bottom: 6px;
    font-size: 0.28em;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--muted);
    text-decoration: line-through;
}

.pl-crew-calc-price-amt .pl-crew-rate-per {
    margin-left: 2px;
    font-size: 0.3em;
    font-weight: 600;
    color: var(--muted);
    vertical-align: 0.4em;
}

.pl-crew-calc-price-break {
    margin: 12px 0 0;
    font-size: 15px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-crew-calc-seats {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
    margin-top: 20px;
}

.pl-crew-calc-seats[hidden] {
    display: none !important;
}

.pl-crew-hero--calc .pl-crew-includes {
    margin-top: 32px;
}

.pl-crew-pitch {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 12px;
    align-items: stretch;
    margin-top: 28px;
    padding: 0;
}

.pl-crew-pitch-item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 18px 18px 16px;
    border: 2px solid var(--ink);
    background: #fff;
}

.pl-crew-pitch-item strong {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

.pl-crew-pitch-item strong span {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--muted);
}

.pl-crew-pitch-item > span {
    font-size: 13px;
    line-height: 1.35;
    color: var(--muted);
}

.pl-crew-pitch-plus {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 700;
    color: var(--ink);
}

.pl-crew-rate {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.9fr);
    gap: 0;
    margin-top: 16px;
    border: 2px solid var(--ink);
    background: var(--paper);
}

.pl-crew-rate-main {
    padding: 28px 28px 26px;
    border-right: 1px solid var(--line-strong);
}

.pl-crew-rate-label {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--muted);
}

.pl-crew-rate-amt {
    margin: 0;
    font-size: clamp(52px, 9vw, 72px);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1;
}

[data-crew-total].is-tick {
    display: inline-block;
    animation: pl-crew-tick 0.28s ease;
}

.pl-crew-rate-per {
    margin-left: 4px;
    font-size: 0.34em;
    font-weight: 600;
    letter-spacing: 0;
    color: var(--muted);
    vertical-align: 0.4em;
}

.pl-crew-rate-break {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-crew-control {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    padding: 24px;
    background: var(--wash);
    text-align: center;
}

.pl-crew-control-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--muted);
}

.pl-crew-stepper {
    display: inline-flex;
    align-items: stretch;
    border: 2px solid var(--ink);
    background: #fff;
    width: fit-content;
}

.pl-crew-step {
    width: 48px;
    height: 48px;
    border: none;
    background: #fff;
    color: var(--ink);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.pl-crew-step:hover {
    background: var(--ink);
    color: #fff;
}

.pl-crew-seats {
    width: 64px;
    height: 48px;
    border: none;
    border-left: 2px solid var(--ink);
    border-right: 2px solid var(--ink);
    background: #fff;
    color: var(--ink);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.03em;
    text-align: center;
    -moz-appearance: textfield;
}

.pl-crew-seats::-webkit-outer-spin-button,
.pl-crew-seats::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.pl-crew-control-hint {
    margin: 0;
    font-size: 13px;
    line-height: 1.35;
    color: var(--muted);
}

.pl-crew-includes {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 20px;
}

.pl-crew-includes li {
    position: relative;
    padding-left: 18px;
    font-size: 14px;
    line-height: 1.35;
    color: var(--ink);
}

.pl-crew-includes li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45em;
    width: 8px;
    height: 8px;
    background: var(--ink);
}

.pl-crew-hero-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.pl-crew a.pl-crew-btn,
.pl-crew a.pl-crew-top-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0e0e0e;
    color: #fff !important;
    text-decoration: none;
}

.pl-crew a.pl-crew-btn:hover,
.pl-crew a.pl-crew-top-cta:hover {
    background: #222;
    color: #fff !important;
}

.pl-crew-btn {
    padding: 14px 22px;
    font-size: 14px;
    font-weight: 700;
}

.pl-crew-top-cta {
    margin-left: auto;
    padding: 9px 14px;
    font-size: 13px;
    font-weight: 650;
}

.pl-crew-btn-ghost {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    border: 2px solid var(--ink);
    background: #fff;
    color: var(--ink);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.pl-crew-btn-ghost:hover {
    background: var(--wash);
}

.pl-crew-features {
    max-width: 880px;
    margin: 0 auto;
    padding: 48px 28px 24px;
    border-top: 1px solid var(--line);
}

.pl-crew-features-head {
    max-width: 520px;
    margin-bottom: 28px;
}

#whats-included {
    scroll-margin-top: calc(var(--pl-marketing-header-h, 72px) + 16px);
}

.pl-crew-features-head h2 {
    margin: 0 0 10px;
    font-size: clamp(26px, 3.5vw, 34px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.12;
}

.pl-crew-features-head p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--muted);
}

.pl-crew-include-list {
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.pl-crew-include-group h3 {
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--ink);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.pl-crew-include-group ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pl-crew-include-row {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid var(--line);
    font-size: 14px;
    overflow: visible;
}

.pl-crew-include-row.is-sub .pl-crew-include-label {
    position: relative;
    padding-left: 22px;
    color: var(--muted);
}

.pl-crew-include-row.is-sub .pl-plan-feat-arrow {
    position: absolute;
    left: 0;
    top: 0.12em;
    color: var(--muted);
    line-height: 1;
}

.pl-crew-include-label {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    flex: 1 1 auto;
    min-width: min-content;
}

.pl-crew-include-val {
    flex-shrink: 0;
    text-align: right;
    font-weight: 600;
}

.pl-pricing-compare-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    text-decoration: none;
}

.pl-pricing-compare-link:hover {
    color: var(--ink);
}

.pl-pricing-compare-link .pl-link-out-icon {
    flex-shrink: 0;
}

.pl-crew-include-val .pl-plan-val--promo {
    justify-content: flex-end;
}

.pl-crew-include-notes {
    margin: 18px 0 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--muted);
}

.pl-crew-fine {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 28px 64px;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-start;
    gap: 12px 24px;
    font-size: 12px;
    line-height: 1.45;
    color: var(--muted);
    text-align: left;
}

.pl-crew-fine a {
    font-weight: 650;
    color: var(--ink);
    text-decoration: none;
    border-bottom: 1px solid var(--ink);
}

.pl-crew-fine a:hover {
    color: var(--ink);
    border-bottom-color: var(--ink);
}

.pl-crew-fine-notes {
    flex-basis: 100%;
    margin: 0;
    padding-top: 24px;
    border-top: 1px solid var(--line);
}

.pl-crew-fine sup {
    font-size: 0.75em;
    line-height: 0;
}

.pl-crew .pl-plan-addon-tag {
    display: inline-block;
    margin-left: 4px;
    padding: 3px 8px;
    border-radius: 6px;
    background: var(--ink);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0.02em;
    vertical-align: middle;
}

.pl-crew .pl-plan-check {
    color: var(--ink);
    font-size: 15px;
}

.pl-crew .pl-plan-val {
    font-size: 13px;
    color: var(--ink);
}

.pl-landing.pl-crew .pl-crew-hero {
    padding-top: calc(var(--pl-marketing-header-h, 72px) + 48px);
}

.pl-landing.pl-crew .pl-crew-fine {
    padding-bottom: 32px;
}

.pl-crew-hero--products {
    max-width: 1120px;
    padding-bottom: 40px;
}

.pl-crew-pricing {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 32px;
}

.pl-crew-products {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch;
}

.pl-crew-products--plans {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.pl-crew-product {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 22px 20px 20px;
    border: 1px solid var(--line-strong);
    background: #fff;
}

.pl-crew-product.is-featured {
    position: relative;
    border: 2px solid var(--ink);
    padding-top: 40px;
}

.pl-crew-product-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    padding: 5px 8px;
    background: #ffe566;
    color: #0e0e0e;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.25;
}

.pl-crew-product-was {
    margin-right: 6px;
    color: #c43a3a;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: -0.03em;
    text-decoration: line-through;
}

.pl-crew-product.is-large .pl-crew-product-was {
    font-size: 24px;
}

.pl-crew-product-price-note {
    margin: 6px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-crew-product.is-large {
    padding: 32px 28px 28px;
}

.pl-crew-product.is-featured.is-large {
    padding-top: 48px;
}

.pl-crew-product-name {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-crew-product.is-large .pl-crew-product-name {
    font-size: 26px;
}

.pl-crew-product-tag {
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-crew-product.is-large .pl-crew-product-tag {
    font-size: 15px;
    line-height: 1.45;
}

.pl-crew-product-price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 16px 0 0;
}

.pl-crew-product-amt {
    font-size: 32px;
    font-weight: 600;
    letter-spacing: -0.04em;
}

.pl-crew-product.is-large .pl-crew-product-amt {
    font-size: 48px;
}

.pl-crew-product-per {
    font-size: 13px;
    color: var(--muted);
}

.pl-crew-product.is-large .pl-crew-product-per {
    font-size: 15px;
}

.pl-crew-product-list {
    list-style: none;
    margin: 18px 0 0;
    padding: 16px 0 0;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.pl-crew-product.is-large .pl-crew-product-list {
    margin-top: 22px;
    padding-top: 20px;
    gap: 10px;
}

.pl-crew-product-list li {
    position: relative;
    padding-left: 16px;
    font-size: 13px;
    line-height: 1.35;
}

.pl-crew-product.is-large .pl-crew-product-list li {
    font-size: 15px;
    padding-left: 18px;
}

.pl-crew-product-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.45em;
    width: 7px;
    height: 7px;
    background: var(--ink);
}

.pl-crew-product .pl-offers-include-btn {
    margin-top: 16px;
    align-self: flex-start;
    font-family: inherit;
}

.pl-crew-product .pl-crew-btn {
    width: 100%;
    margin-top: 16px;
    box-sizing: border-box;
}

.pl-crew a.pl-crew-btn-ghost {
    background: #fff;
    color: var(--ink) !important;
}

.pl-crew a.pl-crew-btn-ghost:hover {
    background: var(--wash);
    color: var(--ink) !important;
}

@keyframes pl-crew-tick {
    from {
        opacity: 0.4;
        transform: translateY(6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 760px) {
    .pl-crew-top {
        padding: 12px 16px;
    }

    .pl-crew-top-cta {
        display: none;
    }

    .pl-crew-hero,
    .pl-crew-features,
    .pl-crew-fine {
        padding-left: 16px;
        padding-right: 16px;
    }

    .pl-crew-pitch {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .pl-crew-pitch-plus {
        padding: 2px 0;
        font-size: 20px;
    }

    .pl-crew-rate {
        grid-template-columns: 1fr;
    }

    .pl-crew-rate-main {
        border-right: none;
        border-bottom: 1px solid var(--line-strong);
    }

    .pl-crew-includes {
        grid-template-columns: 1fr;
    }

    .pl-crew-products {
        grid-template-columns: 1fr;
    }

    .pl-crew-calc-choice {
        min-height: 48px;
        padding: 12px 14px;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }
}


/* ---- css/pl-pricing-page.css ---- */
/* /pricing — plan cards, add-ons, and compare table. */

.pl-pricing-page .pl-crew-hero {
    max-width: 1180px;
}

.pl-pricing-page .pl-crew-hero--products {
    padding-bottom: 0;
}

.pl-pricing-page .pl-crew-brand {
    font-size: clamp(36px, 6vw, 52px);
}

.pl-pricing-page .pl-crew-lede {
    max-width: 36ch;
    font-size: 22px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.45;
}

.pl-pricing-page .pl-pricing-plan-note--quiet {
    margin-top: 4px;
    color: var(--muted);
    font-weight: 500;
}

/* Pathline Intelligence — minimal row + color flare */
.pl-pricing-page .pl-pricing-intel-packs {
    max-width: 1180px;
    margin: 0 auto;
    padding: 28px 28px 8px;
    width: 100%;
    box-sizing: border-box;
}

.pl-pricing-page .pl-pricing-intel-packs-drop {
    border: 1px solid var(--line);
    background: #fff;
    border-left: 3px solid #1774ff;
}

.pl-pricing-page .pl-pricing-intel-packs-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 22px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.pl-pricing-page .pl-pricing-intel-packs-summary::-webkit-details-marker {
    display: none;
}

.pl-pricing-page .pl-pricing-intel-packs-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pl-pricing-page .pl-pricing-intel-packs-name {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-intel-packs-lede {
    font-size: 14px;
    font-weight: 500;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-intel-packs-chevron {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--muted);
    border-bottom: 2px solid var(--muted);
    transform: rotate(45deg);
    transition: transform 0.15s ease;
    margin-top: -4px;
}

.pl-pricing-page .pl-pricing-intel-packs-drop[open] .pl-pricing-intel-packs-chevron {
    transform: rotate(225deg);
    margin-top: 4px;
}

.pl-pricing-page .pl-pricing-intel-packs-body {
    padding: 0 22px 20px;
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-intel-packs-row {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    margin-top: 16px;
    border: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-intel-pack {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    padding: 18px 20px;
    border-left: 1px solid var(--line);
    min-width: 0;
}

.pl-pricing-page .pl-pricing-intel-pack:first-child {
    border-left: none;
}

.pl-pricing-page .pl-pricing-intel-pack.is-included {
    background: rgba(23, 116, 255, 0.06);
}

.pl-pricing-page .pl-pricing-intel-pack.is-included span {
    color: #1774ff;
}

.pl-pricing-page .pl-pricing-intel-pack strong {
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.1;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-intel-pack span {
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
    letter-spacing: -0.01em;
}

@media (max-width: 760px) {
    .pl-pricing-page .pl-pricing-intel-packs {
        padding: 20px 20px 4px;
    }

    .pl-pricing-page .pl-pricing-intel-packs-summary {
        padding: 16px 18px;
    }

    .pl-pricing-page .pl-pricing-intel-packs-body {
        padding: 0 18px 16px;
    }

    .pl-pricing-page .pl-pricing-intel-packs-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pl-pricing-page .pl-pricing-intel-pack {
        padding: 14px 16px;
        border-left: none;
        border-top: 1px solid var(--line);
    }

    .pl-pricing-page .pl-pricing-intel-pack:nth-child(odd) {
        border-right: 1px solid var(--line);
    }

    .pl-pricing-page .pl-pricing-intel-pack:first-child,
    .pl-pricing-page .pl-pricing-intel-pack:nth-child(2) {
        border-top: none;
    }

    .pl-pricing-page .pl-pricing-intel-pack:last-child:nth-child(odd) {
        grid-column: 1 / -1;
        border-right: none;
    }
}

.pl-pricing-page .pl-pricing-extras {
    max-width: 1180px;
    margin: 0 auto;
    padding: 40px 28px;
    width: 100%;
    box-sizing: border-box;
}

.pl-pricing-page .pl-pricing-extras-head {
    margin: 32px 0 20px;
}

.pl-pricing-page .pl-pricing-extras-head h2 {
    margin: 0;
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 700;
    letter-spacing: -0.035em;
}

.pl-pricing-page .pl-pricing-extras-note {
    margin: 8px 0 0;
    font-size: 15px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-extras-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
    align-items: start;
}

.pl-pricing-page .pl-pricing-extras .pl-pricing-addon {
    margin-top: 0;
    grid-column: auto;
}

.pl-pricing-page .pl-pricing-extras > .pl-pricing-studio {
    margin-top: 0;
}

.pl-pricing-page .pl-pricing-extras > .pl-pricing-addon .pl-pricing-addon-drop-summary {
    padding: 20px 28px;
}

.pl-pricing-page .pl-pricing-extras > .pl-pricing-addon .pl-pricing-addon-drop-name {
    font-size: 22px;
}

.pl-pricing-page .pl-pricing-addon-drop-summary::marker {
    display: none;
    content: '';
}

.pl-pricing-page .pl-pricing-addon-drop-body {
    padding: 0 28px 20px;
}

.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-addon-drop-lede,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-archer-note,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-credits,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-crew-product-list {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}

.pl-pricing-page .pl-pricing-studio-price {
    margin: 0 0 12px;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-pricing-page .pl-pricing-studio-price strong {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-pricing-page .pl-pricing-studio-price span {
    margin-left: 4px;
    font-weight: 500;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-studio-start {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 4px;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--ink);
    background: #fff;
    color: var(--ink);
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    text-decoration: none;
    width: auto;
    max-width: max-content;
    box-sizing: border-box;
}

.pl-pricing-page .pl-pricing-studio-start:hover {
    background: #fff;
}

.pl-pricing-page .pl-pricing-extras > .pl-pricing-archer {
    margin-top: 0;
    width: 100%;
}

.pl-pricing-page .pl-pricing-extras > .pl-pricing-studio .pl-pricing-addon-drop-copy {
    flex-wrap: nowrap;
}

.pl-pricing-page .pl-pricing-studio .pl-crew-product-list,
.pl-pricing-page .pl-pricing-extras .pl-pricing-addon-drop .pl-crew-product-list,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-crew-product-list {
    margin: 0 0 16px;
    padding-top: 0;
    border-top: none;
}

.pl-pricing-page-sub {
    margin: 16px 0 0;
    max-width: 42ch;
    font-size: 16px;
    line-height: 1.5;
    color: var(--muted);
}

.pl-pricing-page .pl-crew-pricing {
    margin-top: 36px;
}

.pl-pricing-page .pl-crew-products--ladder {
    gap: 16px;
}

.pl-pricing-page .pl-crew-product {
    padding: 32px 28px 28px;
    border: 1px solid var(--line);
    border-radius: 0;
    background: #fff;
}

.pl-pricing-page .pl-crew-product.is-featured {
    border: 1.5px solid var(--ink);
    background: #fff;
    padding-top: 32px;
}

.pl-pricing-page .pl-crew-product-badge {
    top: 16px;
    right: 16px;
    border-radius: 0;
    padding: 6px 10px;
    background: #2563eb;
    color: #fff;
}

.pl-pricing-page .pl-crew-product-name {
    font-size: 26px;
}

.pl-pricing-page .pl-crew-product-tag {
    min-height: 3.2em;
    margin-top: 8px;
    max-width: 28ch;
    font-size: 17px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-plan-price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
}

.pl-pricing-page .pl-pricing-plan-price .pl-crew-product-was {
    font-size: clamp(36px, 4.5vw, 44px);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
    color: var(--muted);
    text-decoration: line-through;
}

.pl-pricing-page .pl-pricing-plan-price .pl-crew-product-amt {
    font-size: clamp(36px, 4.5vw, 44px);
}

.pl-pricing-page .pl-pricing-plan-price .pl-crew-product-per {
    font-size: 18px;
    font-weight: 600;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-plan-note {
    font-size: 15px;
}

.pl-pricing-page .pl-pricing-plan-note--then {
    margin-top: 10px;
    color: var(--muted);
    font-weight: 500;
}

.pl-pricing-page .pl-pricing-cta {
    margin-top: 22px;
    border-radius: 0;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    font-weight: 650;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    --mx: 50%;
    --my: 50%;
    --pl-grow-flash: #2563eb;
    transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease;
}

/* Color → black bubble from pointer — same as product grow-split panes */
.pl-pricing-page .pl-pricing-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--pl-grow-flash);
    clip-path: circle(0% at var(--mx) var(--my));
    transition:
        clip-path 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1) 0.12s;
}

.pl-pricing-page .pl-pricing-cta.is-hot::before {
    clip-path: circle(160% at var(--mx) var(--my));
}

.pl-pricing-page .pl-pricing-cta.is-ink::before {
    background-color: #0e0e0e;
}

.pl-pricing-page .pl-pricing-cta.is-leaving::before {
    clip-path: circle(0% at var(--mx) var(--my));
    background-color: var(--pl-grow-flash);
    transition:
        clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.2s ease;
}

.pl-pricing-page .pl-pricing-cta > * {
    position: relative;
    z-index: 1;
}

@media (prefers-reduced-motion: reduce) {
    .pl-pricing-page .pl-pricing-cta::before {
        transition: none;
    }

    .pl-pricing-page .pl-pricing-cta.is-hot::before {
        clip-path: none;
        background: #0e0e0e;
    }
}

body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta {
    border: 1px solid var(--ink);
    background: #fff;
    color: var(--ink) !important;
}

body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta:hover,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta:hover,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta:hover:not(:disabled) {
    background: #fff;
}

body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-hot,
body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-hot:hover,
body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-ink,
body.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-ink:hover,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-hot,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-hot:hover,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-ink,
.pl-pricing-page a.pl-crew-btn.pl-pricing-cta.is-ink:hover,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta.is-hot,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta.is-hot:hover,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta.is-ink,
.pl-pricing-page button.pl-crew-btn.pl-pricing-cta.is-ink:hover,
.pl-pricing-page .pl-pricing-cta.is-hot,
.pl-pricing-page .pl-pricing-cta.is-hot:hover,
.pl-pricing-page .pl-pricing-cta.is-ink,
.pl-pricing-page .pl-pricing-cta.is-ink:hover {
    color: #fff !important;
    border-color: #0e0e0e;
}

body.pl-pricing-page .pl-crew-product.is-featured a.pl-crew-btn.pl-pricing-cta,
.pl-pricing-page .pl-crew-product.is-featured a.pl-crew-btn.pl-pricing-cta,
.pl-pricing-page .pl-crew-product.is-featured button.pl-crew-btn.pl-pricing-cta {
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #fff !important;
}

body.pl-pricing-page .pl-crew-product.is-featured a.pl-crew-btn.pl-pricing-cta:hover,
.pl-pricing-page .pl-crew-product.is-featured a.pl-crew-btn.pl-pricing-cta:hover,
.pl-pricing-page .pl-crew-product.is-featured button.pl-crew-btn.pl-pricing-cta:hover:not(:disabled) {
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #fff !important;
}

.pl-pricing-page .pl-pricing-fees,
.pl-pricing-page .pl-pricing-includes {
    margin-top: 28px;
    padding-top: 22px;
    border-top: none;
}

.pl-pricing-page .pl-pricing-section-title {
    margin-bottom: 14px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-fees-row dt,
.pl-pricing-page .pl-pricing-fees-row dd {
    font-size: 16px;
}

.pl-pricing-page .pl-crew-product-list {
    gap: 12px;
}

.pl-pricing-page .pl-crew-product-list li {
    padding-left: 22px;
    font-size: 16px;
    line-height: 1.45;
}

.pl-pricing-page .pl-crew-product-list li::before {
    content: "✓";
    top: 0;
    width: auto;
    height: auto;
    background: none;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.45;
    color: var(--ink);
}

.pl-pricing-page .pl-crew-product-list li.is-sub {
    padding-left: 38px;
    color: var(--muted);
    font-size: 15px;
}

.pl-pricing-page .pl-crew-product-list li.is-sub::before {
    content: none;
}

.pl-pricing-page .pl-crew-product-list li.is-sub .pl-plan-feat-arrow {
    position: absolute;
    left: 22px;
    top: 0.15em;
    color: var(--muted);
    line-height: 1;
}

.pl-pricing-page .pl-crew-product-list li.pl-pricing-intel-drop {
    padding-left: 0;
}

.pl-pricing-page .pl-crew-product-list li.pl-pricing-intel-drop::before {
    display: none;
}

.pl-pricing-page .pl-pricing-intel {
    margin: 0;
}

.pl-pricing-page .pl-pricing-intel-summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 0;
    cursor: pointer;
    list-style: none;
    user-select: none;
    position: relative;
}

.pl-pricing-page .pl-pricing-intel-summary::-webkit-details-marker {
    display: none;
}

.pl-pricing-page .pl-pricing-intel-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    color: #4f46e5;
}

.pl-pricing-page .pl-pricing-intel-icon svg {
    display: block;
    width: 14px;
    height: 14px;
}

.pl-pricing-page .pl-pricing-intel-name {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.45;
}

.pl-pricing-page .pl-pricing-intel-chevron {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-right: 1.5px solid var(--muted);
    border-bottom: 1.5px solid var(--muted);
    transform: rotate(45deg);
    transition: transform 0.15s ease;
    margin-top: -4px;
}

.pl-pricing-page .pl-pricing-intel[open] .pl-pricing-intel-chevron {
    transform: rotate(-135deg);
    margin-top: 2px;
}

.pl-pricing-page .pl-pricing-intel-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 10px 0 2px;
    padding: 0 0 0 22px;
    list-style: none;
    overflow: visible;
}

.pl-pricing-page .pl-pricing-intel-list li {
    position: relative;
    padding-left: 14px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
    overflow: visible;
}

.pl-pricing-page .pl-pricing-intel-list li::before {
    content: "↳";
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    height: auto;
    background: none;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-intel-list .pl-offers-tip {
    color: inherit;
}

.pl-pricing-page .pl-pricing-compare {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 28px;
    border-top: none;
}

.pl-pricing-page .pl-crew-fine {
    max-width: 1180px;
    margin: 0 auto;
    padding: 40px 28px 24px;
    display: block;
    text-align: left;
}

.pl-pricing-page .pl-crew-fine p {
    margin: 0;
    max-width: none;
    text-align: left;
    font-size: 16px;
    line-height: 1.5;
}

.pl-pricing-page .pl-crew-fine-notes {
    margin-top: 16px;
    padding-top: 16px;
}

.pl-pricing-page .pl-pricing-faq {
    max-width: 1180px;
    margin: 0 auto;
    padding: 24px 28px 72px;
    width: 100%;
    box-sizing: border-box;
}

.pl-pricing-page .pl-pricing-faq h2 {
    margin: 0 0 20px;
    font-size: clamp(18px, 2.2vw, 22px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.12;
}

.pl-pricing-page .pl-pricing-faq-list {
    border-top: 1px solid var(--line, #e2e2e2);
}

.pl-pricing-page .pl-pricing-faq-item {
    border-bottom: 1px solid var(--line, #e2e2e2);
}

.pl-pricing-page .pl-pricing-faq-item summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    padding: 20px 40px 20px 0;
    font-size: clamp(18px, 2vw, 20px);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.35;
}

.pl-pricing-page .pl-pricing-faq-item summary::-webkit-details-marker {
    display: none;
}

.pl-pricing-page .pl-pricing-faq-item summary::after {
    content: "";
    position: absolute;
    right: 4px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 1.5px solid #888;
    border-bottom: 1.5px solid #888;
    transform: translateY(-65%) rotate(45deg);
    transition: transform 0.2s ease;
}

.pl-pricing-page .pl-pricing-faq-item[open] summary::after {
    transform: translateY(-20%) rotate(225deg);
}

.pl-pricing-page .pl-pricing-faq-item p {
    margin: 0 0 20px;
    max-width: none;
    padding-right: 48px;
    font-size: clamp(16px, 1.6vw, 18px);
    line-height: 1.55;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-compare-head {
    padding: 0;
    margin-bottom: 0;
    border-bottom: none;
}

.pl-pricing-page .pl-pricing-compare-sticky-feat h2 {
    margin: 0;
    font-size: clamp(18px, 2.2vw, 22px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.12;
    text-align: left;
}

.pl-pricing-page .pl-pricing-compare-sticky {
    position: sticky;
    top: var(--pl-marketing-header-h, 72px);
    z-index: 40;
    margin: 0 0 8px;
    padding: 12px 0 14px;
    background: #fff;
    border-bottom: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-compare-sticky-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) repeat(3, minmax(0, 16.666%));
    align-items: center;
    gap: 0;
    width: 100%;
    padding: 0;
    box-sizing: border-box;
}

.pl-pricing-page .pl-pricing-compare-accordion {
    border: none;
    border-bottom: none;
}

.pl-pricing-page .pl-pricing-compare-accordion + .pl-pricing-compare-accordion {
    margin-top: 28px;
}

.pl-pricing-page .pl-pricing-compare-accordion-title {
    padding: 18px 0 8px;
    border-bottom: none;
    font-size: 18px;
}

.pl-pricing-page .pl-pricing-compare-accordion-body .pl-pricing-compare-table tbody tr:last-child th,
.pl-pricing-page .pl-pricing-compare-accordion-body .pl-pricing-compare-table tbody tr:last-child td {
    border-bottom: none;
}

.pl-pricing-page .pl-pricing-compare-accordion-body {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

.pl-pricing-page .pl-pricing-compare-table {
    font-size: 16px;
}

.pl-pricing-page .pl-pricing-compare-table .pl-pricing-compare-feat {
    padding-left: 0;
    text-align: left;
}

.pl-pricing-page .pl-pricing-compare-feat-label.is-sub {
    font-size: 15px;
}

.pl-pricing-page .pl-pricing-compare-sticky-feat {
    min-width: 0;
}

.pl-pricing-page .pl-pricing-compare-sticky-plan {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    text-align: center;
    padding: 0 8px;
}

.pl-pricing-page .pl-pricing-compare-sticky-name {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-compare-sticky-price {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.1;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-compare-sticky-was {
    margin-right: 6px;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    color: var(--muted);
    text-decoration: line-through;
}

.pl-pricing-page .pl-pricing-compare-sticky-price .pl-pricing-compare-sticky-per {
    margin-left: 1px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-compare-sticky-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 4px;
    min-height: 36px;
    padding: 0 16px;
    border: 1px solid var(--ink);
    background: #fff;
    color: var(--ink);
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.01em;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.pl-pricing-page .pl-pricing-compare-sticky-cta:hover {
    background: #fff;
    border-color: var(--ink);
}

.pl-pricing-page .pl-pricing-compare-sticky-plan.is-featured .pl-pricing-compare-sticky-cta {
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #fff;
}

.pl-pricing-page .pl-pricing-compare-sticky-plan.is-featured .pl-pricing-compare-sticky-cta:hover {
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #fff;
}

.pl-pricing-page .pl-pricing-compare-sticky-cta.is-hot,
.pl-pricing-page .pl-pricing-compare-sticky-cta.is-hot:hover,
.pl-pricing-page .pl-pricing-compare-sticky-cta.is-ink,
.pl-pricing-page .pl-pricing-compare-sticky-cta.is-ink:hover,
.pl-pricing-page .pl-pricing-studio-start.is-hot,
.pl-pricing-page .pl-pricing-studio-start.is-hot:hover,
.pl-pricing-page .pl-pricing-studio-start.is-ink,
.pl-pricing-page .pl-pricing-studio-start.is-ink:hover {
    color: #fff !important;
    border-color: #0e0e0e;
}

.pl-pricing-page .pl-pricing-compare-sticky-plan.is-featured .pl-pricing-compare-sticky-name {
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-compare:has(.pl-pricing-compare-sticky) .pl-pricing-compare-table thead {
    display: none;
}

@media (max-width: 760px) {
    .pl-pricing-page .pl-pricing-compare-sticky-grid {
        grid-template-columns: minmax(48px, 0.7fr) repeat(3, minmax(0, 1fr));
        padding: 0 10px;
    }

    .pl-pricing-page .pl-pricing-compare-sticky-price {
        font-size: 18px;
    }

    .pl-pricing-page .pl-pricing-compare-sticky-cta {
        min-height: 32px;
        padding: 0 10px;
        font-size: 12px;
    }

    .pl-pricing-page .pl-pricing-extras {
        padding-left: 16px;
        padding-right: 16px;
    }
}

.pl-pricing-page .pl-pricing-addon {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    gap: 28px;
    margin-top: 4px;
    padding: 32px;
    border: 1px solid var(--line);
    border-radius: 0;
    background: #fff;
}

.pl-pricing-page .pl-pricing-addon-top {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px 40px;
}

.pl-pricing-page .pl-pricing-addon-copy {
    min-width: 0;
    max-width: 40rem;
}

.pl-pricing-page .pl-pricing-addon-kicker {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-name {
    margin: 10px 0 0;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.1;
}

.pl-pricing-page .pl-pricing-addon-lede {
    margin: 12px 0 0;
    max-width: 46ch;
    font-size: 16px;
    line-height: 1.5;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-price {
    margin: 0;
    flex: 0 0 auto;
    text-align: right;
}

.pl-pricing-page .pl-pricing-addon-amt {
    font-size: clamp(36px, 5vw, 48px);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
}

.pl-pricing-page .pl-pricing-addon-per {
    margin-left: 6px;
    font-size: 16px;
    font-weight: 600;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-perks {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    padding: 22px 0 0;
    list-style: none;
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-addon-perks li {
    padding: 0 20px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.35;
    border-left: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-addon-perks li:first-child {
    padding-left: 0;
    border-left: none;
}

.pl-pricing-page .pl-pricing-addons {
    background: #fafafa;
}

.pl-pricing-page .pl-pricing-addon--solo {
    gap: 0;
    margin-top: 0;
    padding: 0;
    background: #fff;
}

.pl-pricing-page .pl-pricing-addon--solo .pl-pricing-addon-drop {
    border-top: none;
}

.pl-pricing-page .pl-pricing-addon-stack {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid var(--line);
    background: #fff;
}

.pl-pricing-page .pl-pricing-addon-item {
    padding: 22px 20px 18px;
}

.pl-pricing-page .pl-pricing-addon-item + .pl-pricing-addon-drop,
.pl-pricing-page .pl-pricing-addon-drop + .pl-pricing-addon-item {
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-addon-item-head {
    margin-bottom: 14px;
}

.pl-pricing-page .pl-pricing-addon-item-name {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-pricing-page .pl-pricing-addon-item-tag {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 1.35;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-item .pl-pricing-addon-perks {
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-archer {
    position: relative;
    background: #fff;
    overflow: hidden;
}

.pl-pricing-page .pl-pricing-archer::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    pointer-events: none;
    background: linear-gradient(180deg, #4f46e5 0%, #38bdf8 55%, #0f172a 100%);
    background-size: 100% 220%;
    animation: pl-archer-stroke 14s ease-in-out infinite;
}

@keyframes pl-archer-stroke {
    0%,
    100% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 0% 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-pricing-page .pl-pricing-archer::before {
        animation: none;
        background-size: 100% 100%;
    }
}

.pl-pricing-page .pl-pricing-archer-table-wrap {
    overflow-x: auto;
    margin: 4px 0 12px;
}

.pl-pricing-page .pl-pricing-archer-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    table-layout: fixed;
}

.pl-pricing-page .pl-pricing-archer-table th,
.pl-pricing-page .pl-pricing-archer-table td {
    padding: 12px 10px;
    text-align: center;
    vertical-align: middle;
    font-size: 13px;
    line-height: 1.35;
}

.pl-pricing-page .pl-pricing-archer-table thead th {
    padding-bottom: 16px;
    font-weight: 500;
}

.pl-pricing-page .pl-pricing-archer-table thead th:first-child,
.pl-pricing-page .pl-pricing-archer-table tbody th {
    width: 28%;
    text-align: left;
    font-weight: 650;
    letter-spacing: -0.02em;
}

.pl-pricing-page .pl-pricing-archer-table-blank {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
}

.pl-pricing-page .pl-pricing-archer-table .pl-pricing-archer-tier-name {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-archer-table .pl-pricing-archer-tier-price {
    display: block;
    margin: 0;
    line-height: 1;
}

.pl-pricing-page .pl-pricing-archer-table .pl-pricing-archer-tier-price strong {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.04em;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-archer-table .pl-pricing-archer-tier-price span {
    margin-left: 2px;
    font-size: 13px;
    font-weight: 500;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-archer-table tbody tr {
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-archer-table tbody td {
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-archer .pl-pricing-archer-note {
    margin: 0;
    text-align: right;
    font-size: 12px;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-archer .pl-pricing-addon-drop-name {
    font-size: 18px;
}

.pl-pricing-page .pl-pricing-archer-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.pl-pricing-page .pl-pricing-archer-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    color: #4f46e5;
}

.pl-pricing-page .pl-pricing-archer-icon svg {
    display: block;
    width: 16px;
    height: 16px;
}

.pl-pricing-page .pl-pricing-archer-note {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-drop {
    margin: 0;
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-addon-drop-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    cursor: pointer;
    list-style: none;
    user-select: none;
}

.pl-pricing-page .pl-pricing-addon-drop-summary::-webkit-details-marker {
    display: none;
}

.pl-pricing-page .pl-pricing-addon-drop-copy {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    min-width: 0;
}

.pl-pricing-page .pl-pricing-addon-drop-name {
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.pl-pricing-page .pl-pricing-addon-drop-meta {
    font-size: 15px;
    font-weight: 600;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-drop-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-drop-minus {
    display: none;
}

.pl-pricing-page .pl-pricing-addon-drop[open] .pl-pricing-addon-drop-plus {
    display: none;
}

.pl-pricing-page .pl-pricing-addon-drop[open] .pl-pricing-addon-drop-minus {
    display: inline;
}

.pl-pricing-page .pl-pricing-addon-drop-lede {
    margin: 0;
    padding: 0 20px 12px;
    max-width: 52ch;
    font-size: 14px;
    line-height: 1.45;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-addon-drop-lede {
    padding: 0 0 12px;
    max-width: none;
}

.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-archer-note,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-credits {
    margin-left: 0;
    margin-right: 0;
}

.pl-pricing-page .pl-pricing-studio .pl-pricing-addon-drop-lede {
    padding-bottom: 8px;
}

.pl-pricing-page .pl-pricing-addon-drop .pl-pricing-addon-perks {
    margin: 0 20px 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-addon-drop .pl-pricing-archer-note {
    margin: 0 20px 12px;
}

.pl-pricing-page .pl-pricing-addon-drop .pl-pricing-credits {
    margin: 0 20px 18px;
}

.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-archer-note,
.pl-pricing-page .pl-pricing-addon-drop-body .pl-pricing-credits {
    margin-left: 0;
    margin-right: 0;
}

.pl-pricing-page .pl-pricing-archer-note {
    margin: 0 0 12px;
}

.pl-pricing-page .pl-pricing-archer-credits {
    margin: 0;
    border-top: 1px solid var(--line);
    padding-top: 4px;
}

.pl-pricing-page .pl-pricing-archer-credits-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 0 8px;
    cursor: pointer;
    list-style: none;
    user-select: none;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--ink);
}

.pl-pricing-page .pl-pricing-archer-credits-summary::-webkit-details-marker {
    display: none;
}

.pl-pricing-page .pl-pricing-archer-credits-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-archer-credits-minus {
    display: none;
}

.pl-pricing-page .pl-pricing-archer-credits[open] .pl-pricing-archer-credits-plus {
    display: none;
}

.pl-pricing-page .pl-pricing-archer-credits[open] .pl-pricing-archer-credits-minus {
    display: inline;
}

.pl-pricing-page .pl-pricing-archer-credits .pl-pricing-credits {
    margin-top: 8px;
    margin-bottom: 4px;
}

.pl-pricing-page .pl-pricing-credits {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 0;
    overflow: hidden;
}

.pl-pricing-page .pl-pricing-credits-row {
    display: grid;
    grid-template-columns: minmax(88px, 0.9fr) repeat(4, minmax(0, 1fr));
    gap: 0;
}

.pl-pricing-page .pl-pricing-credits--plans .pl-pricing-credits-row {
    grid-template-columns: minmax(88px, 0.9fr) repeat(3, minmax(0, 1fr));
}

.pl-pricing-page .pl-pricing-credits-row + .pl-pricing-credits-row {
    border-top: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-credits-row--head {
    background: #f7f7f7;
}

.pl-pricing-page .pl-pricing-credits-cell {
    padding: 14px 16px;
    font-size: 14px;
    line-height: 1.35;
    color: var(--ink);
    border-left: 1px solid var(--line);
}

.pl-pricing-page .pl-pricing-credits-cell:first-child {
    border-left: none;
}

.pl-pricing-page .pl-pricing-credits-row--head .pl-pricing-credits-cell {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

.pl-pricing-page .pl-pricing-credits-label {
    font-size: 13px;
    font-weight: 600;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-credits-cell strong {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-pricing-page .pl-pricing-credits-cell span {
    margin-left: 2px;
    font-size: 13px;
    font-weight: 500;
    color: var(--muted);
}

.pl-pricing-page .pl-pricing-credits-plus {
    display: inline-block;
    margin-left: 4px;
    padding: 2px 6px;
    border-radius: 0;
    background: #f0f0f0;
    font-size: 12px;
    font-weight: 650;
    color: var(--ink);
    white-space: nowrap;
}

@media (max-width: 760px) {
    .pl-pricing-page .pl-pricing-addon {
        padding: 24px 20px;
        gap: 22px;
    }

    .pl-pricing-page .pl-pricing-addon--solo {
        padding: 0;
        gap: 0;
    }

    .pl-pricing-page .pl-pricing-addon-top {
        flex-direction: column;
        align-items: stretch;
    }

    .pl-pricing-page .pl-pricing-addon-price {
        text-align: left;
    }

    .pl-pricing-page .pl-pricing-addon-perks {
        grid-template-columns: 1fr 1fr;
        gap: 14px 0;
        padding-top: 18px;
    }

    .pl-pricing-page .pl-pricing-addon-perks li {
        padding: 0 14px;
    }

    .pl-pricing-page .pl-pricing-addon-perks li:nth-child(odd) {
        padding-left: 0;
        border-left: none;
    }

    .pl-pricing-page .pl-pricing-addon-perks li:nth-child(even) {
        border-left: 1px solid var(--line);
    }

    .pl-pricing-page .pl-pricing-credits {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .pl-pricing-page .pl-pricing-credits-row {
        min-width: 560px;
    }

    .pl-pricing-page .pl-pricing-credits--plans .pl-pricing-credits-row {
        min-width: 440px;
    }

    .pl-pricing-page .pl-pricing-credits-cell {
        padding: 12px 10px;
        font-size: 13px;
    }

    .pl-pricing-page .pl-pricing-credits-cell strong {
        font-size: 18px;
    }
}

@media (max-width: 900px) {
    .pl-pricing-page .pl-crew-product,
    .pl-pricing-page .pl-crew-product.is-featured {
        padding: 24px 20px 22px;
    }

    .pl-pricing-page .pl-crew-product-tag {
        min-height: 0;
        max-width: none;
    }
}

/* Sales-led: features stay, catalog $ amounts stay off. */
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-compare-sticky-price,
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-crew-product-price,
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-plan-note {
    display: none;
}

body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-compare-sticky-plan {
    padding-top: 4px;
}

/* Sales-led: only the three plan cards — hide intel packs + compare matrix. */
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-intel-packs,
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-compare,
body.pl-pricing-page[data-pl-live-pricing='0'] .pl-crew-fine {
    display: none;
}

body.pl-pricing-page[data-pl-live-pricing='0'] .pl-pricing-faq {
    padding-top: 72px;
}


/* ---- css/pl-offers-include-modal.css ---- */
/* Shared “What’s included” modal (dash Plans + /start). List styles come from pl-offers-crew.css. */

.pl-offers-include-btn {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: none;
    color: var(--pl-text, #0e0e0e);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.pl-offers-include-btn:hover {
    color: var(--pl-muted, #6f6f6f);
}

#plOffersIncludeModal.pl-offers-include-modal {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
}

#plOffersIncludeModal.pl-offers-include-modal[hidden] {
    display: none !important;
}

#plOffersIncludeModal .pl-offers-include-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(14, 14, 14, 0.28);
}

#plOffersIncludeModal .pl-offers-include-modal-panel {
    position: relative;
    width: 100%;
    max-width: min(560px, calc(100vw - 32px));
    max-height: min(86vh, 720px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-sizing: border-box;
    padding: 18px 24px 20px;
    background: #fff;
    border: 1px solid #e4e4e4;
    color: #0e0e0e;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

#plOffersIncludeModal .pl-offers-include-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-shrink: 0;
    margin: 0 0 12px;
}

#plOffersIncludeModal .pl-offers-include-modal-title {
    margin: 0;
    flex: 1 1 auto;
    min-width: 0;
    font-family: inherit;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.3;
    color: #0e0e0e;
}

#plOffersIncludeModal .pl-offers-include-modal-close {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: -4px -6px 0 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: none;
    color: #0e0e0e;
    cursor: pointer;
}

#plOffersIncludeModal .pl-offers-include-modal-close:hover {
    color: #6f6f6f;
}

#plOffersIncludeModal .pl-offers-include-modal-close svg {
    display: block;
}

#plOffersIncludeModal .pl-offers-include-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    margin: 0 -4px;
    padding: 0 4px 8px;
    background: transparent;
}

#plOffersIncludeModal .pl-offers-include-modal-body .pl-crew-include-list {
    gap: 22px;
    min-width: 0;
}

#plOffersIncludeModal .pl-crew-include-row {
    min-width: 0;
    gap: 10px;
}

#plOffersIncludeModal .pl-crew-include-label {
    min-width: 0;
}

#plOffersIncludeModal .pl-offers-tip {
    white-space: normal;
}

#plOffersIncludeModal .pl-crew-include-val {
    max-width: 46%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* Same tip markup/CSS as /pricing (.pl-offers-proto); drop below in the modal so it isn’t clipped. */
#plOffersIncludeModal .pl-offers-tip-pop {
    left: 0;
    top: calc(100% + 12px);
    max-width: min(300px, calc(100vw - 96px));
    transform: translateY(6px);
}

#plOffersIncludeModal .pl-offers-tip-pop::before {
    right: auto;
    left: 18px;
    top: -9px;
    transform: none;
    border: 9px solid transparent;
    border-bottom-color: #fff;
    filter: drop-shadow(0 -1px 0 rgba(0, 0, 0, 0.05));
}

#plOffersIncludeModal .pl-offers-tip:hover .pl-offers-tip-pop,
#plOffersIncludeModal .pl-offers-tip:focus .pl-offers-tip-pop,
#plOffersIncludeModal .pl-offers-tip:focus-within .pl-offers-tip-pop {
    transform: translateY(0);
}

#plOffersIncludeModal .pl-crew-include-row:has(.pl-offers-tip:hover),
#plOffersIncludeModal .pl-crew-include-row:has(.pl-offers-tip:focus-within) {
    position: relative;
    z-index: 5;
}

#plOffersIncludeModal .pl-offers-include-loading {
    margin: 0;
    padding: 8px 0 16px;
    font-size: 13px;
    color: #6f6f6f;
}

#plOffersIncludeModal .pl-offers-include-loading--err {
    color: #b42318;
}

#plOffersIncludeModal .pl-offers-include-loading a {
    color: inherit;
}

@media (max-width: 640px) {
    #plOffersIncludeModal.pl-offers-include-modal {
        padding: 10px;
        align-items: stretch;
    }

    #plOffersIncludeModal .pl-offers-include-modal-panel {
        max-width: none;
        width: 100%;
        max-height: 100%;
        padding: 12px 12px 14px;
    }

    #plOffersIncludeModal .pl-offers-include-modal-title {
        font-size: 16px;
    }

    #plOffersIncludeModal .pl-offers-include-modal-body .pl-crew-include-list {
        gap: 16px;
    }

    #plOffersIncludeModal .pl-crew-include-group h3 {
        font-size: 11px;
        letter-spacing: 0.08em;
    }

    #plOffersIncludeModal .pl-crew-include-row {
        gap: 8px;
        padding: 9px 0;
        font-size: 12px;
    }

    #plOffersIncludeModal .pl-crew-include-label {
        font-size: 12px;
        line-height: 1.35;
    }

    #plOffersIncludeModal .pl-crew-include-val {
        max-width: 40%;
        font-size: 11px;
        line-height: 1.3;
        font-weight: 600;
    }

    #plOffersIncludeModal .pl-crew .pl-plan-addon-tag,
    #plOffersIncludeModal .pl-plan-addon-tag {
        font-size: 9px;
        padding: 1px 5px;
    }

    #plOffersIncludeModal .pl-offers-tip-pop {
        max-width: min(280px, calc(100vw - 40px));
        padding: 12px 14px;
    }
}


/* ---- css/pl-pricing-2.css ---- */
/* /pricing — single $65 Pathline Platform plan */

.pl-pricing-2 {
    --p2-ink: #0e0e0e;
    --p2-muted: #5c5c5c;
    --p2-line: #e6e6e6;
    --p2-wash: #f4f4f2;
    --p2-paper: #ffffff;
    --p2-accent: #1774ff;
    --p2-max: 960px;
    background:
        radial-gradient(1200px 520px at 50% -10%, rgba(23, 116, 255, 0.08), transparent 60%),
        linear-gradient(180deg, #fafafa 0%, var(--p2-paper) 42%, var(--p2-wash) 100%);
}

.pl-pricing-2 .pl-landing-scroll {
    background: transparent;
}

/* —— Hero + price —— */
.pl-pricing-2-hero {
    padding: clamp(72px, 12vh, 120px) 28px 40px;
}

.pl-pricing-2-hero-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: clamp(28px, 5vw, 56px);
    align-items: center;
    max-width: var(--p2-max);
    margin: 0 auto;
    animation: plPricing2In 0.7s ease both;
}

.pl-pricing-2-hero-copy {
    text-align: left;
    min-width: 0;
}

.pl-pricing-2-title {
    margin: 0;
    font-size: clamp(28px, 5vw, 40px);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1.1;
    color: var(--p2-ink);
}

.pl-pricing-2-lede {
    margin: 12px 0 0;
    max-width: 36ch;
    font-size: 16px;
    font-weight: 450;
    line-height: 1.5;
    color: var(--p2-muted);
}

@property --pl-p2-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

@property --pl-p2-h {
    syntax: "<number>";
    inherits: false;
    initial-value: 217;
}

.pl-pricing-2-offer {
    --pl-p2-angle: 0deg;
    --pl-p2-h: 217;
    position: relative;
    z-index: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 360px;
    max-width: 100%;
    min-height: 360px;
    margin: 0;
    border: 2px solid transparent;
    background:
        linear-gradient(var(--p2-paper), var(--p2-paper)) padding-box,
        conic-gradient(
            from var(--pl-p2-angle),
            hsl(var(--pl-p2-h) 92% 54%) 0deg,
            hsl(var(--pl-p2-h) 80% 76%) 90deg,
            #0e0e0e 180deg,
            hsl(var(--pl-p2-h) 92% 54%) 270deg,
            hsl(var(--pl-p2-h) 92% 54%) 360deg
        ) border-box;
    box-shadow: none;
    animation:
        plPricing2In 0.8s ease 0.08s both,
        plPricing2BorderSpin 8s linear infinite,
        plPricing2HueCycle 30s linear infinite;
}

.pl-pricing-2-offer-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 28px 24px;
    text-align: center;
    overflow: visible;
}

.pl-pricing-2-offer-name {
    margin: 0 0 14px;
    font-size: clamp(26px, 5vw, 34px);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1.1;
    color: var(--p2-ink);
}

@keyframes plPricing2BorderSpin {
    to {
        --pl-p2-angle: 360deg;
    }
}

@keyframes plPricing2HueCycle {
    0%,
    26.666% {
        --pl-p2-h: 217;
    }
    33.333%,
    60% {
        --pl-p2-h: 334;
    }
    66.666%,
    93.333% {
        --pl-p2-h: 263;
    }
    100% {
        --pl-p2-h: 217;
    }
}

.pl-pricing-2-offer-price {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 1.15em;
    overflow: visible;
}

.pl-pricing-2-amt {
    display: inline-block;
    font-size: clamp(40px, 7vw, 52px);
    font-weight: 700;
    letter-spacing: -0.05em;
    line-height: 1;
    color: var(--p2-ink);
    overflow: visible;
}

.pl-pricing-2-flip {
    --p2-flip-h: 1em;
    position: relative;
    display: inline-block;
    height: var(--p2-flip-h);
    vertical-align: top;
    perspective: 420px;
    perspective-origin: 50% 50%;
}

.pl-pricing-2-flip-sizer {
    visibility: hidden;
    display: block;
    height: var(--p2-flip-h);
    line-height: var(--p2-flip-h);
    white-space: nowrap;
    padding: 0 0.06em;
    pointer-events: none;
}

.pl-pricing-2-flip-top,
.pl-pricing-2-flip-bot {
    position: absolute;
    left: 0;
    width: 100%;
    height: 50%;
    overflow: hidden;
    z-index: 1;
}

.pl-pricing-2-flip-top {
    top: 0;
}

.pl-pricing-2-flip-bot {
    bottom: 0;
}

.pl-pricing-2-flip-top > span,
.pl-pricing-2-flip-bot > span,
.pl-pricing-2-flip-panel-front > span,
.pl-pricing-2-flip-panel-back > span {
    display: block;
    box-sizing: border-box;
    height: var(--p2-flip-h);
    line-height: var(--p2-flip-h);
    white-space: nowrap;
    text-align: center;
    padding: 0 0.06em;
}

.pl-pricing-2-flip-bot > span,
.pl-pricing-2-flip-panel-back > span {
    transform: translateY(-50%);
}

.pl-pricing-2-flip-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    z-index: 3;
    transform-origin: 50% 100%;
    transform-style: preserve-3d;
    pointer-events: none;
}

.pl-pricing-2-flip-panel[hidden] {
    display: none !important;
}

.pl-pricing-2-flip-panel-front,
.pl-pricing-2-flip-panel-back {
    position: absolute;
    inset: 0;
    overflow: hidden;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background: var(--p2-paper);
}

.pl-pricing-2-flip-panel-back {
    transform: rotateX(180deg);
}

.pl-pricing-2-flip.is-flipping .pl-pricing-2-flip-panel {
    animation: plP2FlipCard 0.28s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes plP2FlipCard {
    from { transform: rotateX(0deg); }
    to { transform: rotateX(-180deg); }
}

@media (prefers-reduced-motion: reduce) {
    .pl-pricing-2-flip.is-flipping .pl-pricing-2-flip-panel {
        animation: none;
    }
}

.pl-pricing-2-per {
    font-size: 16px;
    font-weight: 500;
    color: var(--p2-muted);
}

.pl-pricing-2-offer-fees {
    margin: 10px 0 0;
    font-size: 13px;
    font-weight: 500;
    color: var(--p2-muted);
}

.pl-pricing-2-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    width: 100%;
    max-width: 300px;
    margin-top: 22px;
}

.pl-pricing-2-stepper {
    display: flex;
    align-items: stretch;
    width: 100%;
    height: 48px;
    box-sizing: border-box;
    border: 1px solid var(--p2-ink);
    background: #fff;
}

.pl-pricing-2-stepper-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 100%;
    margin: 0;
    padding: 0;
    border: none;
    background: #fff;
    color: var(--p2-ink);
    font: inherit;
    line-height: 0;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
}

.pl-pricing-2-stepper-ico {
    position: relative;
    display: block;
    width: 14px;
    height: 14px;
}

.pl-pricing-2-stepper-ico::before,
.pl-pricing-2-stepper-ico::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    background: currentColor;
    border-radius: 1px;
    transform: translate(-50%, -50%);
}

/* Horizontal bar (minus + plus) */
.pl-pricing-2-stepper-ico::before {
    width: 14px;
    height: 2px;
}

/* Vertical bar (plus only) */
.pl-pricing-2-stepper-btn.is-plus .pl-pricing-2-stepper-ico::after {
    width: 2px;
    height: 14px;
}

.pl-pricing-2-stepper-btn:hover:not(:disabled) {
    background: var(--p2-ink);
    color: #fff;
}

.pl-pricing-2-stepper-btn:disabled {
    opacity: 0.28;
    cursor: default;
}

.pl-pricing-2-stepper-val {
    flex: 1 1 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 0 10px;
    text-align: center;
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--p2-ink);
    border-left: 1px solid var(--p2-ink);
    border-right: 1px solid var(--p2-ink);
    line-height: 1.2;
    background: #fff;
    white-space: nowrap;
}

/* Match stepper width/height (white outline + grow-split hover). */
.pl-pricing-2-offer .pl-crew-btn.pl-pricing-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    width: 100%;
    min-width: 0;
    min-height: 48px;
    height: 48px;
    box-sizing: border-box;
    padding: 0 22px;
    text-decoration: none;
    border: 1px solid var(--p2-ink, #0e0e0e);
    background: #fff;
    color: var(--p2-ink, #0e0e0e) !important;
}

.pl-pricing-2-offer .pl-crew-btn.pl-pricing-cta:hover {
    background: #fff;
    color: #fff !important;
}

.pl-pricing-2-offer .pl-crew-btn.pl-pricing-cta[hidden] {
    display: none !important;
}

/* —— Features —— */
.pl-pricing-2-features {
    padding: 24px 28px 88px;
}

.pl-pricing-2-features-inner {
    max-width: var(--p2-max);
    margin: 0 auto;
    animation: plPricing2In 0.85s ease 0.16s both;
}

.pl-pricing-2 .pl-pricing-faq {
    max-width: var(--p2-max);
}

.pl-pricing-2-features-head {
    max-width: 36ch;
    margin-bottom: 28px;
}

.pl-pricing-2-features-head h2 {
    margin: 0;
    font-size: clamp(24px, 3.5vw, 32px);
    font-weight: 700;
    letter-spacing: -0.04em;
    color: var(--p2-ink);
}

.pl-pricing-2-features-head p {
    margin: 8px 0 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--p2-muted);
}

.pl-pricing-2-full-list {
    margin-top: 14px;
    font-size: 14px;
    font-weight: 600;
    color: var(--p2-ink);
    scroll-margin: 0;
    outline: none;
}

.pl-pricing-2-full-list:focus,
.pl-pricing-2-full-list:focus-visible {
    outline: none;
}

.pl-pricing-2-feature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 40px;
    padding: 8px 0 8px;
    border-top: 1px solid var(--p2-line);
    border-bottom: 1px solid var(--p2-line);
    background: rgba(255, 255, 255, 0.72);
}

.pl-pricing-2-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pl-pricing-2-list li {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 16px 4px;
    border-bottom: 1px solid var(--p2-line);
}

.pl-pricing-2-list li:last-child {
    border-bottom: none;
}

.pl-pricing-2-list-name {
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--p2-ink);
}

.pl-pricing-2-list-hint {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    color: var(--p2-muted);
}

/* —— Intelligence —— */
.pl-pricing-2-intel {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    gap: 28px 40px;
    align-items: end;
    margin-top: 28px;
    padding: 28px 28px 26px;
    border: 1px solid var(--p2-line);
    border-left: 3px solid var(--p2-accent);
    background: var(--p2-paper);
}

.pl-pricing-2-intel-kicker {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--p2-accent);
}

.pl-pricing-2-intel-copy h3 {
    margin: 8px 0 0;
    font-size: clamp(20px, 3vw, 26px);
    font-weight: 700;
    letter-spacing: -0.035em;
    color: var(--p2-ink);
}

.pl-pricing-2-intel-copy p {
    margin: 8px 0 0;
    max-width: 36ch;
    font-size: 14px;
    line-height: 1.5;
    color: var(--p2-muted);
}

.pl-pricing-2-intel-meters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.pl-pricing-2-intel-meter {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    background: var(--p2-wash);
}

.pl-pricing-2-intel-value {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1;
    color: var(--p2-ink);
}

.pl-pricing-2-intel-label {
    font-size: 12px;
    font-weight: 550;
    color: var(--p2-muted);
}

.pl-pricing-2-fine {
    margin: 18px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--p2-muted);
}

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

@media (max-width: 800px) {
    .pl-pricing-2-hero-inner {
        grid-template-columns: 1fr;
        gap: 28px;
        justify-items: center;
        text-align: center;
    }

    .pl-pricing-2-hero-copy {
        text-align: center;
    }

    .pl-pricing-2-lede {
        margin-left: auto;
        margin-right: auto;
    }

    .pl-pricing-2-feature-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .pl-pricing-2-feature-grid .pl-pricing-2-list:first-child li:last-child {
        border-bottom: 1px solid var(--p2-line);
    }

    .pl-pricing-2-intel {
        grid-template-columns: 1fr;
        gap: 20px;
    }
}

@media (max-width: 640px) {
    .pl-pricing-2-hero,
    .pl-pricing-2-features {
        padding-left: 18px;
        padding-right: 18px;
    }

    .pl-pricing-2-offer {
        width: min(320px, 100%);
    }

    .pl-pricing-2-offer-inner {
        padding: 22px 18px;
    }

    .pl-pricing-2-intel {
        padding: 22px 18px;
    }

    .pl-pricing-2-intel-meters {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-pricing-2-hero-inner,
    .pl-pricing-2-features-inner {
        animation: none;
    }

    .pl-pricing-2-offer {
        animation: none;
        background:
            linear-gradient(var(--p2-paper), var(--p2-paper)) padding-box,
            conic-gradient(from 135deg, #1774ff, #ff4d9d, #7c3aed, #1774ff) border-box;
    }

    .pl-pricing-2-offer .pl-crew-btn.pl-pricing-cta {
        transition: none;
    }
}


/* ---- css/pl-pricing-5.css ---- */
/* /pricing-5 — “The whole day. One seat.” typographic pricing */

.pl-pricing-5 {
    --p5-ink: #0e0e0e;
    --p5-muted: #5a6270;
    --p5-line: #dde3ec;
    --p5-paper: #ffffff;
    --p5-mist: #f4f6fa;
    --p5-wash: #eef1f6;
    --p5-accent: #1774ff;
    --p5-accent-soft: rgba(23, 116, 255, 0.12);
    --p5-max: 920px;
    /* Bridge main pricing feature-list tokens */
    --p2-ink: var(--p5-ink);
    --p2-muted: var(--p5-muted);
    --p2-line: var(--p5-line);
    --p2-wash: var(--p5-wash);
    --p2-paper: var(--p5-paper);
    --p2-accent: var(--p5-accent);
    --p2-max: 960px;
    background: var(--p5-paper);
    color: var(--p5-ink);
}

.pl-pricing-5 .pl-landing-scroll {
    background: transparent;
}

/* —— Hero —— */
@property --pl-p5-h {
    syntax: "<number>";
    inherits: false;
    initial-value: 217;
}

.pl-pricing-5-hero {
    --pl-p5-h: 217;
    position: relative;
    overflow: hidden;
    min-height: min(88vh, 820px);
    padding: clamp(72px, 12vh, 120px) 28px clamp(72px, 10vh, 100px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: linear-gradient(
        180deg,
        hsl(var(--pl-p5-h) 58% 93%) 0%,
        hsl(var(--pl-p5-h) 48% 95%) 36%,
        hsl(var(--pl-p5-h) 36% 97%) 72%,
        var(--p5-paper) 100%
    );
    animation: plPricing5HueCycle 30s linear infinite;
}

.pl-pricing-5-hero-atmosphere {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 120% 85% at 50% -8%, hsl(var(--pl-p5-h) 92% 54% / 0.26), transparent 62%),
        radial-gradient(ellipse 60% 55% at 10% 28%, hsl(var(--pl-p5-h) 80% 70% / 0.12), transparent 58%),
        radial-gradient(ellipse 55% 50% at 92% 22%, hsl(var(--pl-p5-h) 70% 65% / 0.1), transparent 55%);
    animation: plPricing5HueCycle 30s linear infinite;
}

.pl-pricing-5-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    margin: 0 auto;
    animation: plPricing5In 0.7s ease both;
}

.pl-pricing-5-brand {
    margin: 0 0 12px;
    font-size: clamp(34px, 6vw, 52px);
    font-weight: 700;
    letter-spacing: -0.055em;
    line-height: 0.95;
}

.pl-pricing-5-title {
    margin: 0 auto;
    max-width: 14ch;
    font-size: clamp(34px, 6.2vw, 54px);
    font-weight: 700;
    letter-spacing: -0.052em;
    line-height: 1.02;
}

.pl-pricing-5-lede {
    margin: 16px auto 0;
    max-width: 40ch;
    font-size: 17px;
    font-weight: 450;
    line-height: 1.5;
    color: var(--p5-muted);
}

.pl-pricing-5-number {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 14px;
    margin-top: clamp(28px, 5vh, 44px);
}

.pl-pricing-5-amt {
    font-size: clamp(72px, 16vw, 128px);
    font-weight: 600;
    letter-spacing: -0.04em;
    line-height: 0.88;
    font-variant-numeric: tabular-nums;
    color: var(--p5-ink);
}

.pl-pricing-5-amt.is-tick {
    animation: plPricing5Tick 0.32s ease;
}

.pl-pricing-5-per {
    font-size: clamp(18px, 3vw, 24px);
    font-weight: 500;
    color: var(--p5-muted);
    transform: translateY(-0.35em);
}

.pl-pricing-5-number-note {
    margin: 10px 0 0;
    font-size: 14px;
    font-weight: 550;
    color: var(--p5-muted);
}

.pl-pricing-5-controls {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    gap: 10px;
    margin-top: 26px;
}

.pl-pricing-5-stepper {
    display: inline-flex;
    align-items: center;
    height: 48px;
    padding: 0 4px;
    border: 1px solid var(--p5-line);
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(8px);
}

.pl-pricing-5-stepper-btn {
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    color: var(--p5-ink);
    font-size: 20px;
    font-weight: 600;
    cursor: pointer;
}

.pl-pricing-5-stepper-btn:hover:not(:disabled) {
    background: var(--p5-accent-soft);
}

.pl-pricing-5-stepper-btn:disabled {
    opacity: 0.35;
    cursor: default;
}

.pl-pricing-5-stepper-val {
    min-width: 9.5rem;
    padding: 0 8px;
    text-align: center;
    font-size: 14px;
    font-weight: 650;
}

.pl-pricing-5 .pl-pricing-5-controls .pl-pricing-cta,
.pl-pricing-5 .pl-pricing-5-controls .pl-pricing-5-sales,
.pl-pricing-5 .pl-pricing-5-dock-cta,
.pl-pricing-5 .pl-pricing-5-dock-sales {
    margin-top: 0;
    height: 48px;
    min-height: 48px;
    min-width: 120px;
    padding: 0 22px;
    box-sizing: border-box;
}

.pl-pricing-5 .pl-pricing-5-controls a.pl-crew-btn.pl-pricing-cta,
.pl-pricing-5 .pl-pricing-5-dock a.pl-crew-btn.pl-pricing-cta {
    border: 1px solid var(--p5-ink);
    background: var(--p5-ink);
    color: #fff !important;
}

.pl-pricing-5 .pl-pricing-5-controls a.pl-crew-btn.pl-pricing-cta:hover,
.pl-pricing-5 .pl-pricing-5-dock a.pl-crew-btn.pl-pricing-cta:hover {
    background: #222;
    border-color: #222;
    color: #fff !important;
}

.pl-pricing-5 .pl-pricing-5-controls a.pl-crew-btn.pl-pricing-5-sales,
.pl-pricing-5 .pl-pricing-5-dock a.pl-crew-btn.pl-pricing-5-dock-sales {
    border: 1px solid var(--p5-ink);
    background: var(--p5-ink);
    color: #fff !important;
}

.pl-pricing-5 .pl-pricing-5-controls .pl-crew-btn[hidden],
.pl-pricing-5 .pl-pricing-5-controls .pl-pricing-cta[hidden],
.pl-pricing-5 .pl-pricing-5-dock-cta[hidden],
.pl-pricing-5 .pl-pricing-5-dock-sales[hidden] {
    display: none !important;
}

/* —— Day moments —— */
.pl-pricing-5-day {
    padding: 28px 28px 16px;
}

.pl-pricing-5-day-inner {
    max-width: var(--p5-max);
    margin: 0 auto;
}

.pl-pricing-5-day-head {
    max-width: 40ch;
    margin-bottom: 28px;
}

.pl-pricing-5-day-head h2 {
    margin: 0;
    font-size: clamp(24px, 3.5vw, 32px);
    font-weight: 700;
    letter-spacing: -0.04em;
}

.pl-pricing-5-day-head p {
    margin: 10px 0 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--p5-muted);
}

.pl-pricing-5-moments {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--p5-line);
}

.pl-pricing-5-moment {
    padding: 28px 22px 28px 0;
    border-right: 1px solid var(--p5-line);
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.55s ease, transform 0.55s ease;
    transition-delay: calc(var(--i, 0) * 90ms);
}

.pl-pricing-5-moment:last-child {
    border-right: 0;
    padding-right: 0;
}

.pl-pricing-5-moment:first-child {
    padding-left: 0;
}

.pl-pricing-5-moment.is-in {
    opacity: 1;
    transform: translateY(0);
}

.pl-pricing-5-moment-when {
    display: block;
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--p5-accent);
}

.pl-pricing-5-moment h3 {
    margin: 0;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.035em;
}

.pl-pricing-5-moment p {
    margin: 10px 0 0;
    max-width: 28ch;
    font-size: 14px;
    line-height: 1.5;
    color: var(--p5-muted);
}

/* —— Include —— */
.pl-pricing-5-include {
    padding: 36px 28px 20px;
}

.pl-pricing-5-include-inner {
    max-width: var(--p5-max);
    margin: 0 auto;
}

.pl-pricing-5-include-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.pl-pricing-5-include-head h2 {
    margin: 0;
    font-size: clamp(22px, 3.2vw, 28px);
    font-weight: 700;
    letter-spacing: -0.04em;
}

.pl-pricing-5-chips {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pl-pricing-5-chips li {
    padding: 10px 14px;
    border: 1px solid var(--p5-line);
    background: rgba(255, 255, 255, 0.8);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.015em;
    color: var(--p5-ink);
}

.pl-pricing-5-intel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 24px;
    padding: 20px 22px;
    border: 1px solid var(--p5-line);
    border-left: 3px solid var(--p5-accent);
    background: var(--p5-paper);
}

.pl-pricing-5-intel-kicker {
    margin: 0 0 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--p5-accent);
}

.pl-pricing-5-intel h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-pricing-5-intel p {
    margin: 6px 0 0;
    font-size: 14px;
    color: var(--p5-muted);
}

.pl-pricing-5-intel-meters {
    display: flex;
    gap: 12px;
    flex: 0 0 auto;
}

.pl-pricing-5-intel-meters div {
    min-width: 88px;
    padding: 10px 12px;
    background: var(--p5-mist);
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pl-pricing-5-intel-meters strong {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.pl-pricing-5-intel-meters span {
    font-size: 12px;
    font-weight: 550;
    color: var(--p5-muted);
}

.pl-pricing-5-fine {
    margin: 18px 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--p5-muted);
}

.pl-pricing-5 .pl-pricing-faq {
    max-width: none;
    width: 100%;
    padding-top: 8px;
}

.pl-pricing-5 .pl-pricing-faq h2,
.pl-pricing-5 .pl-pricing-faq-list {
    max-width: var(--p2-max);
    margin-left: auto;
    margin-right: auto;
}

.pl-pricing-5 .pl-pricing-5-fine {
    max-width: var(--p2-max);
    margin: 24px auto 0;
    padding: 0 var(--p2-gutter, 24px) 48px;
    box-sizing: border-box;
}

.pl-pricing-5 .pl-pricing-2-features {
    padding-bottom: 48px;
}

/* —— Sticky dock (below header) —— */
.pl-pricing-5-dock {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--pl-marketing-header-h, 72px);
    z-index: 150;
    padding: 10px 16px;
    background: rgba(255, 255, 255, 0.92);
    border-bottom: 1px solid var(--p5-line);
    backdrop-filter: blur(12px);
    animation: plPricing5DockIn 0.28s ease;
}

.pl-pricing-5-dock[hidden] {
    display: none !important;
}

.pl-pricing-5-dock-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    max-width: var(--p5-max);
    margin: 0 auto;
}

.pl-pricing-5-dock-price {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.pl-pricing-5-dock-price span:first-child {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
}

.pl-pricing-5-dock-price span:last-child {
    font-size: 12px;
    font-weight: 550;
    color: var(--p5-muted);
}

.pl-pricing-5-dock-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.pl-pricing-5-dock .pl-pricing-5-stepper {
    height: 44px;
    background: #fff;
    backdrop-filter: none;
}

.pl-pricing-5-dock .pl-pricing-5-stepper-btn {
    width: 36px;
    height: 36px;
}

.pl-pricing-5-dock .pl-pricing-5-dock-cta,
.pl-pricing-5-dock .pl-pricing-5-dock-sales {
    height: 44px;
    min-height: 44px;
}

/* —— Motion —— */
@keyframes plPricing5HueCycle {
    0%,
    26.666% {
        --pl-p5-h: 217;
    }
    33.333%,
    60% {
        --pl-p5-h: 334;
    }
    66.666%,
    93.333% {
        --pl-p5-h: 263;
    }
    100% {
        --pl-p5-h: 217;
    }
}

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

@keyframes plPricing5Tick {
    from {
        transform: translateY(8px);
        opacity: 0.55;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes plPricing5DockIn {
    from {
        transform: translateY(-100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* —— Responsive —— */
@media (max-width: 820px) {
    .pl-pricing-5-moments {
        grid-template-columns: 1fr;
        border-top: 0;
    }

    .pl-pricing-5-moment {
        padding: 22px 0;
        border-right: 0;
        border-top: 1px solid var(--p5-line);
    }

    .pl-pricing-5-moment p {
        max-width: none;
    }
}

@media (max-width: 640px) {
    .pl-pricing-5 .pl-pricing-faq {
        padding-left: 18px;
        padding-right: 18px;
    }

    .pl-pricing-5-controls {
        width: 100%;
    }

    .pl-pricing-5-stepper,
    .pl-pricing-5 .pl-pricing-5-controls .pl-pricing-cta,
    .pl-pricing-5 .pl-pricing-5-controls .pl-pricing-5-sales {
        width: 100%;
        justify-content: space-between;
    }

    .pl-pricing-5-dock-inner {
        gap: 12px;
    }

    .pl-pricing-5-dock-actions {
        gap: 8px;
    }

    .pl-pricing-5-dock .pl-pricing-5-stepper-val {
        min-width: 7.5rem;
        padding: 0 4px;
        font-size: 12px;
    }

    .pl-pricing-5-dock .pl-pricing-5-dock-cta,
    .pl-pricing-5-dock .pl-pricing-5-dock-sales {
        min-width: 96px;
        padding: 0 16px;
    }

    .pl-pricing-5-include-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .pl-pricing-5-intel {
        flex-direction: column;
        align-items: flex-start;
    }

    .pl-pricing-5-intel-meters {
        width: 100%;
    }

    .pl-pricing-5-intel-meters div {
        flex: 1 1 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-pricing-5-hero,
    .pl-pricing-5-hero-atmosphere,
    .pl-pricing-5-hero-inner,
    .pl-pricing-5-amt.is-tick,
    .pl-pricing-5-dock {
        animation: none !important;
    }

    .pl-pricing-5-hero,
    .pl-pricing-5-hero-atmosphere {
        --pl-p5-h: 217;
    }
}


/* ---- css/pl-landing-earn.css ---- */
/* /earn — partners & referrals */
body.pl-landing-earn {
    --pl-earn-ink: #0e0e0e;
    --pl-earn-paper: #ffffff;
    --pl-earn-mute: #666;
    --pl-earn-line: #e8e8e8;
    --pl-earn-surface: #f7f7f7;
}

body.pl-landing-earn .pl-earn-kicker {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
}

/* ── Hero ── */
body.pl-landing-earn .pl-earn-hero {
    display: flex;
    align-items: stretch;
    box-sizing: border-box;
    min-height: 100vh;
    min-height: 100dvh;
    padding: calc(var(--pl-marketing-header-h, 72px) + clamp(28px, 5vh, 48px)) var(--pl-time-inset, clamp(20px, 5vw, 48px)) clamp(36px, 6vh, 56px);
    background:
        radial-gradient(ellipse 80% 55% at 12% 18%, rgba(14, 14, 14, 0.045), transparent 55%),
        radial-gradient(ellipse 60% 45% at 88% 72%, rgba(14, 14, 14, 0.03), transparent 50%),
        var(--pl-earn-paper);
    border-bottom: 1px solid var(--pl-earn-line);
}

body.pl-landing-earn .pl-earn-hero-inner {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
    min-height: 0;
}

body.pl-landing-earn .pl-earn-hero-title {
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    margin: 0;
    max-width: 12ch;
    font-size: clamp(42px, 10vw, 112px);
    font-weight: 500;
    letter-spacing: -0.055em;
    line-height: 0.92;
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-hero-title span {
    display: block;
    opacity: 0;
    transform: translateY(18px);
    animation: pl-earn-rise 0.7s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

body.pl-landing-earn .pl-earn-hero-title span:nth-child(1) { animation-delay: 0.08s; }
body.pl-landing-earn .pl-earn-hero-title span:nth-child(2) { animation-delay: 0.18s; }
body.pl-landing-earn .pl-earn-hero-title span:nth-child(3) { animation-delay: 0.28s; }

body.pl-landing-earn .pl-earn-hero-brand {
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-hero-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px 40px;
    margin-top: clamp(28px, 5vh, 48px);
    padding-top: clamp(20px, 3vh, 28px);
    border-top: 1px solid var(--pl-earn-line);
    opacity: 0;
    animation: pl-earn-fade 0.6s ease 0.45s forwards;
}

body.pl-landing-earn .pl-earn-hero-lead {
    margin: 0;
    max-width: 36em;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-earn-mute);
}

body.pl-landing-earn .pl-earn-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    flex-shrink: 0;
}

/* ── Paths ── */
body.pl-landing-earn .pl-earn-paths {
    padding: clamp(48px, 8vh, 88px) var(--pl-time-inset, clamp(20px, 5vw, 48px));
}

body.pl-landing-earn .pl-earn-paths-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(28px, 4vw, 48px);
    max-width: 1120px;
    margin: 0 auto;
    align-items: start;
}

body.pl-landing-earn .pl-earn-path {
    padding: clamp(24px, 3vw, 36px) 0 0;
    border-top: 1px solid var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-path-rate {
    margin: 0 0 8px;
    font-size: clamp(48px, 7vw, 72px);
    font-weight: 500;
    letter-spacing: -0.06em;
    line-height: 1;
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-path-title {
    margin: 0 0 14px;
    max-width: 16ch;
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1.15;
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-path-lead {
    margin: 0 0 18px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-earn-mute);
}

body.pl-landing-earn .pl-earn-path-bullets {
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

body.pl-landing-earn .pl-earn-path-bullets li {
    position: relative;
    padding: 8px 0 8px 18px;
    font-size: 14px;
    line-height: 1.45;
    color: var(--pl-earn-ink);
    border-bottom: 1px solid var(--pl-earn-line);
}

body.pl-landing-earn .pl-earn-path-bullets li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 15px;
    width: 6px;
    height: 6px;
    background: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-path-bullets li:last-child {
    border-bottom: none;
}

body.pl-landing-earn .pl-earn-partner-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 8px;
}

/* ── Partner form ── */
body.pl-landing-earn .pl-earn-form-wrap {
    margin-top: 8px;
    padding: 22px;
    background: var(--pl-earn-surface);
    border: 1px solid var(--pl-earn-line);
}

body.pl-landing-earn .pl-earn-form-wrap[hidden] {
    display: none;
}

body.pl-landing-earn .pl-earn-form-title {
    margin: 0 0 16px;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 12px;
}

body.pl-landing-earn .pl-earn-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.pl-landing-earn .pl-earn-field--span,
body.pl-landing-earn .pl-earn-error,
body.pl-landing-earn .pl-earn-submit,
body.pl-landing-earn .pl-earn-powered {
    grid-column: 1 / -1;
}

body.pl-landing-earn .pl-earn-label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-label::after {
    content: ' *';
    color: #888;
    font-weight: 400;
}

body.pl-landing-earn .pl-earn-input {
    width: 100%;
    box-sizing: border-box;
    padding: 11px 12px;
    border: 1px solid #d4d4d4;
    border-radius: 0;
    background: #fff;
    color: var(--pl-earn-ink);
    font: inherit;
    font-size: 14px;
    transition: border-color 0.15s ease;
}

body.pl-landing-earn .pl-earn-input:focus {
    outline: none;
    border-color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-textarea {
    resize: vertical;
    min-height: 84px;
    line-height: 1.45;
}

body.pl-landing-earn .pl-earn-botcheck {
    position: absolute;
    left: -9999px;
    opacity: 0;
    height: 0;
    width: 0;
}

body.pl-landing-earn .pl-earn-error {
    margin: 0;
    font-size: 13px;
    color: #b42318;
}

body.pl-landing-earn .pl-earn-submit {
    width: 100%;
    justify-content: center;
}

body.pl-landing-earn .pl-earn-submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

body.pl-landing-earn .pl-earn-powered {
    margin: 4px 0 0;
    font-size: 12px;
    line-height: 1.4;
}

body.pl-landing-earn .pl-earn-powered a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #888;
    text-decoration: none;
}

body.pl-landing-earn .pl-earn-powered a:hover {
    color: var(--pl-earn-ink);
}

body.pl-landing-earn .pl-earn-success {
    margin-top: 8px;
    padding: 22px;
    background: var(--pl-earn-surface);
    border: 1px solid var(--pl-earn-line);
}

/* ── Refer CTA ── */
body.pl-landing-earn .pl-earn-refer-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 14px;
}

body.pl-landing-earn .pl-earn-refer-note {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--pl-earn-mute);
}

body.pl-landing-earn .pl-earn-refer-note strong {
    font-weight: 600;
    color: var(--pl-earn-ink);
}

@keyframes pl-earn-rise {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pl-earn-fade {
    to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-earn .pl-earn-hero-title span,
    body.pl-landing-earn .pl-earn-hero-foot {
        opacity: 1;
        transform: none;
        animation: none;
    }
}

@media (max-width: 860px) {
    body.pl-landing-earn .pl-earn-paths-grid {
        grid-template-columns: 1fr;
    }

    body.pl-landing-earn .pl-earn-hero-title {
        max-width: 11ch;
    }
}

@media (max-width: 560px) {
    body.pl-landing-earn .pl-earn-form {
        grid-template-columns: 1fr;
    }

    body.pl-landing-earn .pl-earn-hero-actions,
    body.pl-landing-earn .pl-earn-partner-actions,
    body.pl-landing-earn .pl-earn-refer-actions {
        width: 100%;
    }

    body.pl-landing-earn .pl-earn-hero-actions .pl-time-btn,
    body.pl-landing-earn .pl-earn-partner-actions .pl-time-btn,
    body.pl-landing-earn .pl-earn-refer-actions .pl-time-btn {
        flex: 1 1 auto;
        justify-content: center;
    }
}


/* ---- css/pl-legal.css ---- */
:root {
    --pl-bg: #ffffff;
    --pl-text: #0e0e0e;
    --pl-muted: #6f6f6f;
    --pl-border: #e4e4e4;
    --pl-font: "Helvetica Neue", Helvetica, Arial, sans-serif;
    --pl-inset: clamp(24px, 5vw, 56px);
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body.pl-legal {
    font-family: var(--pl-font);
    font-size: 15px;
    line-height: 1.65;
    color: var(--pl-text);
    background: var(--pl-bg);
    -webkit-font-smoothing: antialiased;
    --pl-landing-inset: var(--pl-inset);
}

.pl-legal-main {
    padding: 48px var(--pl-inset) 32px;
}

.pl-legal-content {
    max-width: 760px;
    margin: 0 auto;
}

.pl-legal-content h1 {
    margin: 0 0 24px;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.1;
}

.pl-legal-content h2 {
    margin: 32px 0 12px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    line-height: 1.4;
}

.pl-legal-content h2:empty {
    display: none;
}

.pl-legal-content p {
    margin: 0 0 16px;
    color: var(--pl-text);
}

.pl-legal-content ul {
    margin: 0 0 16px;
    padding-left: 1.25rem;
}

.pl-legal-content li {
    margin-bottom: 8px;
}

.pl-legal-content a {
    color: var(--pl-text);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pl-legal-content a:hover {
    opacity: 0.72;
}

.pl-legal-content .important-notice,
.pl-legal-content .sms-box {
    margin: 20px 0 24px;
    padding: 16px 18px;
    border: 1px solid var(--pl-border);
    border-radius: 8px;
    background: #fafafa;
}

.pl-legal-content .important-notice p:last-child,
.pl-legal-content .sms-box p:last-child {
    margin-bottom: 0;
}

@media (max-width: 640px) {
    .pl-legal-main {
        padding-top: 32px;
        padding-bottom: 56px;
    }
}


/* ---- css/pl-time-anims/shared.css ---- */
/**
 * Bento animation orchestration — pause until in-view, replay on hover.
 * Scoped to body.pl-landing-time only.
 */
/* Hold stage animations until the card scrolls into view / replays */
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-forms-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-forms-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-leads-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-leads-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ios-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ios-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-voice-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-voice-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ivr-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ivr-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-record-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-record-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-agent-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-agent-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-domain-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-domain-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-analytics-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-analytics-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-editor-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-editor-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-leads-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-leads-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-domain-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-domain-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-speed-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-speed-stage *,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-payments-stage,
body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-payments-stage * {
    animation-play-state: paused !important;
}

body.pl-landing-time.pl-bento-reveal .pl-time-grow-col {
    opacity: 0;
    transform: translate3d(0, 22px, 0);
    transition:
        opacity 0.75s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: var(--pl-bento-delay, 0ms);
}

body.pl-landing-time.pl-bento-reveal .pl-time-grow-col.is-inview {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time.pl-bento-reveal .pl-time-card,
    body.pl-landing-time.pl-bento-reveal .pl-time-grow-col {
        opacity: 1;
        transform: none;
        transition: none;
    }

    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-forms-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-forms-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-leads-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-leads-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ios-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ios-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-voice-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-voice-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ivr-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-ivr-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-record-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-record-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-agent-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-agent-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-domain-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-domain-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-analytics-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-analytics-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-editor-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-email-editor-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-leads-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-leads-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-domain-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-domain-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-speed-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-webstudio-speed-stage *,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-payments-stage,
    body.pl-landing-time.pl-bento-reveal .pl-time-card:not(.is-anim-run) .pl-time-payments-stage * {
        animation-play-state: running !important;
    }
}

/* Static bento cards — frozen end frame, no replay */
body.pl-landing-time .pl-time-card--static .pl-time-card-replay {
    display: none !important;
}

/* Leads — kill every animation in the stage */
body.pl-landing-time .pl-time-card--static .pl-time-leads-stage,
body.pl-landing-time .pl-time-card--static .pl-time-leads-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-leads-anim__app,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__row,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__badge,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__detail-head,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__call-ui,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__field,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__reply,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__foot,
body.pl-landing-time .pl-time-card--static .pl-leads-anim__wave i {
    opacity: 1 !important;
    transform: none !important;
    scale: 1 !important;
}

body.pl-landing-time .pl-time-card--static .pl-leads-anim__row--new {
    max-height: 60px;
}

body.pl-landing-time .pl-time-card--static .pl-leads-anim__ring {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-leads-anim__status-ring {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-leads-anim__status-live {
    opacity: 1 !important;
}

/* IVR — frozen end frame */
body.pl-landing-time .pl-time-card--static .pl-time-ivr-stage,
body.pl-landing-time .pl-time-card--static .pl-time-ivr-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__bar,
body.pl-landing-time .pl-time-card--static .pl-ivr-anim__menu,
body.pl-landing-time .pl-time-card--static .pl-ivr-anim__option,
body.pl-landing-time .pl-time-card--static .pl-ivr-anim__route {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__option--1 {
    background: rgba(21, 94, 239, 0.09);
    border-color: rgba(21, 94, 239, 0.4);
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__option--1 .pl-ivr-anim__key {
    background: #155eef;
    border-color: #155eef;
    color: #fff;
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__crew span i,
body.pl-landing-time .pl-time-card--static .pl-ivr-anim__state-ring {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__state-live {
    opacity: 1 !important;
}

body.pl-landing-time .pl-time-card--static .pl-ivr-anim__crew .is-answer {
    background: #16a34a;
}

/* Record — frozen end frame */
body.pl-landing-time .pl-time-card--static .pl-time-record-stage,
body.pl-landing-time .pl-time-card--static .pl-time-record-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__app,
body.pl-landing-time .pl-time-card--static .pl-record-anim__row--new,
body.pl-landing-time .pl-time-card--static .pl-record-anim__row--r1,
body.pl-landing-time .pl-time-card--static .pl-record-anim__row--r2,
body.pl-landing-time .pl-time-card--static .pl-record-anim__row--missed,
body.pl-landing-time .pl-time-card--static .pl-record-anim__playback {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__live {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__row--new {
    max-height: none;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom-width: 1px;
    background: rgba(219, 39, 119, 0.06);
    box-shadow: inset 2px 0 0 #db2777;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__row--new .pl-record-anim__rec-icon {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__live-timer::after {
    content: "0:42";
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__play-btn {
    background: #db2777;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__playhead {
    left: 42%;
    opacity: 1 !important;
}

body.pl-landing-time .pl-time-card--static .pl-record-anim__saved {
    opacity: 0 !important;
    transform: translate(-50%, -50%);
}

/* Web Studio leads — frozen end frame (iOS thread) */
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-leads-anim__form-scene {
    opacity: 0 !important;
    visibility: hidden !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-leads-anim__ios-scene {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__home {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__status {
    color: #111;
}

body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__toast {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__thread,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__sys,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__bubble,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__bubble-row,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__bubbles,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-leads-stage .pl-ios-anim__composer {
    opacity: 1 !important;
    transform: none !important;
}

/* Web Studio domain — frozen end frame (HTTPS browser) */
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-domain-stage,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-domain-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__lock-scene {
    opacity: 0 !important;
    visibility: hidden !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__secure-scene {
    opacity: 1 !important;
    visibility: visible !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__browser,
body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__url-bar,
body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__page {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__body {
    background: #111;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__shackle {
    border-color: #111;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-domain-anim__burst {
    opacity: 0 !important;
}

/* Web Studio speed — frozen end frame (comparison complete) */
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-speed-stage,
body.pl-landing-time .pl-time-card--static .pl-time-webstudio-speed-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__timer-wait {
    display: none;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__timer-done {
    opacity: 1 !important;
    position: static;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__skeleton {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__content {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__fill {
    width: 100%;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__result {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__step--1 {
    opacity: 1;
    font-weight: 650;
}

/* Forms code — frozen end frame (HTML panel) */
body.pl-landing-time .pl-time-card--static .pl-time-forms-code-stage,
body.pl-landing-time .pl-time-card--static .pl-time-forms-code-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__window,
body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__tab,
body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__panel {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__panel:not(.pl-forms-code-anim__panel--html) {
    display: none;
}

body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__tab--html {
    color: #f8fafc;
    background: rgba(124, 58, 237, 0.18);
    border-color: rgba(124, 58, 237, 0.35);
}

body.pl-landing-time .pl-time-card--static .pl-forms-code-anim__file::after {
    content: "contact.html";
}

/* Honeypot — frozen end frame (spam swept, real threads remain) */
body.pl-landing-time .pl-time-card--static .pl-time-honeypot-stage,
body.pl-landing-time .pl-time-card--static .pl-time-honeypot-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__row--bot,
body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__row--junk,
body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__row--junk2 {
    max-height: 0 !important;
    opacity: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;
}

body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__row--lead,
body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__row--quiet {
    opacity: 1 !important;
    transform: none !important;
    max-height: none;
}

body.pl-landing-time .pl-time-card--static .pl-honeypot-anim__tag {
    opacity: 1 !important;
    transform: none !important;
    scale: 1 !important;
}

/* Email automation — frozen end frame (follow-up complete) */
body.pl-landing-time .pl-time-card--static .pl-time-email-automation-stage,
body.pl-landing-time .pl-time-card--static .pl-time-email-automation-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__fly {
    display: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__flow,
body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__preview,
body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__node-body,
body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__badge,
body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__wait {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__mail {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-automation-anim__success {
    opacity: 1 !important;
    transform: none !important;
}

/* Email domain — frozen end frame (all records verified) */
body.pl-landing-time .pl-time-card--static .pl-time-email-domain-stage,
body.pl-landing-time .pl-time-card--static .pl-time-email-domain-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__shell,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__item::after,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__state i,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__state em,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__state b,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__ready,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__shield,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__shield-check,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__from-old,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__from-new {
    opacity: 1 !important;
    transform: none !important;
    stroke-dashoffset: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__state em,
body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__from-old {
    display: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-domain-anim__shield {
    color: #007a4d;
    background: #e6f4ec;
    border-color: rgba(0, 133, 86, 0.22);
}

/* Email analytics — frozen end frame (stats + engagement tags) */
body.pl-landing-time .pl-time-card--static .pl-time-email-analytics-stage,
body.pl-landing-time .pl-time-card--static .pl-time-email-analytics-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__shell,
body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__camp em,
body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__meter i,
body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__stat strong,
body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__row,
body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__tag {
    opacity: 1 !important;
    transform: none !important;
}

body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__stat--opens .pl-email-analytics-anim__meter i {
    width: 68%;
}

body.pl-landing-time .pl-time-card--static .pl-email-analytics-anim__stat--clicks .pl-email-analytics-anim__meter i {
    width: 24%;
}

/* Voice — kill every animation in the stage, then set end frame */
body.pl-landing-time .pl-time-card--static .pl-time-voice-stage,
body.pl-landing-time .pl-time-card--static .pl-time-voice-stage * {
    animation: none !important;
    animation-delay: 0s !important;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__phone,
body.pl-landing-time .pl-time-card--static .pl-voice-anim__row {
    opacity: 1 !important;
    transform: none !important;
    max-height: none;
    padding-top: 7px;
    padding-bottom: 7px;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__row--new,
body.pl-landing-time .pl-time-card--static .pl-voice-anim__row--new2 {
    max-height: 52px;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__ring {
    opacity: 0 !important;
    transform: none;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__row--new .pl-voice-anim__dir {
    background: #dcfce7;
    color: #15803d;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__state-ring {
    opacity: 0 !important;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__state-live {
    opacity: 1 !important;
}

body.pl-landing-time .pl-time-card--static .pl-voice-anim__answer .pl-voice-anim__av {
    opacity: 1 !important;
    transform: none;
}


/* ---- css/pl-time-anims/ios.css ---- */
/**
 * iOS push toast + call screen bento animations.
 * Scoped to body.pl-landing-time only.
 */
/* iOS push toast → open thread */
body.pl-landing-time .pl-time-ios-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 8px 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-ios-anim {
    --ios-cycle: 7.5s;
    position: relative;
    width: 100%;
    max-width: 210px;
    margin: 0 auto;
    padding-top: 4px;
}

body.pl-landing-time .pl-ios-anim__phone {
    position: relative;
    width: 168px;
    height: 232px;
    margin: 22px auto 0;
    border-radius: 28px 28px 0 0;
    border: 2px solid #111;
    border-bottom: none;
    background: #111;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 18px 40px rgba(0, 0, 0, 0.16);
    overflow: hidden;
    z-index: 1;
}

body.pl-landing-time .pl-ios-anim__notch {
    position: absolute;
    top: 8px;
    left: 50%;
    translate: -50% 0;
    width: 56px;
    height: 14px;
    border-radius: 999px;
    background: #000;
    z-index: 5;
}

body.pl-landing-time .pl-ios-anim__status {
    display: none;
}

body.pl-landing-time .pl-ios-anim__home {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    animation: plIosHome var(--ios-cycle) ease-in-out 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-anim__wallpaper {
    position: absolute;
    inset: 0;
    background: #111;
}

body.pl-landing-time .pl-ios-anim__wallpaper::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 70% 28%, rgba(255, 255, 255, 0.08), transparent 28%),
        radial-gradient(circle at 30% 70%, rgba(255, 255, 255, 0.04), transparent 35%);
}

body.pl-landing-time .pl-ios-anim__home-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px 6px;
    padding: 40px 12px 0;
}

body.pl-landing-time .pl-ios-anim__app {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    min-width: 0;
}

body.pl-landing-time .pl-ios-anim__app-icon {
    position: relative;
    width: 28px;
    height: 28px;
    border-radius: 7px;
    display: grid;
    place-items: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
}

body.pl-landing-time .pl-ios-anim__app--pathline .pl-ios-anim__app-icon {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app--pathline .pl-ios-anim__app-icon img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
}

body.pl-landing-time .pl-ios-anim__app-badge {
    position: absolute;
    top: -3px;
    right: -3px;
    z-index: 2;
    min-width: 12px;
    height: 12px;
    padding: 0 3px;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font-size: 7px;
    font-weight: 700;
    line-height: 12px;
    text-align: center;
    box-shadow: 0 0 0 1.5px #111;
    animation: plIosBadgePulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__app-label {
    font-size: 6.5px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.92);
    letter-spacing: -0.01em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail span {
    width: 14px;
    height: 10px;
    border: 1.5px solid #111;
    border-radius: 2px;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--mail span::before {
    content: "";
    position: absolute;
    top: 1px;
    left: 1px;
    right: 1px;
    height: 5px;
    border-top: 1.5px solid #111;
    border-left: 1.5px solid #111;
    transform: rotate(45deg) scale(0.72);
    transform-origin: top left;
}

body.pl-landing-time .pl-ios-anim__app-icon--maps {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--maps span {
    width: 8px;
    height: 8px;
    border-radius: 50% 50% 50% 0;
    background: #fff;
    rotate: -45deg;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

body.pl-landing-time .pl-ios-anim__app-icon--photos {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--photos span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: conic-gradient(
        #111 0 25%,
        #6b7280 25% 50%,
        #d1d5db 50% 75%,
        #111 75% 100%
    );
    mask: radial-gradient(circle, transparent 28%, #000 30%);
    -webkit-mask: radial-gradient(circle, transparent 28%, #000 30%);
}

body.pl-landing-time .pl-ios-anim__app-icon--notes {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--notes span {
    width: 12px;
    height: 2px;
    border-radius: 1px;
    background: #111;
    box-shadow: 0 4px 0 #d4d4d8, 0 8px 0 #d4d4d8;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar {
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0;
    padding-top: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar em {
    font-style: normal;
    font-size: 11px;
    font-weight: 700;
    color: #111;
    line-height: 1;
    letter-spacing: -0.03em;
    margin-top: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--calendar::before {
    content: "WED";
    font-size: 5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #111;
    line-height: 1;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera span {
    width: 12px;
    height: 10px;
    border: 1.5px solid rgba(255, 255, 255, 0.9);
    border-radius: 3px;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--camera span::after {
    content: "";
    position: absolute;
    inset: 1.5px;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.9);
}

body.pl-landing-time .pl-ios-anim__app-icon--settings {
    background: #6b7280;
}

body.pl-landing-time .pl-ios-anim__app-icon--settings span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 0 0 2.5px #8e8e93;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--settings span::before {
    content: "";
    position: absolute;
    inset: -3px;
    background:
        conic-gradient(from 20deg, transparent 0 28deg, #fff 28deg 48deg, transparent 48deg 90deg);
    mask: radial-gradient(circle, transparent 42%, #000 44%);
    -webkit-mask: radial-gradient(circle, transparent 42%, #000 44%);
    opacity: 0.85;
}

body.pl-landing-time .pl-ios-anim__dots {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    gap: 4px;
    margin-top: auto;
    margin-bottom: 8px;
}

body.pl-landing-time .pl-ios-anim__dots i {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.35);
}

body.pl-landing-time .pl-ios-anim__dots i:first-child {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__dock {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin: 0 10px 12px;
    padding: 8px 10px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app-icon {
    width: 26px;
    height: 26px;
    border-radius: 7px;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app--dock {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app--pathline .pl-ios-anim__app-icon {
    overflow: visible;
}

body.pl-landing-time .pl-ios-anim__dock .pl-ios-anim__app-badge {
    top: -4px;
    right: -4px;
    background: #155eef;
    color: #fff;
    box-shadow: 0 0 0 1.5px rgba(15, 23, 42, 0.9);
}

body.pl-landing-time .pl-ios-anim__app-icon--phone {
    background: #111;
}

body.pl-landing-time .pl-ios-anim__app-icon--phone span {
    width: 10px;
    height: 10px;
    border-radius: 3px 3px 2px 8px;
    background: #fff;
    rotate: -25deg;
}

body.pl-landing-time .pl-ios-anim__app-icon--safari {
    background: #fff;
}

body.pl-landing-time .pl-ios-anim__app-icon--safari span {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid #111;
    background:
        linear-gradient(135deg, transparent 44%, #111 44% 56%, transparent 56%),
        linear-gradient(45deg, transparent 44%, #6b7280 44% 56%, transparent 56%);
}

body.pl-landing-time .pl-ios-anim__app-icon--messages {
    background: #111;
}

body.pl-landing-time .pl-ios-anim__app-icon--messages span {
    width: 12px;
    height: 9px;
    border-radius: 8px;
    background: #fff;
    position: relative;
}

body.pl-landing-time .pl-ios-anim__app-icon--messages span::after {
    content: "";
    position: absolute;
    left: 2px;
    bottom: -3px;
    width: 5px;
    height: 5px;
    background: #fff;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}

body.pl-landing-time .pl-ios-anim__app-icon--music {
    background: #2a2a2a;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    border: 1.5px solid #fff;
    position: relative;
    margin-top: 3px;
    margin-right: 4px;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span::before {
    content: "";
    position: absolute;
    left: 5px;
    bottom: 5px;
    width: 1.5px;
    height: 10px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-anim__app-icon--music span::after {
    content: "";
    position: absolute;
    left: 5px;
    bottom: 13px;
    width: 6px;
    height: 4px;
    background: #fff;
    border-radius: 1px 2px 0 0;
    transform: skewX(-18deg);
}

/* Non-Pathline icons: blank skeletons only */
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img)),
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon {
    background: rgba(255, 255, 255, 0.22) !important;
    box-shadow: none;
}

body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img)) > *,
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img))::before,
body.pl-landing-time .pl-ios-anim__app-icon:not(:has(img))::after,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon > *,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon::before,
body.pl-landing-time .pl-ios-anim__dock > .pl-ios-anim__app-icon::after {
    display: none !important;
}

body.pl-landing-time .pl-ios-anim__toast {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 8;
    display: flex;
    gap: 10px;
    align-items: center;
    min-height: 54px;
    padding: 10px 12px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 14px 36px rgba(0, 0, 0, 0.16);
    color: #111;
    opacity: 0;
    transform: translateY(-130%) scale(0.98);
    animation: plIosToast var(--ios-cycle) cubic-bezier(0.16, 1, 0.3, 1) 1 forwards;
    transform-origin: top center;
}

body.pl-landing-time .pl-ios-anim__toast-icon {
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #fff;
    display: grid;
    place-items: center;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-ios-anim__toast-icon img {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: cover !important;
}

body.pl-landing-time .pl-ios-anim__toast-body {
    min-width: 0;
    flex: 1;
    padding-top: 0;
}

body.pl-landing-time .pl-ios-anim__toast-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 6px;
    margin-bottom: 1px;
}

body.pl-landing-time .pl-ios-anim__toast-top strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__toast-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-ios-anim__toast-title {
    margin: 0 !important;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: #111;
}

body.pl-landing-time .pl-ios-anim__toast-copy {
    margin: 1px 0 0 !important;
    font-size: 11px;
    line-height: 1.3;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__thread {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    background: #fff;
    opacity: 0;
    transform: translateY(12px) scale(0.98);
    animation: plIosThread var(--ios-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-anim__thread-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 28px 10px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: #fafafa;
}

body.pl-landing-time .pl-ios-anim__back {
    width: 8px;
    height: 8px;
    border-left: 2px solid #111;
    border-bottom: 2px solid #111;
    rotate: 45deg;
    margin-left: 4px;
}

body.pl-landing-time .pl-ios-anim__thread-who {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-ios-anim__thread-who strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    line-height: 1.2;
}

body.pl-landing-time .pl-ios-anim__thread-who span {
    font-size: 9px;
    font-weight: 500;
    color: #6b7280;
}

body.pl-landing-time .pl-ios-anim__bubbles {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 7px;
    padding: 12px 10px;
    overflow: hidden;
    min-height: 0;
    animation: plIosBubblesShift var(--ios-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-ios-anim__sys {
    align-self: center;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #6b7280;
    font-size: 8px;
    font-weight: 600;
    opacity: 0;
    animation: plIosBubble1 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble {
    max-width: 88%;
    padding: 7px 9px;
    border-radius: 14px;
    font-size: 10px;
    line-height: 1.35;
    letter-spacing: -0.01em;
    opacity: 0;
    transform: translateY(8px) scale(0.96);
}

body.pl-landing-time .pl-ios-anim__bubble--in {
    align-self: flex-start;
    background: #f2f2f7;
    color: #111;
    border-bottom-left-radius: 4px;
    animation: plIosBubble2 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble-row {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    max-width: 100%;
    opacity: 0;
    transform: translateY(8px) scale(0.96);
    animation: plIosBubble3 var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-anim__bubble-row--out {
    align-self: flex-end;
    flex-direction: row;
}

body.pl-landing-time .pl-ios-anim__bubble--out {
    max-width: none;
    background: #155eef;
    color: #fff;
    border-bottom-right-radius: 4px;
    animation: none;
    opacity: 1;
    transform: none;
}

body.pl-landing-time .pl-ios-anim__bubble-actor {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0d9488;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
}

body.pl-landing-time .pl-ios-anim__bubble-actor--alex {
    background: #0d9488;
}

body.pl-landing-time .pl-ios-anim__composer {
    margin: 0 8px 10px;
    padding: 7px 11px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fff;
    font-size: 10px;
    color: #9ca3af;
    opacity: 0;
    animation: plIosComposer var(--ios-cycle) ease-out 1 forwards;
}

@keyframes plIosToast {
    0%, 6% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
        box-shadow:
            0 1px 2px rgba(0, 0, 0, 0.04),
            0 14px 36px rgba(0, 0, 0, 0.16);
    }
    12% {
        opacity: 1;
        transform: translateY(0) scale(1.02);
        box-shadow:
            0 2px 4px rgba(0, 0, 0, 0.06),
            0 18px 44px rgba(0, 0, 0, 0.2);
    }
    16% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    34% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    38% {
        opacity: 1;
        transform: translateY(3px) scale(0.985);
    }
    44% {
        opacity: 0;
        transform: translateY(-18px) scale(0.92);
    }
    100% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
}

@keyframes plIosHome {
    0%, 42% { opacity: 1; }
    48%, 100% { opacity: 0; }
}

@keyframes plIosStatus {
    0%, 42% { color: #fff; }
    48%, 100% { color: #111; }
}

@keyframes plIosBadgePulse {
    0%, 10% { transform: scale(0.7); opacity: 0; }
    16%, 42% { transform: scale(1); opacity: 1; }
    48%, 100% { transform: scale(1); opacity: 0; }
}

@keyframes plIosThread {
    0%, 42% {
        opacity: 0;
        transform: translateY(16px) scale(0.98);
    }
    48%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosBubble1 {
    0%, 50% { opacity: 0; }
    54%, 100% { opacity: 1; }
}

@keyframes plIosBubble2 {
    0%, 54% {
        opacity: 0;
        transform: translateY(8px) scale(0.96);
    }
    60%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosBubble3 {
    0%, 64% {
        opacity: 0;
        transform: translateY(8px) scale(0.96);
    }
    70%, 100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes plIosBubblesShift {
    0%, 64% {
        transform: translateY(18px);
    }
    72%, 100% {
        transform: translateY(0);
    }
}

@keyframes plIosComposer {
    0%, 68% { opacity: 0; }
    74%, 100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-ios-anim__toast,
    body.pl-landing-time .pl-ios-anim__home,
    body.pl-landing-time .pl-ios-anim__status,
    body.pl-landing-time .pl-ios-anim__app-badge,
    body.pl-landing-time .pl-ios-anim__thread,
    body.pl-landing-time .pl-ios-anim__sys,
    body.pl-landing-time .pl-ios-anim__bubble,
    body.pl-landing-time .pl-ios-anim__bubble-row,
    body.pl-landing-time .pl-ios-anim__bubbles,
    body.pl-landing-time .pl-ios-anim__composer {
        animation: none !important;
    }

    body.pl-landing-time .pl-ios-anim__home {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim__status {
        color: #111;
    }

    body.pl-landing-time .pl-ios-anim__toast {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim__thread,
    body.pl-landing-time .pl-ios-anim__sys,
    body.pl-landing-time .pl-ios-anim__bubble,
    body.pl-landing-time .pl-ios-anim__bubble-row,
    body.pl-landing-time .pl-ios-anim__bubbles,
    body.pl-landing-time .pl-ios-anim__composer {
        opacity: 1;
        transform: none;
    }
}

/* iOS call variant — incoming → answer → connected */
body.pl-landing-time .pl-ios-anim--call {
    --ios-cycle: 8s;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__toast {
    animation-name: plIosCallToast;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__home {
    animation-name: plIosCallHome;
}

body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__status {
    animation-name: plIosCallStatus;
}

body.pl-landing-time .pl-ios-anim__home-grid--call {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding-top: 46px;
}

body.pl-landing-time .pl-ios-call-in,
body.pl-landing-time .pl-ios-call-live {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    align-items: center;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-call-in {
    padding: 34px 12px 16px;
    background:
        radial-gradient(circle at 50% 18%, rgba(255, 255, 255, 0.08), transparent 42%),
        linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
    color: #fff;
    opacity: 0;
    animation: plIosCallIn var(--ios-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__rings {
    position: absolute;
    top: 52px;
    left: 50%;
    width: 58px;
    height: 58px;
    translate: -50% 0;
    pointer-events: none;
}

body.pl-landing-time .pl-ios-call-in__rings i {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1.5px solid rgba(255, 255, 255, 0.22);
    opacity: 0;
    animation: plIosCallRing var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__rings i:nth-child(2) { animation-delay: 0.22s; }
body.pl-landing-time .pl-ios-call-in__rings i:nth-child(3) { animation-delay: 0.44s; }

body.pl-landing-time .pl-ios-call-in__av {
    position: relative;
    z-index: 1;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #fff;
    color: #111;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.03em;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2);
    animation: plIosCallAvPulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__name {
    margin-top: 10px;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

body.pl-landing-time .pl-ios-call-in__sub {
    margin-top: 2px;
    font-size: 8px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.52);
}

body.pl-landing-time .pl-ios-call-in__label {
    margin-top: 6px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.62);
    animation: plIosCallLabelPulse 1.2s ease-in-out infinite;
}

body.pl-landing-time .pl-ios-call-in__actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-top: auto;
    padding-bottom: 4px;
}

body.pl-landing-time .pl-ios-call-in__btn {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    position: relative;
}

body.pl-landing-time .pl-ios-call-in__btn--decline {
    background: #ef4444;
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.28);
}

body.pl-landing-time .pl-ios-call-in__btn--decline::before,
body.pl-landing-time .pl-ios-call-in__btn--decline::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-call-in__btn--decline::before {
    rotate: 45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-in__btn--decline::after {
    rotate: -45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-in__btn--accept {
    display: grid;
    place-items: center;
    background: #22c55e;
    color: #fff;
    box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28);
    animation: plIosCallAcceptPulse var(--ios-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-in__btn--accept svg {
    display: block;
    width: 15px;
    height: 15px;
}

body.pl-landing-time .pl-ios-call-live {
    padding: 38px 12px 18px;
    background:
        radial-gradient(circle at 50% 12%, rgba(34, 197, 94, 0.12), transparent 40%),
        linear-gradient(180deg, #141414 0%, #080808 100%);
    color: #fff;
    opacity: 0;
    animation: plIosCallLive var(--ios-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-ios-call-live__av {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #22c55e;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.03em;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.18);
}

body.pl-landing-time .pl-ios-call-live__name {
    margin-top: 8px;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-ios-call-live__timer {
    margin-top: 3px;
    font-size: 10px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: rgba(255, 255, 255, 0.72);
    min-height: 1em;
}

body.pl-landing-time .pl-ios-call-live__timer::after {
    content: "0:04";
    animation: plIosCallTimer var(--ios-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-ios-call-live__wave {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 3px;
    height: 18px;
    margin-top: 12px;
}

body.pl-landing-time .pl-ios-call-live__wave i {
    display: block;
    width: 3px;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.85);
    animation: plIosCallWaveBar 0.9s ease-in-out infinite;
}

body.pl-landing-time .pl-ios-call-live__wave i:nth-child(1) { height: 6px; animation-delay: 0s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(2) { height: 10px; animation-delay: 0.08s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(3) { height: 14px; animation-delay: 0.16s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(4) { height: 9px; animation-delay: 0.24s; }
body.pl-landing-time .pl-ios-call-live__wave i:nth-child(5) { height: 7px; animation-delay: 0.32s; }

body.pl-landing-time .pl-ios-call-live__badge {
    margin-top: 8px;
    padding: 3px 8px;
    border-radius: 999px;
    background: rgba(34, 197, 94, 0.16);
    color: #86efac;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.pl-landing-time .pl-ios-call-live__end {
    margin-top: auto;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #ef4444;
    box-shadow: 0 8px 18px rgba(239, 68, 68, 0.24);
    position: relative;
}

body.pl-landing-time .pl-ios-call-live__end::before,
body.pl-landing-time .pl-ios-call-live__end::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 14px;
    height: 2px;
    background: #fff;
    border-radius: 1px;
}

body.pl-landing-time .pl-ios-call-live__end::before {
    rotate: 45deg;
    translate: -50% -50%;
}

body.pl-landing-time .pl-ios-call-live__end::after {
    rotate: -45deg;
    translate: -50% -50%;
}

@keyframes plIosCallToast {
    0%, 6% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
    12%, 16% {
        opacity: 1;
        transform: translateY(0) scale(1.02);
    }
    20%, 28% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    34% {
        opacity: 0;
        transform: translateY(-18px) scale(0.92);
    }
    100% {
        opacity: 0;
        transform: translateY(-140%) scale(0.94);
    }
}

@keyframes plIosCallHome {
    0%, 30% { opacity: 1; }
    36%, 100% { opacity: 0; }
}

@keyframes plIosCallStatus {
    0%, 30% { color: #fff; }
    36%, 54% { color: #fff; }
    58%, 100% { color: #fff; }
}

@keyframes plIosCallIn {
    0%, 32% {
        opacity: 0;
        transform: scale(1.02);
    }
    38%, 54% {
        opacity: 1;
        transform: scale(1);
    }
    58% {
        opacity: 1;
        transform: scale(0.98);
    }
    62%, 100% {
        opacity: 0;
        transform: scale(0.96);
    }
}

@keyframes plIosCallLive {
    0%, 60% {
        opacity: 0;
        transform: translateY(8px);
    }
    66%, 100% {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes plIosCallRing {
    0%, 38% { opacity: 0; transform: scale(0.6); }
    44% { opacity: 0.55; transform: scale(0.85); }
    56% { opacity: 0; transform: scale(1.45); }
    100% { opacity: 0; transform: scale(1.45); }
}

@keyframes plIosCallAvPulse {
    0%, 38% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2); }
    44%, 54% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

@keyframes plIosCallAcceptPulse {
    0%, 48% { transform: scale(1); box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28); }
    52% { transform: scale(1.12); box-shadow: 0 10px 24px rgba(34, 197, 94, 0.42); }
    56%, 100% { transform: scale(1); box-shadow: 0 8px 18px rgba(34, 197, 94, 0.28); }
}

@keyframes plIosCallLabelPulse {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 1; }
}

@keyframes plIosCallTimer {
    0%, 66% { content: "0:01"; }
    72% { content: "0:02"; }
    78% { content: "0:03"; }
    84%, 100% { content: "0:04"; }
}

@keyframes plIosCallWaveBar {
    0%, 100% { transform: scaleY(0.55); opacity: 0.55; }
    50% { transform: scaleY(1); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__rings i,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__av,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__btn--accept,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in__label,
    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live__wave i {
        animation: none !important;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-anim__home {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-in {
        opacity: 0;
    }

    body.pl-landing-time .pl-ios-anim--call .pl-ios-call-live {
        opacity: 1;
        transform: none;
    }
}


/* ---- css/pl-time-anims/leads.css ---- */
/**
 * Website forms → Pathline Messages, single full-width workspace scene.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-leads-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-leads-anim {
    --leads-cycle: 7.6s;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    pointer-events: none;
}

/* Prevent iOS Safari auto-linking demo phone numbers as tel: */
body.pl-landing-time .pl-leads-anim a[x-apple-data-detectors],
body.pl-landing-time .pl-leads-anim a[href^="tel:"] {
    color: inherit !important;
    text-decoration: none !important;
    font-weight: inherit !important;
    font-style: inherit !important;
    pointer-events: none;
}

body.pl-landing-time .pl-leads-anim__app {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    opacity: 0;
    transform: translateY(10px);
    animation: plLeadsAppIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__bar {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fafafa;
}

body.pl-landing-time .pl-leads-anim__bar img {
    display: block;
    height: 12px;
    width: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-leads-anim__bar strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-leads-anim__bar-sep {
    width: 1px;
    height: 12px;
    background: rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-leads-anim__badge {
    box-sizing: border-box;
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    background: #155eef;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-align: center;
    opacity: 0;
    scale: 0.6;
    animation: plLeadsBadge var(--leads-cycle) ease-out 1 forwards;
}

/* Nudge only the glyph — not the circle — so "1" sits dead-center. */
body.pl-landing-time .pl-leads-anim__badge > span {
    display: block;
    line-height: 1;
    translate: 0 -1px;
}

body.pl-landing-time .pl-leads-anim__team {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
}

body.pl-landing-time .pl-leads-anim__team .pl-leads-anim__av {
    margin-left: -6px;
}

body.pl-landing-time .pl-leads-anim__av {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid #fff;
    background: #111;
    color: #fff;
    font-size: 7px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

body.pl-landing-time .pl-leads-anim__av--al { background: #0d9488; }
body.pl-landing-time .pl-leads-anim__av--sm { background: #155eef; }
body.pl-landing-time .pl-leads-anim__av--jr { background: #7c3aed; }
body.pl-landing-time .pl-leads-anim__av--lead {
    width: 26px;
    height: 26px;
    font-size: 9px;
    background: #111;
}

body.pl-landing-time .pl-leads-anim__body {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1fr);
}

body.pl-landing-time .pl-leads-anim__list {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(0, 0, 0, 0.07);
    overflow: hidden;
}

body.pl-landing-time .pl-leads-anim__row {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(6px);
    animation: plLeadsRowIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__row--r1 { animation-delay: 0.3s; }
body.pl-landing-time .pl-leads-anim__row--r2 { animation-delay: 0.45s; }
body.pl-landing-time .pl-leads-anim__row--r3 { animation-delay: 0.6s; }

/* The submission lands at the top of the shared inbox and stays selected. */
body.pl-landing-time .pl-leads-anim__row--new {
    position: relative;
    overflow: hidden;
    background: rgba(21, 94, 239, 0.06);
    box-shadow: inset 2px 0 0 #155eef;
    animation-name: plLeadsRowLand;
}

body.pl-landing-time .pl-leads-anim__row-body {
    min-width: 0;
    flex: 1;
}

body.pl-landing-time .pl-leads-anim__row-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 2px;
}

body.pl-landing-time .pl-leads-anim__row-top strong {
    font-size: 11px;
    font-weight: 560;
    letter-spacing: -0.02em;
    color: #4b5563;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-leads-anim__row-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-leads-anim__row p {
    margin: 0 !important;
    font-size: 10px;
    line-height: 1.35;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-leads-anim__row--new .pl-leads-anim__row-top strong {
    font-weight: 700;
    color: #111;
}

body.pl-landing-time .pl-leads-anim__row--new .pl-leads-anim__row-top em { color: #155eef; }
body.pl-landing-time .pl-leads-anim__row--new p { color: #374151; font-weight: 550; }

body.pl-landing-time .pl-leads-anim__detail {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 12px 14px;
    overflow: hidden;
}

body.pl-landing-time .pl-leads-anim__detail-head {
    display: flex;
    align-items: center;
    gap: 9px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(6px);
    animation: plLeadsDetailIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__detail-who {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-leads-anim__detail-who strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-leads-anim__detail-who span {
    font-size: 9px;
    font-weight: 500;
    color: #9ca3af;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-leads-anim__source {
    flex: 0 0 auto;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(21, 94, 239, 0.1);
    color: #155eef;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.pl-landing-time .pl-leads-anim__fields {
    display: flex;
    flex-direction: column;
    padding: 10px 0 0;
}

body.pl-landing-time .pl-leads-anim__field {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 5px 0;
    opacity: 0;
    transform: translateY(6px);
    animation: plLeadsFieldIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__field:nth-child(1) { animation-delay: 0.1s; }
body.pl-landing-time .pl-leads-anim__field:nth-child(2) { animation-delay: 0.24s; }
body.pl-landing-time .pl-leads-anim__field:nth-child(3) { animation-delay: 0.38s; }
body.pl-landing-time .pl-leads-anim__field:nth-child(4) { animation-delay: 0.52s; }

body.pl-landing-time .pl-leads-anim__field em {
    flex: 0 0 46px;
    font-style: normal;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-leads-anim__field b {
    min-width: 0;
    font-size: 11px;
    font-weight: 550;
    letter-spacing: -0.01em;
    color: #111;
    line-height: 1.35;
}

body.pl-landing-time .pl-leads-anim__reply {
    margin-top: auto;
    padding-top: 10px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 6px;
    opacity: 0;
    transform: translateY(8px);
    animation: plLeadsReplyIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__bubble {
    max-width: 82%;
    padding: 8px 10px;
    border-radius: 14px;
    border-bottom-right-radius: 4px;
    background: #155eef;
    color: #fff;
    font-size: 11px;
    line-height: 1.35;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-leads-anim__call-ui {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 0 0;
    opacity: 0;
    transform: translateY(6px);
    animation: plLeadsDetailIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__call-summary {
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    line-height: 1.25;
}

body.pl-landing-time .pl-leads-anim__call-when {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #6b7280;
    line-height: 1.3;
}

body.pl-landing-time .pl-leads-anim__call-phone {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-top: 4px;
    padding-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-leads-anim__call-phone span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-leads-anim__call-phone strong {
    font-size: 12px;
    font-weight: 550;
    letter-spacing: -0.01em;
    color: #111;
}

/* —— Shared line variant: same workspace shell, call content —— */
body.pl-landing-time .pl-leads-anim__dir {
    position: relative;
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f3f4f6;
    color: #4b5563;
}

body.pl-landing-time .pl-leads-anim__dir svg {
    width: 11px;
    height: 11px;
}

body.pl-landing-time .pl-leads-anim__dir--miss {
    background: #fef2f2;
    color: #dc2626;
}

body.pl-landing-time .pl-leads-anim__row--new .pl-leads-anim__dir {
    background: #ecfdf5;
    color: #15803d;
}

body.pl-landing-time .pl-leads-anim__ring {
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 1.5px solid rgba(22, 163, 74, 0.55);
    opacity: 0;
    animation: plLeadsRingPulse var(--leads-cycle) ease-out 1 forwards;
}

/* Ring group swaps to whoever picked up, in place. */
body.pl-landing-time .pl-leads-anim__status {
    position: relative;
    display: block;
    height: 18px;
    overflow: hidden;
}

body.pl-landing-time .pl-leads-anim__status em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    gap: 5px;
    font-style: normal;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    white-space: nowrap;
    color: #111;
}

body.pl-landing-time .pl-leads-anim__status-ring {
    animation: plLeadsStatusRing var(--leads-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-leads-anim__status-live {
    opacity: 0;
    animation: plLeadsStatusLive var(--leads-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-leads-anim__mini {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid #fff;
    color: #fff;
    font-size: 6px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

body.pl-landing-time .pl-leads-anim__mini + .pl-leads-anim__mini {
    margin-left: -6px;
}

body.pl-landing-time .pl-leads-anim__foot {
    margin-top: auto;
    padding-top: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    opacity: 0;
    transform: translateY(8px);
    animation: plLeadsReplyIn var(--leads-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-leads-anim__play {
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #111;
    color: #fff;
}

body.pl-landing-time .pl-leads-anim__play svg {
    width: 9px;
    height: 9px;
    margin-left: 1px;
}

body.pl-landing-time .pl-leads-anim__wave {
    flex: 1;
    min-width: 0;
    height: 20px;
    display: flex;
    align-items: center;
    gap: 2px;
}

body.pl-landing-time .pl-leads-anim__wave i {
    flex: 1;
    height: 40%;
    border-radius: 1px;
    background: #d1d5db;
    transform-origin: center;
    animation: plLeadsWave 1.1s ease-in-out infinite;
}

body.pl-landing-time .pl-leads-anim__wave i:nth-child(3n) { height: 78%; animation-delay: 0.12s; }
body.pl-landing-time .pl-leads-anim__wave i:nth-child(3n + 1) { height: 55%; animation-delay: 0.26s; }
body.pl-landing-time .pl-leads-anim__wave i:nth-child(4n) { height: 92%; animation-delay: 0.38s; }

body.pl-landing-time .pl-leads-anim__rec-time {
    flex: 0 0 auto;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #6b7280;
}

@keyframes plLeadsAppIn {
    0% { opacity: 0; transform: translateY(10px); }
    8%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plLeadsRingPulse {
    0%, 30% { opacity: 0; transform: scale(0.7); }
    38% { opacity: 0.85; transform: scale(0.95); }
    56% { opacity: 0; transform: scale(1.6); }
    100% { opacity: 0; transform: scale(1.6); }
}

@keyframes plLeadsStatusRing {
    0%, 58% { opacity: 1; }
    64%, 100% { opacity: 0; }
}

@keyframes plLeadsStatusLive {
    0%, 60% { opacity: 0; }
    66%, 100% { opacity: 1; }
}

@keyframes plLeadsWave {
    0%, 100% { transform: scaleY(0.6); }
    50% { transform: scaleY(1); }
}

@keyframes plLeadsRowIn {
    0%, 5% { opacity: 0; transform: translateY(6px); }
    13%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plLeadsRowLand {
    0%, 22% {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        transform: translateY(-5px);
    }
    32%, 100% {
        opacity: 1;
        max-height: 60px;
        padding-top: 10px;
        padding-bottom: 10px;
        transform: translateY(0);
    }
}

@keyframes plLeadsBadge {
    0%, 28% { opacity: 0; scale: 0.6; }
    34% { opacity: 1; scale: 1.14; }
    40%, 100% { opacity: 1; scale: 1; }
}

@keyframes plLeadsDetailIn {
    0%, 34% { opacity: 0; transform: translateY(6px); }
    42%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plLeadsFieldIn {
    0%, 40% { opacity: 0; transform: translateY(6px); }
    48%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plLeadsReplyIn {
    0%, 72% { opacity: 0; transform: translateY(8px); }
    80%, 100% { opacity: 1; transform: translateY(0); }
}

/* Narrow cards drop the list and keep the submission itself. */
@media (max-width: 720px) {
    body.pl-landing-time .pl-leads-anim__body {
        grid-template-columns: minmax(0, 1fr);
    }

    body.pl-landing-time .pl-leads-anim__list {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-leads-anim__app,
    body.pl-landing-time .pl-leads-anim__row,
    body.pl-landing-time .pl-leads-anim__badge,
    body.pl-landing-time .pl-leads-anim__detail-head,
    body.pl-landing-time .pl-leads-anim__call-ui,
    body.pl-landing-time .pl-leads-anim__field,
    body.pl-landing-time .pl-leads-anim__reply,
    body.pl-landing-time .pl-leads-anim__foot,
    body.pl-landing-time .pl-leads-anim__wave i {
        animation: none !important;
        opacity: 1;
        transform: none;
        scale: 1;
    }

    body.pl-landing-time .pl-leads-anim__row--new {
        max-height: 60px;
    }

    body.pl-landing-time .pl-leads-anim__ring {
        animation: none !important;
        opacity: 0;
    }

    body.pl-landing-time .pl-leads-anim__status-ring {
        animation: none !important;
        opacity: 0;
    }

    body.pl-landing-time .pl-leads-anim__status-live {
        animation: none !important;
        opacity: 1;
    }
}


/* ---- css/pl-time-anims/ivr.css ---- */
/**
 * Dial-by-menu bento animation — one scene: caller hears the menu, presses 1,
 * and the sales team rings in place under the chosen option.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-ivr-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 12px 10px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-ivr-anim {
    --ivr-cycle: 9s;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    height: 100%;
    min-height: 0;
}

/* —— Caller bar —— */
body.pl-landing-time .pl-ivr-anim__bar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 11px;
    background: #111;
    color: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
    opacity: 0;
    transform: translateY(-10px);
    animation: plIvrBarIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__bars {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #155eef;
}

body.pl-landing-time .pl-ivr-anim__bars span {
    display: flex;
    align-items: center;
    gap: 2px;
    height: 13px;
}

body.pl-landing-time .pl-ivr-anim__bars i {
    display: block;
    width: 2px;
    height: 100%;
    border-radius: 999px;
    background: #fff;
    transform-origin: center;
    animation: plIvrBar 0.8s ease-in-out infinite;
}

body.pl-landing-time .pl-ivr-anim__bars i:nth-child(1) { animation-delay: 0s; }
body.pl-landing-time .pl-ivr-anim__bars i:nth-child(2) { animation-delay: 0.1s; }
body.pl-landing-time .pl-ivr-anim__bars i:nth-child(3) { animation-delay: 0.2s; }
body.pl-landing-time .pl-ivr-anim__bars i:nth-child(4) { animation-delay: 0.3s; }

body.pl-landing-time .pl-ivr-anim__bar-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-ivr-anim__bar-copy em {
    font-style: normal;
    font-size: 8px;
    font-weight: 750;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}

body.pl-landing-time .pl-ivr-anim__bar-copy strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

/* —— Menu panel (single scene) —— */
body.pl-landing-time .pl-ivr-anim__menu {
    position: relative;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 10px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    opacity: 0;
    transform: translateY(8px);
    animation: plIvrMenuIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__prompt {
    margin: 0 0 8px !important;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 10px;
    line-height: 1.35;
    letter-spacing: -0.01em;
    color: #6b7280;
}

body.pl-landing-time .pl-ivr-anim__options {
    list-style: none;
    margin: 0;
    padding: 0;
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.pl-landing-time .pl-ivr-anim__option {
    flex: 1 1 0;
    min-height: 30px;
    max-height: 38px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 0 9px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fafafa;
    opacity: 0;
    transform: translateY(6px);
    animation: plIvrOptionIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__option strong {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: #111;
}

/* Unpicked options step back once the caller commits. */
body.pl-landing-time .pl-ivr-anim__option--2,
body.pl-landing-time .pl-ivr-anim__option--3 {
    animation:
        plIvrOptionIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards,
        plIvrOptionFade var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__option--2 { animation-delay: 0.16s, 0s; }
body.pl-landing-time .pl-ivr-anim__option--3 { animation-delay: 0.32s, 0s; }

body.pl-landing-time .pl-ivr-anim__option--1 {
    animation:
        plIvrOptionIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards,
        plIvrOptionPick var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__option--1 .pl-ivr-anim__key {
    animation: plIvrKeyPick var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__key {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    color: #111;
    font-size: 10px;
    font-weight: 750;
    line-height: 1;
}

body.pl-landing-time .pl-ivr-anim__key > span {
    display: block;
    line-height: 1;
    translate: 0 -1px;
}

/* —— Routing happens inline, under the picked option —— */
body.pl-landing-time .pl-ivr-anim__route {
    margin-top: 8px;
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 6px;
    padding: 9px;
    border: 1px solid rgba(21, 94, 239, 0.28);
    background: rgba(21, 94, 239, 0.05);
    overflow: hidden;
    opacity: 0;
    animation: plIvrRouteIn var(--ivr-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__route-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.pl-landing-time .pl-ivr-anim__crew {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-ivr-anim__crew span {
    position: relative;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid #fff;
    background: #111;
    color: #fff;
    font-size: 8px;
    font-weight: 750;
    letter-spacing: -0.02em;
    line-height: 1;
}

body.pl-landing-time .pl-ivr-anim__crew span + span {
    margin-left: -8px;
}

body.pl-landing-time .pl-ivr-anim__crew span i {
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 1.5px solid rgba(21, 94, 239, 0.55);
    opacity: 0;
    animation: plIvrCrewRing var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__crew span:nth-child(2) i { animation-delay: 0.16s; }
body.pl-landing-time .pl-ivr-anim__crew span:nth-child(3) i { animation-delay: 0.32s; }

body.pl-landing-time .pl-ivr-anim__crew .is-answer {
    animation: plIvrCrewAnswer var(--ivr-cycle) ease-out 1 forwards;
}

/* Status swaps in place — same row, no second scene. */
body.pl-landing-time .pl-ivr-anim__state {
    position: relative;
    flex: 1;
    min-width: 0;
    height: 16px;
}

body.pl-landing-time .pl-ivr-anim__state em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

body.pl-landing-time .pl-ivr-anim__state-ring {
    color: #155eef;
    animation: plIvrStateRing var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__state-live {
    color: #15803d;
    opacity: 0;
    animation: plIvrStateLive var(--ivr-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-ivr-anim__route-note {
    font-size: 9px;
    font-weight: 550;
    letter-spacing: -0.01em;
    color: #6b7280;
}

@keyframes plIvrBarIn {
    0%, 3% { opacity: 0; transform: translateY(-10px); }
    10%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plIvrBar {
    0%, 100% { transform: scaleY(0.35); }
    50% { transform: scaleY(1); }
}

@keyframes plIvrMenuIn {
    0%, 6% { opacity: 0; transform: translateY(8px); }
    14%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plIvrOptionIn {
    0%, 16% { opacity: 0; transform: translateY(6px); }
    26%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plIvrOptionPick {
    0%, 40% { background: #fafafa; border-color: rgba(0, 0, 0, 0.08); }
    47%, 100% { background: rgba(21, 94, 239, 0.09); border-color: rgba(21, 94, 239, 0.4); }
}

@keyframes plIvrOptionFade {
    0%, 44% { opacity: 1; }
    54%, 100% { opacity: 0.42; }
}

@keyframes plIvrKeyPick {
    0%, 40% { background: #fff; border-color: rgba(0, 0, 0, 0.12); color: #111; }
    47%, 100% { background: #155eef; border-color: #155eef; color: #fff; }
}

@keyframes plIvrRouteIn {
    0%, 50% { opacity: 0; }
    58%, 100% { opacity: 1; }
}

@keyframes plIvrCrewRing {
    0%, 58% { opacity: 0; transform: scale(0.75); }
    66% { opacity: 0.85; transform: scale(1); }
    78%, 100% { opacity: 0; transform: scale(1.45); }
}

@keyframes plIvrCrewAnswer {
    0%, 76% { background: #111; }
    84%, 100% { background: #16a34a; }
}

@keyframes plIvrStateRing {
    0%, 74% { opacity: 1; }
    80%, 100% { opacity: 0; }
}

@keyframes plIvrStateLive {
    0%, 76% { opacity: 0; }
    82%, 100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-ivr-anim__bar,
    body.pl-landing-time .pl-ivr-anim__bars i,
    body.pl-landing-time .pl-ivr-anim__menu,
    body.pl-landing-time .pl-ivr-anim__option,
    body.pl-landing-time .pl-ivr-anim__key,
    body.pl-landing-time .pl-ivr-anim__route,
    body.pl-landing-time .pl-ivr-anim__crew span,
    body.pl-landing-time .pl-ivr-anim__crew span i,
    body.pl-landing-time .pl-ivr-anim__state em {
        animation: none !important;
    }

    body.pl-landing-time .pl-ivr-anim__bar,
    body.pl-landing-time .pl-ivr-anim__menu,
    body.pl-landing-time .pl-ivr-anim__option,
    body.pl-landing-time .pl-ivr-anim__route {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-ivr-anim__option--1 {
        background: rgba(21, 94, 239, 0.09);
        border-color: rgba(21, 94, 239, 0.4);
    }

    body.pl-landing-time .pl-ivr-anim__option--1 .pl-ivr-anim__key {
        background: #155eef;
        border-color: #155eef;
        color: #fff;
    }

    body.pl-landing-time .pl-ivr-anim__crew span i,
    body.pl-landing-time .pl-ivr-anim__state-ring {
        opacity: 0;
    }

    body.pl-landing-time .pl-ivr-anim__state-live {
        opacity: 1;
    }

    body.pl-landing-time .pl-ivr-anim__crew .is-answer {
        background: #16a34a;
    }
}


/* ---- css/pl-time-anims/record.css ---- */
/**
 * Call recording & history bento animation.
 * Same app chrome / call-list rows as one-number; live → saved → playback stays.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-record-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-record-anim {
    --record-cycle: 8.5s;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
}

body.pl-landing-time .pl-record-anim__app {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    opacity: 0;
    transform: translateY(10px);
    animation: plRecordHistoryIn var(--record-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-record-anim__bar {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fafafa;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-record-anim__bar img {
    display: block;
    height: 12px;
    width: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-record-anim__bar strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-record-anim__bar-sep {
    width: 1px;
    height: 12px;
    background: rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-record-anim__bar-meta {
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-record-anim__team {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
}

body.pl-landing-time .pl-record-anim__team .pl-record-anim__av {
    margin-left: -6px;
}

body.pl-landing-time .pl-record-anim__av {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid #fff;
    background: #111;
    color: #fff;
    font-size: 7px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

body.pl-landing-time .pl-record-anim__av--al { background: #0d9488; }
body.pl-landing-time .pl-record-anim__av--sm { background: #155eef; }
body.pl-landing-time .pl-record-anim__av--jr { background: #7c3aed; }

body.pl-landing-time .pl-record-anim__body {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr);
}

body.pl-landing-time .pl-record-anim__list {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid rgba(0, 0, 0, 0.07);
    overflow: hidden;
}

body.pl-landing-time .pl-record-anim__row {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

body.pl-landing-time .pl-record-anim__row--r1,
body.pl-landing-time .pl-record-anim__row--r2,
body.pl-landing-time .pl-record-anim__row--missed {
    opacity: 0;
    transform: translateY(6px);
    animation: plRecordRowFadeIn var(--record-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-record-anim__row--r1 { animation-delay: 0.18s; }
body.pl-landing-time .pl-record-anim__row--r2 { animation-delay: 0.3s; }
body.pl-landing-time .pl-record-anim__row--missed { animation-delay: 0.42s; }

body.pl-landing-time .pl-record-anim__row--new {
    position: relative;
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    border-bottom-width: 0;
    animation:
        plRecordRowIn var(--record-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards,
        plRecordRowSelect var(--record-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-record-anim__dir {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-top: 1px;
    display: grid;
    place-items: center;
    color: #6b7280;
}

body.pl-landing-time .pl-record-anim__dir svg {
    width: 14px;
    height: 14px;
    display: block;
}

body.pl-landing-time .pl-record-anim__dir--miss {
    color: #dc2626;
}

body.pl-landing-time .pl-record-anim__row-body {
    min-width: 0;
    flex: 1;
}

body.pl-landing-time .pl-record-anim__row-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 2px;
}

body.pl-landing-time .pl-record-anim__row-top strong {
    font-size: 11px;
    font-weight: 560;
    letter-spacing: -0.02em;
    color: #4b5563;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-record-anim__row-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-record-anim__row p {
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    line-height: 1.35;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-record-anim__row--new .pl-record-anim__row-top strong {
    font-weight: 700;
    color: #111;
}

body.pl-landing-time .pl-record-anim__row--new .pl-record-anim__row-top em {
    color: #db2777;
}

body.pl-landing-time .pl-record-anim__row--new p {
    color: #374151;
    font-weight: 550;
}

body.pl-landing-time .pl-record-anim__row--missed .pl-record-anim__row-top strong {
    color: #dc2626;
}

body.pl-landing-time .pl-record-anim__row--missed p {
    color: #d97706;
}

body.pl-landing-time .pl-record-anim__row .pl-dash-voice-rec-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 14px;
    height: 14px;
    color: #949494;
}

body.pl-landing-time .pl-record-anim__row .pl-dash-voice-rec-icon svg {
    display: block;
    width: 12px;
    height: 12px;
}

body.pl-landing-time .pl-record-anim__row--new .pl-record-anim__rec-icon {
    opacity: 0;
    transform: scale(0.85);
    animation: plRecordRecIcon var(--record-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-record-anim__panel {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-record-anim__live,
body.pl-landing-time .pl-record-anim__playback {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
}

body.pl-landing-time .pl-record-anim__live {
    background: #111;
    color: #fff;
    animation: plRecordLivePhase var(--record-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-record-anim__playback {
    background: #fff;
    opacity: 0;
    transform: translateY(8px);
    animation: plRecordPlayPhase var(--record-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-record-anim__live-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

body.pl-landing-time .pl-record-anim__rec {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 999px;
    background: rgba(219, 39, 119, 0.18);
    color: #fda4af;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
}

body.pl-landing-time .pl-record-anim__rec i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #f43f5e;
    animation: plRecordRecPulse 1s ease-in-out infinite;
}

body.pl-landing-time .pl-record-anim__live-timer::after {
    content: "0:00";
    font-size: 9px;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.72);
    font-variant-numeric: tabular-nums;
    animation: plRecordLiveTimer var(--record-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-record-anim__live-who {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

body.pl-landing-time .pl-record-anim__live-av {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #fff;
    color: #111;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

body.pl-landing-time .pl-record-anim__live-meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-record-anim__live-meta strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.15;
}

body.pl-landing-time .pl-record-anim__live-meta em {
    font-style: normal;
    font-size: 9px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.58);
}

body.pl-landing-time .pl-record-anim__play-head {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-record-anim__play-btn {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #111;
    position: relative;
    animation: plRecordPlayBtn var(--record-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-record-anim__play-btn::after {
    content: "";
    position: absolute;
    left: 10px;
    top: 50%;
    translate: 0 -50%;
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid #fff;
}

body.pl-landing-time .pl-record-anim__play-meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-record-anim__play-meta strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-record-anim__play-meta em {
    font-style: normal;
    font-size: 9px;
    font-weight: 500;
    color: #9ca3af;
}

body.pl-landing-time .pl-record-anim__duration {
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 600;
    color: #6b7280;
    font-variant-numeric: tabular-nums;
}

body.pl-landing-time .pl-record-anim__wave {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 2px;
    height: 42px;
    margin-top: auto;
    padding: 0 1px;
}

body.pl-landing-time .pl-record-anim__wave i {
    display: block;
    flex: 1 1 0;
    min-width: 0;
    max-width: 4px;
    border-radius: 999px;
    transform-origin: bottom center;
}

body.pl-landing-time .pl-record-anim__wave--live i {
    background: rgba(251, 113, 133, 0.85);
    animation: plRecordLiveBar 0.65s ease-in-out infinite;
}

body.pl-landing-time .pl-record-anim__wave--live i:nth-child(1) { height: 10px; animation-delay: 0s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(2) { height: 18px; animation-delay: 0.05s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(3) { height: 24px; animation-delay: 0.1s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(4) { height: 14px; animation-delay: 0.15s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(5) { height: 28px; animation-delay: 0.2s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(6) { height: 16px; animation-delay: 0.25s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(7) { height: 32px; animation-delay: 0.3s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(8) { height: 20px; animation-delay: 0.35s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(9) { height: 26px; animation-delay: 0.4s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(10) { height: 12px; animation-delay: 0.45s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(11) { height: 22px; animation-delay: 0.5s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(12) { height: 30px; animation-delay: 0.55s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(13) { height: 15px; animation-delay: 0.6s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(14) { height: 24px; animation-delay: 0.65s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(15) { height: 18px; animation-delay: 0.7s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(16) { height: 28px; animation-delay: 0.75s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(17) { height: 12px; animation-delay: 0.8s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(18) { height: 20px; animation-delay: 0.85s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(19) { height: 26px; animation-delay: 0.9s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(20) { height: 14px; animation-delay: 0.95s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(21) { height: 22px; animation-delay: 1s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(22) { height: 16px; animation-delay: 1.05s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(23) { height: 30px; animation-delay: 1.1s; }
body.pl-landing-time .pl-record-anim__wave--live i:nth-child(24) { height: 18px; animation-delay: 1.15s; }

body.pl-landing-time .pl-record-anim__wave--play i {
    background: #fbcfe8;
    opacity: 0.55;
}

body.pl-landing-time .pl-record-anim__wave--play i:nth-child(2) { height: 12px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(3) { height: 20px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(4) { height: 28px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(5) { height: 16px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(6) { height: 32px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(7) { height: 22px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(8) { height: 14px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(9) { height: 26px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(10) { height: 18px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(11) { height: 30px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(12) { height: 12px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(13) { height: 24px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(14) { height: 16px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(15) { height: 28px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(16) { height: 20px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(17) { height: 14px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(18) { height: 26px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(19) { height: 18px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(20) { height: 32px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(21) { height: 22px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(22) { height: 12px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(23) { height: 24px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(24) { height: 16px; }
body.pl-landing-time .pl-record-anim__wave--play i:nth-child(25) { height: 20px; }

body.pl-landing-time .pl-record-anim__playhead {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    border-radius: 2px;
    background: #db2777;
    box-shadow: 0 0 0 2px rgba(219, 39, 119, 0.12);
    opacity: 0;
    animation: plRecordPlayhead var(--record-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-record-anim__saved {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    padding: 4px 10px;
    border-radius: 999px;
    background: #fdf2f8;
    color: #be185d;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.02em;
    box-shadow: 0 8px 20px rgba(219, 39, 119, 0.18);
    opacity: 0;
    animation: plRecordSavedBadge var(--record-cycle) ease-out 1 forwards;
    pointer-events: none;
}

@keyframes plRecordRecPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.45; transform: scale(0.85); }
}

@keyframes plRecordLiveBar {
    0%, 100% { transform: scaleY(0.45); opacity: 0.55; }
    50% { transform: scaleY(1); opacity: 1; }
}

@keyframes plRecordHistoryIn {
    0%, 6% { opacity: 0; transform: translateY(10px); }
    12%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plRecordRowFadeIn {
    0%, 10% { opacity: 0; transform: translateY(6px); }
    18%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plRecordLivePhase {
    0%, 8% { opacity: 0; transform: translateY(6px); }
    14%, 42% { opacity: 1; transform: translateY(0); }
    48%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes plRecordLiveTimer {
    0%, 14% { content: "0:00"; }
    20% { content: "0:08"; }
    26% { content: "0:16"; }
    32% { content: "0:24"; }
    38% { content: "0:32"; }
    44%, 100% { content: "0:42"; }
}

@keyframes plRecordRowIn {
    0%, 40% {
        max-height: 0;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-bottom-width: 0;
        transform: translateY(-4px);
    }
    48%, 100% {
        max-height: 88px;
        opacity: 1;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom-width: 1px;
        transform: translateY(0);
    }
}

@keyframes plRecordRowSelect {
    0%, 50% {
        background: transparent;
        box-shadow: none;
    }
    56%, 100% {
        background: rgba(219, 39, 119, 0.06);
        box-shadow: inset 2px 0 0 #db2777;
    }
}

@keyframes plRecordRecIcon {
    0%, 44% { opacity: 0; transform: scale(0.6); }
    50%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plRecordPlayPhase {
    0%, 46% { opacity: 0; transform: translateY(8px); }
    54%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plRecordPlayBtn {
    0%, 54% { background: #111; transform: scale(1); }
    58% { background: #db2777; transform: scale(1.06); }
    62%, 100% { background: #db2777; transform: scale(1); }
}

@keyframes plRecordPlayhead {
    0%, 56% { left: 0; opacity: 0; }
    60% { left: 0; opacity: 1; }
    88%, 100% { left: calc(100% - 2px); opacity: 1; }
}

@keyframes plRecordSavedBadge {
    0%, 36% { opacity: 0; transform: translate(-50%, calc(-50% + 4px)); }
    40%, 46% { opacity: 1; transform: translate(-50%, -50%); }
    52%, 100% { opacity: 0; transform: translate(-50%, calc(-50% - 4px)); }
}

@media (max-width: 720px) {
    /* Stack: call list on top, recording detail underneath */
    body.pl-landing-time .pl-time-record-stage {
        height: 320px;
        min-height: 320px;
        max-height: 320px;
    }

    body.pl-landing-time .pl-record-anim__body {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 1fr) auto;
    }

    body.pl-landing-time .pl-record-anim__list {
        border-right: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.07);
        max-height: none;
    }

    body.pl-landing-time .pl-record-anim__panel {
        height: 96px;
        min-height: 96px;
        flex: 0 0 auto;
    }

    body.pl-landing-time .pl-record-anim__row {
        gap: 6px;
        padding: 6px 10px;
    }

    body.pl-landing-time .pl-record-anim__live,
    body.pl-landing-time .pl-record-anim__playback {
        padding: 8px 12px;
        gap: 4px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-record-anim__app,
    body.pl-landing-time .pl-record-anim__row--new,
    body.pl-landing-time .pl-record-anim__row--r1,
    body.pl-landing-time .pl-record-anim__row--r2,
    body.pl-landing-time .pl-record-anim__row--missed,
    body.pl-landing-time .pl-record-anim__row--new .pl-record-anim__rec-icon,
    body.pl-landing-time .pl-record-anim__live,
    body.pl-landing-time .pl-record-anim__playback,
    body.pl-landing-time .pl-record-anim__live-timer::after,
    body.pl-landing-time .pl-record-anim__rec i,
    body.pl-landing-time .pl-record-anim__wave--live i,
    body.pl-landing-time .pl-record-anim__play-btn,
    body.pl-landing-time .pl-record-anim__playhead,
    body.pl-landing-time .pl-record-anim__saved {
        animation: none !important;
    }

    body.pl-landing-time .pl-record-anim__app,
    body.pl-landing-time .pl-record-anim__row--new,
    body.pl-landing-time .pl-record-anim__row--r1,
    body.pl-landing-time .pl-record-anim__row--r2,
    body.pl-landing-time .pl-record-anim__row--missed,
    body.pl-landing-time .pl-record-anim__playback {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-record-anim__live {
        opacity: 0;
    }

    body.pl-landing-time .pl-record-anim__row--new {
        max-height: none;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom-width: 1px;
        background: rgba(219, 39, 119, 0.06);
        box-shadow: inset 2px 0 0 #db2777;
    }

    body.pl-landing-time .pl-record-anim__row--new .pl-record-anim__rec-icon {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-record-anim__live-timer::after {
        content: "0:42";
    }

    body.pl-landing-time .pl-record-anim__play-btn {
        background: #db2777;
    }

    body.pl-landing-time .pl-record-anim__playhead {
        left: 42%;
        opacity: 1;
    }

    body.pl-landing-time .pl-record-anim__saved {
        opacity: 0;
        transform: translate(-50%, -50%);
    }
}


/* ---- css/pl-product-features.css ---- */
/* Voice / SMS product feature boards */

.pl-product-features {
    padding: 24px var(--pl-time-inset, clamp(20px, 5vw, 48px)) 88px;
    background: #fff;
}

.pl-voice-feats-inner,
.pl-product-features-inner {
    max-width: var(--pl-time-max, 1120px);
    margin: 0 auto;
}

.pl-voice-feats-inner {
    display: grid;
    grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
    column-gap: 48px;
    row-gap: 28px;
    align-items: start;
}

.pl-voice-feats-radio {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pl-voice-feats-side {
    padding-top: 4px;
}

.pl-voice-feats-title {
    margin: 0 0 28px;
    font-size: clamp(40px, 4.2vw, 52px);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 1.05;
    color: #0e0e0e;
}

.pl-voice-feats-nav {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.pl-voice-feats-nav-item {
    position: relative;
    margin: 0;
    padding: 0 0 0 14px;
    border-left: 2px solid transparent;
    color: #9a9a9a;
    font-size: 18px;
    line-height: 1.35;
    cursor: pointer;
}

.pl-voice-feats-nav-item:hover {
    color: #0e0e0e;
}

/* Active nav + panel: radio value must match data-panel / data-panel-nav */
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="line"]:checked) .pl-voice-feats-nav-item[data-panel-nav="line"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="team"]:checked) .pl-voice-feats-nav-item[data-panel-nav="team"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="route"]:checked) .pl-voice-feats-nav-item[data-panel-nav="route"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="inbox"]:checked) .pl-voice-feats-nav-item[data-panel-nav="inbox"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="intel"]:checked) .pl-voice-feats-nav-item[data-panel-nav="intel"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="invoice"]:checked) .pl-voice-feats-nav-item[data-panel-nav="invoice"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="methods"]:checked) .pl-voice-feats-nav-item[data-panel-nav="methods"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="send"]:checked) .pl-voice-feats-nav-item[data-panel-nav="send"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="campaigns"]:checked) .pl-voice-feats-nav-item[data-panel-nav="campaigns"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="deliverability"]:checked) .pl-voice-feats-nav-item[data-panel-nav="deliverability"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="audience"]:checked) .pl-voice-feats-nav-item[data-panel-nav="audience"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="routing"]:checked) .pl-voice-feats-nav-item[data-panel-nav="routing"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="markup"]:checked) .pl-voice-feats-nav-item[data-panel-nav="markup"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="spam"]:checked) .pl-voice-feats-nav-item[data-panel-nav="spam"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="publish"]:checked) .pl-voice-feats-nav-item[data-panel-nav="publish"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="domains"]:checked) .pl-voice-feats-nav-item[data-panel-nav="domains"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="leads"]:checked) .pl-voice-feats-nav-item[data-panel-nav="leads"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="register"]:checked) .pl-voice-feats-nav-item[data-panel-nav="register"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="dns"]:checked) .pl-voice-feats-nav-item[data-panel-nav="dns"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="attach"]:checked) .pl-voice-feats-nav-item[data-panel-nav="attach"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="filter"]:checked) .pl-voice-feats-nav-item[data-panel-nav="filter"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="reply"]:checked) .pl-voice-feats-nav-item[data-panel-nav="reply"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="usage"]:checked) .pl-voice-feats-nav-item[data-panel-nav="usage"] {
    color: #0e0e0e;
    font-weight: 550;
    border-left-color: #0e0e0e;
}

.pl-voice-feats-panels {
    min-width: 0;
}

.pl-voice-feats-grid {
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="line"]:checked) [data-panel="line"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="team"]:checked) [data-panel="team"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="route"]:checked) [data-panel="route"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="inbox"]:checked) [data-panel="inbox"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="intel"]:checked) [data-panel="intel"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="invoice"]:checked) [data-panel="invoice"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="methods"]:checked) [data-panel="methods"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="send"]:checked) [data-panel="send"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="campaigns"]:checked) [data-panel="campaigns"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="deliverability"]:checked) [data-panel="deliverability"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="audience"]:checked) [data-panel="audience"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="routing"]:checked) [data-panel="routing"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="markup"]:checked) [data-panel="markup"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="spam"]:checked) [data-panel="spam"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="publish"]:checked) [data-panel="publish"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="domains"]:checked) [data-panel="domains"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="leads"]:checked) [data-panel="leads"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="register"]:checked) [data-panel="register"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="dns"]:checked) [data-panel="dns"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="attach"]:checked) [data-panel="attach"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="filter"]:checked) [data-panel="filter"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="reply"]:checked) [data-panel="reply"],
.pl-voice-feats-inner:has(.pl-voice-feats-radio[value="usage"]:checked) [data-panel="usage"] {
    display: grid;
}

.pl-voice-feat-card {
    min-height: 168px;
    padding: 26px 26px 28px;
    border: 1px solid #ececec;
    border-radius: 0;
    background: #fff;
}

.pl-voice-feat-plan {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #8a8a8a;
}

.pl-voice-feat-card h3 {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.03em;
    color: #0e0e0e;
}

.pl-voice-feat-card p:not(.pl-voice-feat-plan) {
    margin: 0;
    font-size: 17px;
    line-height: 1.45;
    color: #6f6f6f;
}

.pl-voice-feats .pl-product-features-foot,
.pl-voice-feats .pl-product-features-related {
    grid-column: 2;
    text-align: left;
    margin: 0;
}

.pl-voice-feats .pl-product-features-related {
    margin-top: -16px;
}

.pl-product-features-foot {
    margin: 24px 0 0;
    font-size: 13px;
    color: #8a8a8a;
    text-align: center;
}

.pl-product-features-foot a {
    color: #0e0e0e;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pl-product-features-related {
    margin-top: 10px;
    font-size: 14px;
    text-align: center;
}

.pl-product-features-related a {
    color: #0e0e0e;
    font-weight: 500;
}

/* SMS page still uses the compare table until it gets the same treatment */
.pl-product-features-block + .pl-product-features-block {
    margin-top: 32px;
}

.pl-product-features-block-title {
    margin: 0 0 12px;
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #0e0e0e;
}

.pl-product-features-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #e8e8e8;
    background: #fff;
}

.pl-product-features .pl-pricing-compare-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.pl-product-features .pl-pricing-compare-table th,
.pl-product-features .pl-pricing-compare-table td {
    padding: 12px 14px;
    border-bottom: 1px solid #efefef;
    vertical-align: top;
    text-align: center;
}

.pl-product-features .pl-pricing-compare-table th.pl-pricing-compare-feat,
.pl-product-features .pl-pricing-compare-table td:first-child {
    text-align: left;
}

.pl-product-features .pl-pricing-compare-table thead th {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: #8a8a8a;
    background: #f7f7f7;
}

.pl-product-features .pl-pricing-compare-feat-label {
    font-weight: 500;
    color: #0e0e0e;
}

@media (max-width: 900px) {
    .pl-voice-feats-inner {
        grid-template-columns: 1fr;
        row-gap: 24px;
    }

    .pl-voice-feats-nav {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 8px 18px;
    }

    .pl-voice-feats-nav-item {
        padding-left: 10px;
    }

    .pl-voice-feats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pl-voice-feats .pl-product-features-foot,
    .pl-voice-feats .pl-product-features-related {
        grid-column: 1;
    }
}

@media (max-width: 560px) {
    .pl-voice-feats-grid {
        grid-template-columns: 1fr;
    }
}


/* ---- css/pl-time-anims/payments.css ---- */
/**
 * Payments bento — one animated SMS pay flow, three static mocks.
 * Scoped to body.pl-landing-time only.
 */

/* ── Shared stage shell ── */
body.pl-landing-time .pl-time-payments-stage,
body.pl-landing-time .pl-time-pay-invoice-stage,
body.pl-landing-time .pl-time-pay-methods-stage,
body.pl-landing-time .pl-time-pay-paid-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 12px 12px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

/* ══════════════════════════════════════════
   Animated: Pathline thread + customer phone
   ══════════════════════════════════════════ */
body.pl-landing-time .pl-payments-anim {
    --payments-cycle: 9s;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(132px, 0.88fr);
    gap: 10px;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-payments-anim__thread {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    opacity: 0;
    transform: translateY(8px);
    animation: plPayPaneIn var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fafafa;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-payments-anim__bar img {
    display: block;
    height: 11px;
    width: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-payments-anim__bar-sep {
    width: 1px;
    height: 11px;
    background: rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-payments-anim__bar strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-payments-anim__who {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 8px 10px 7px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-payments-anim__who strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-payments-anim__who span {
    font-size: 8px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-payments-anim__bubbles {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 10px 0;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-payments-anim__in {
    align-self: flex-start;
    max-width: 92%;
    padding: 7px 9px;
    background: #f3f4f6;
    color: #111;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: -0.02em;
    opacity: 0;
    transform: translateY(6px);
    animation: plPayInBubble var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__invoice {
    align-self: flex-end;
    width: min(100%, 168px);
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 9px 10px 8px;
    background: #111;
    color: #fff;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16);
    opacity: 0;
    transform: translateY(8px) scale(0.98);
    animation: plPayInvoiceCard var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__invoice span {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
}

body.pl-landing-time .pl-payments-anim__invoice strong {
    font-size: 16px;
    font-weight: 650;
    letter-spacing: -0.04em;
}

body.pl-landing-time .pl-payments-anim__invoice em {
    font-style: normal;
    font-size: 9px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.62);
}

body.pl-landing-time .pl-payments-anim__invoice {
    position: relative;
}

body.pl-landing-time .pl-payments-anim__pay-cta,
body.pl-landing-time .pl-payments-anim__paid-pill {
    margin-top: 6px;
    align-self: flex-start;
    padding: 3px 7px;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.pl-landing-time .pl-payments-anim__pay-cta {
    background: #fff;
    color: #111;
    animation: plPayCtaSwap var(--payments-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-payments-anim__paid-pill {
    position: absolute;
    bottom: 8px;
    left: 10px;
    margin-top: 0;
    background: #dcfce7;
    color: #15803d;
    opacity: 0;
    animation: plPayPaidPill var(--payments-cycle) ease 1 forwards;
}

/* Phone */
body.pl-landing-time .pl-payments-anim__phone-wrap {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    min-width: 0;
    min-height: 0;
    opacity: 0;
    transform: translateY(10px);
    animation: plPayPaneIn var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__phone {
    position: relative;
    width: 148px;
    height: 100%;
    max-height: 264px;
    border-radius: 22px 22px 0 0;
    border: 2px solid #111;
    border-bottom: none;
    background: #fff;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 14px 28px rgba(0, 0, 0, 0.12);
    overflow: hidden;
}

body.pl-landing-time .pl-payments-anim__notch {
    position: absolute;
    top: 7px;
    left: 50%;
    translate: -50% 0;
    width: 48px;
    height: 12px;
    border-radius: 999px;
    background: #000;
    z-index: 4;
}

body.pl-landing-time .pl-payments-anim__sms {
    display: flex;
    flex-direction: column;
    gap: 7px;
    height: 100%;
    padding: 28px 9px 0;
}

body.pl-landing-time .pl-payments-anim__sms-bar {
    text-align: center;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    padding-bottom: 6px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-payments-anim__sms-in {
    align-self: flex-start;
    max-width: 94%;
    padding: 6px 8px;
    background: #e9e9eb;
    font-size: 9px;
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: -0.02em;
    color: #111;
    opacity: 0;
    transform: translateY(6px);
    animation: plPaySmsIn var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__sms-card {
    align-self: flex-start;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 9px;
    background: #111;
    color: #fff;
    opacity: 0;
    transform: translateY(8px);
    animation: plPaySmsCard var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__sms-card span {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}

body.pl-landing-time .pl-payments-anim__sms-card strong {
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.04em;
}

body.pl-landing-time .pl-payments-anim__sms-card em {
    margin-top: 4px;
    align-self: flex-start;
    padding: 3px 7px;
    font-style: normal;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    background: #fff;
    color: #111;
}

body.pl-landing-time .pl-payments-anim__sheet,
body.pl-landing-time .pl-payments-anim__done {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
}

body.pl-landing-time .pl-payments-anim__sheet {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 12px 12px 16px;
    background: #fff;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 -12px 28px rgba(0, 0, 0, 0.12);
    transform: translateY(110%);
    animation: plPaySheet var(--payments-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-payments-anim__sheet span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-payments-anim__sheet strong {
    font-size: 18px;
    font-weight: 650;
    letter-spacing: -0.04em;
    color: #111;
}

body.pl-landing-time .pl-payments-anim__sheet em {
    font-style: normal;
    font-size: 9px;
    font-weight: 500;
    color: #6b7280;
}

body.pl-landing-time .pl-payments-anim__sheet b {
    margin-top: 4px;
    display: block;
    padding: 7px 8px;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.01em;
    background: #111;
    color: #fff;
}

body.pl-landing-time .pl-payments-anim__done {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 100%;
    background: #fff;
    opacity: 0;
    animation: plPayDone var(--payments-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-payments-anim__done i {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    background: #dcfce7;
    color: #15803d;
}

body.pl-landing-time .pl-payments-anim__done i svg {
    width: 16px;
    height: 16px;
    display: block;
}

body.pl-landing-time .pl-payments-anim__done strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.03em;
    color: #111;
}

body.pl-landing-time .pl-payments-anim__done span {
    font-size: 9px;
    font-weight: 500;
    color: #6b7280;
}

@keyframes plPayPaneIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    12%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plPayInBubble {
    0%, 10% { opacity: 0; transform: translateY(6px); }
    18%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plPayInvoiceCard {
    0%, 24% { opacity: 0; transform: translateY(8px) scale(0.98); }
    32%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes plPayCtaSwap {
    0%, 68% { opacity: 1; }
    74%, 100% { opacity: 0; }
}

@keyframes plPayPaidPill {
    0%, 68% { opacity: 0; }
    74%, 100% { opacity: 1; }
}

@keyframes plPaySmsIn {
    0%, 20% { opacity: 0; transform: translateY(6px); }
    28%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plPaySmsCard {
    0%, 30% { opacity: 0; transform: translateY(8px); }
    38%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plPaySheet {
    0%, 44% { transform: translateY(110%); }
    52%, 68% { transform: translateY(0); }
    76%, 100% { transform: translateY(110%); }
}

@keyframes plPayDone {
    0%, 70% { opacity: 0; }
    78%, 100% { opacity: 1; }
}

/* ══════════════════════════════════════════
   Static: invoice composer
   ══════════════════════════════════════════ */
body.pl-landing-time .pl-pay-invoice-anim,
body.pl-landing-time .pl-pay-methods-anim,
body.pl-landing-time .pl-pay-paid-anim {
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-pay-invoice-anim__shell,
body.pl-landing-time .pl-pay-methods-anim__shell,
body.pl-landing-time .pl-pay-paid-anim__shell {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    padding: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-pay-invoice-anim__head,
body.pl-landing-time .pl-pay-methods-anim__head,
body.pl-landing-time .pl-pay-paid-anim__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 9px;
    margin-bottom: 9px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-pay-invoice-anim__head span,
body.pl-landing-time .pl-pay-methods-anim__head span,
body.pl-landing-time .pl-pay-paid-anim__head span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-pay-invoice-anim__head strong,
body.pl-landing-time .pl-pay-methods-anim__head strong,
body.pl-landing-time .pl-pay-paid-anim__head strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.03em;
    color: #111;
}

body.pl-landing-time .pl-pay-invoice-anim__to {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin-bottom: 10px;
}

body.pl-landing-time .pl-pay-invoice-anim__to span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-pay-invoice-anim__to strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-pay-invoice-anim__rows {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-height: 0;
}

body.pl-landing-time .pl-pay-invoice-anim__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 11px;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-pay-invoice-anim__row em {
    font-style: normal;
    color: #6b7280;
}

body.pl-landing-time .pl-pay-invoice-anim__row--total {
    margin-top: 2px;
    padding-top: 8px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    font-weight: 650;
}

body.pl-landing-time .pl-pay-invoice-anim__send {
    margin-top: 10px;
    padding: 8px 10px;
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.01em;
    background: #111;
    color: #fff;
}

/* ══════════════════════════════════════════
   Static: card + bank rates
   ══════════════════════════════════════════ */
body.pl-landing-time .pl-pay-methods-anim__list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
    min-height: 0;
}

body.pl-landing-time .pl-pay-methods-anim__item {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 10px 11px;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-pay-methods-anim__item strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-pay-methods-anim__item span {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #6b7280;
}

body.pl-landing-time .pl-pay-methods-anim__item em {
    margin-top: 2px;
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #15803d;
}

/* ══════════════════════════════════════════
   Static: paid in the inbox
   ══════════════════════════════════════════ */
body.pl-landing-time .pl-pay-paid-anim__rows {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-pay-paid-anim__row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 2px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-pay-paid-anim__row:last-child {
    border-bottom: none;
}

body.pl-landing-time .pl-pay-paid-anim__av {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    display: grid;
    place-items: center;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #111;
    background: #f3f4f6;
}

body.pl-landing-time .pl-pay-paid-anim__meta {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.pl-landing-time .pl-pay-paid-anim__meta strong {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-pay-paid-anim__meta span {
    font-size: 10px;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-pay-paid-anim__tag {
    flex: 0 0 auto;
    padding: 3px 7px;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: #f3f4f6;
    color: #6b7280;
}

body.pl-landing-time .pl-pay-paid-anim__row--paid .pl-pay-paid-anim__tag {
    background: #dcfce7;
    color: #15803d;
}

body.pl-landing-time .pl-pay-paid-anim__row--paid .pl-pay-paid-anim__av {
    background: #dcfce7;
    color: #15803d;
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-payments-anim {
        grid-template-columns: 1fr 132px;
        gap: 8px;
    }

    body.pl-landing-time .pl-payments-anim__phone {
        width: 126px;
    }

    body.pl-landing-time .pl-payments-anim__invoice {
        width: min(100%, 148px);
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-payments-anim__thread,
    body.pl-landing-time .pl-payments-anim__phone-wrap,
    body.pl-landing-time .pl-payments-anim__in,
    body.pl-landing-time .pl-payments-anim__invoice,
    body.pl-landing-time .pl-payments-anim__pay-cta,
    body.pl-landing-time .pl-payments-anim__paid-pill,
    body.pl-landing-time .pl-payments-anim__sms-in,
    body.pl-landing-time .pl-payments-anim__sms-card,
    body.pl-landing-time .pl-payments-anim__sheet,
    body.pl-landing-time .pl-payments-anim__done {
        animation: none !important;
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-payments-anim__pay-cta,
    body.pl-landing-time .pl-payments-anim__sheet {
        display: none;
    }
}


/* ---- css/pl-time-anims/agent.css ---- */
/**
 * Pathline Agents SMS handoff bento animation.
 * Scoped to body.pl-landing-time only.
 */
/* Pathline Agents — AI first contact → handoff */
body.pl-landing-time .pl-time-agent-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-agent-anim {
    --agent-cycle: 8s;
    display: grid;
    grid-template-columns: minmax(132px, 0.38fr) minmax(0, 1fr);
    gap: 12px;
    width: 100%;
    height: 100%;
    min-height: 0;
    align-items: stretch;
}

body.pl-landing-time .pl-agent-anim__intent {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 10px;
    padding: 16px 14px;
    border-radius: 0;
    background: #111;
    color: #fff;
    overflow: hidden;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.16);
    animation: plAgentIntent var(--agent-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__intent-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

body.pl-landing-time .pl-agent-anim__intent-copy strong {
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-agent-anim__intent-copy span {
    font-size: 11px;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.68);
}

body.pl-landing-time .pl-agent-anim__thread {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 14px 0;
    border-radius: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-bottom: none;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.05);
    min-width: 0;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-agent-anim__bubble {
    max-width: 92%;
    padding: 9px 11px;
    border-radius: 14px;
    font-size: 12px;
    line-height: 1.4;
    letter-spacing: -0.01em;
    opacity: 0;
    transform: translateY(8px) scale(0.98);
}

body.pl-landing-time .pl-agent-anim__bubble--in {
    align-self: flex-start;
    background: #f2f2f7;
    color: #111;
    border-bottom-left-radius: 4px;
    animation: plAgentIn var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__row {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

body.pl-landing-time .pl-agent-anim__row--human {
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 6px;
    align-self: stretch;
}

body.pl-landing-time .pl-agent-anim__tag {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #155eef;
    opacity: 0;
    animation: plAgentAiTag var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__actor-av {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #0d9488;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1;
    opacity: 0;
    animation: plAgentHumanTag var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__bubble--ai {
    background: rgba(21, 94, 239, 0.1);
    color: #0f274f;
    border-bottom-right-radius: 4px;
    animation: plAgentAi var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__row--human .pl-agent-anim__bubble--out {
    max-width: min(92%, 280px);
}

body.pl-landing-time .pl-agent-anim__bubble--out {
    background: #155eef;
    color: #fff;
    border-bottom-right-radius: 4px;
    animation: plAgentOut var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__handoff {
    display: flex;
    align-items: center;
    gap: 8px;
    opacity: 0;
    transform: scale(0.96);
    animation: plAgentHandoff var(--agent-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-agent-anim__handoff-line {
    flex: 1;
    height: 1px;
    background: rgba(0, 0, 0, 0.08);
}

body.pl-landing-time .pl-agent-anim__handoff-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.01em;
    white-space: nowrap;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16);
}

body.pl-landing-time .pl-agent-anim__handoff-pill img {
    width: 14px !important;
    height: 14px !important;
    min-height: 0 !important;
    max-height: none !important;
    border-radius: 3px;
    object-fit: cover !important;
}

@keyframes plAgentIntent {
    0%, 8% { opacity: 0.55; transform: translateY(4px); }
    14%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plAgentIn {
    0%, 12% { opacity: 0; transform: translateY(8px) scale(0.98); }
    18%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes plAgentAiTag {
    0%, 28% { opacity: 0; }
    34%, 100% { opacity: 1; }
}

@keyframes plAgentAi {
    0%, 28% { opacity: 0; transform: translateY(8px) scale(0.98); }
    34%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes plAgentHandoff {
    0%, 48% { opacity: 0; transform: scale(0.96); }
    54%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plAgentHumanTag {
    0%, 58% { opacity: 0; }
    64%, 100% { opacity: 1; }
}

@keyframes plAgentOut {
    0%, 58% { opacity: 0; transform: translateY(8px) scale(0.98); }
    64%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-agent-anim {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    body.pl-landing-time .pl-agent-anim__intent {
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        text-align: left;
        padding: 12px 14px;
    }

    /* Extra stage height so stacked mobile content (incl. handoff) isn’t clipped */
    body.pl-landing-time .pl-time-agent-stage {
        height: 360px;
        min-height: 360px;
        max-height: 360px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-agent-anim__intent,
    body.pl-landing-time .pl-agent-anim__bubble,
    body.pl-landing-time .pl-agent-anim__tag,
    body.pl-landing-time .pl-agent-anim__actor-av,
    body.pl-landing-time .pl-agent-anim__handoff {
        animation: none !important;
    }

    body.pl-landing-time .pl-agent-anim__bubble,
    body.pl-landing-time .pl-agent-anim__tag,
    body.pl-landing-time .pl-agent-anim__actor-av,
    body.pl-landing-time .pl-agent-anim__handoff {
        opacity: 1;
        transform: none;
    }
}


/* ---- css/pl-time-anims/email-automation.css ---- */
/**
 * Email automations bento — trigger → timed emails → recovered order.
 * Two-column dashboard mock (flow + live preview).
 */
body.pl-landing-time .pl-time-email-automation-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 12px 10px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-email-automation-anim {
    --email-automation-cycle: 10s;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
    gap: 8px;
    width: 100%;
    height: 100%;
    min-height: 0;
    container-type: inline-size;
}

/* —— Flying email packets (left node → right preview) —— */
body.pl-landing-time .pl-email-automation-anim__fly {
    position: absolute;
    z-index: 6;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border-radius: 0;
    background: #111;
    color: #fff;
    box-shadow:
        0 10px 24px rgba(0, 0, 0, 0.22),
        0 0 0 1px rgba(255, 255, 255, 0.08);
    pointer-events: none;
    opacity: 0;
    white-space: nowrap;
}

body.pl-landing-time .pl-email-automation-anim__fly svg {
    width: 12px;
    height: 12px;
    display: block;
    flex-shrink: 0;
}

body.pl-landing-time .pl-email-automation-anim__fly strong {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-email-automation-anim__fly--1 {
    left: 10%;
    top: 34%;
    animation: plEmailAutoFly1 var(--email-automation-cycle) cubic-bezier(0.22, 0.8, 0.28, 1) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__fly--2 {
    left: 10%;
    top: 62%;
    animation: plEmailAutoFly2 var(--email-automation-cycle) cubic-bezier(0.22, 0.8, 0.28, 1) 1 forwards;
}

/* —— Left: automation flow —— */
body.pl-landing-time .pl-email-automation-anim__flow {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 10px 9px 0;
    border-radius: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(8px);
    animation: plEmailAutoPaneIn var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-email-automation-anim__flow-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    padding: 0 2px 7px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex: 0 0 auto;
}

body.pl-landing-time .pl-email-automation-anim__flow-head strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-automation-anim__nodes {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 0 1 auto;
    min-height: 0;
    padding-left: 0;
    overflow: visible;
}

body.pl-landing-time .pl-email-automation-anim__node {
    position: relative;
    display: block;
    margin-bottom: 7px;
    z-index: 1;
}

body.pl-landing-time .pl-email-automation-anim__node-stack {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.pl-landing-time .pl-email-automation-anim__node-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    min-width: 0;
    min-height: 40px;
    padding: 7px 8px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fafafa;
    opacity: 0.4;
    transform: translateX(6px);
}

body.pl-landing-time .pl-email-automation-anim__node-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-email-automation-anim__node-copy span {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-automation-anim__node-copy strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-automation-anim__node-copy em {
    font-style: normal;
    font-size: 8px;
    font-weight: 600;
    color: #6b7280;
}

body.pl-landing-time .pl-email-automation-anim__badge {
    flex-shrink: 0;
    padding: 3px 6px;
    border-radius: 0;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: #f3f4f6;
    color: #9ca3af;
    border: none;
    outline: none;
    box-shadow: none;
    opacity: 0;
}

body.pl-landing-time .pl-email-automation-anim__wait {
    align-self: start;
    margin: 0;
    padding: 3px 8px;
    width: fit-content;
    border-radius: 0;
    background: #fff;
    border: 1px dashed rgba(0, 0, 0, 0.16);
    font-size: 8px;
    font-weight: 650;
    color: #9ca3af;
    opacity: 0;
    transform: scale(0.94);
    animation: plEmailAutoWait var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-body {
    animation:
        plEmailAutoNodeTriggerMove var(--email-automation-cycle) ease-out 1 forwards,
        plEmailAutoNodeTriggerPaint var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__badge {
    animation: plEmailAutoBadgeTrigger var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--email1 .pl-email-automation-anim__node-body {
    animation: plEmailAutoNodeEmail1 var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--email1 .pl-email-automation-anim__badge {
    animation: plEmailAutoBadge1 var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--email2 .pl-email-automation-anim__node-body {
    animation: plEmailAutoNodeEmail2 var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--email2 .pl-email-automation-anim__badge {
    animation: plEmailAutoBadge2 var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--goal {
    margin-bottom: 0;
}

body.pl-landing-time .pl-email-automation-anim__node--goal .pl-email-automation-anim__node-body {
    background: #ecfdf5;
    border-color: rgba(22, 163, 74, 0.28);
    animation: plEmailAutoNodeGoal var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

/* —— Right: live email preview —— */
body.pl-landing-time .pl-email-automation-anim__preview {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 10px 10px 0;
    border-radius: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(8px);
    animation: plEmailAutoPaneIn var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    animation-delay: 0.06s;
    overflow: hidden;
}

body.pl-landing-time .pl-email-automation-anim__preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
    padding: 0 2px 7px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex: 0 0 auto;
}

body.pl-landing-time .pl-email-automation-anim__preview-head strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-automation-anim__preview-head span {
    font-size: 8px;
    font-weight: 600;
    color: #9ca3af;
    animation: plEmailAutoPreviewLabel var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__preview-head span::before {
    content: "Waiting…";
    animation: plEmailAutoPreviewLabelText var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__mail,
body.pl-landing-time .pl-email-automation-anim__success {
    position: absolute;
    left: 10px;
    right: 10px;
    top: 42px;
    bottom: 0;
}

body.pl-landing-time .pl-email-automation-anim__mail {
    display: flex;
    flex-direction: column;
    gap: 8px;
    opacity: 0;
    transform: translateY(8px) scale(0.98);
    animation: plEmailAutoMailIn var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    transform-origin: center top;
}

body.pl-landing-time .pl-email-automation-anim__mail-meta {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 0 2px;
}

body.pl-landing-time .pl-email-automation-anim__mail-meta span {
    font-size: 8px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-automation-anim__mail-meta strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    animation: plEmailAutoSubject var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__mail-meta strong::before {
    content: "Complete your order";
    animation: plEmailAutoSubjectText var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__mail-body {
    flex: 1;
    min-height: 0;
    padding: 10px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fafafa;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

body.pl-landing-time .pl-email-automation-anim__to {
    display: flex;
    align-items: center;
    gap: 6px;
}

body.pl-landing-time .pl-email-automation-anim__av {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #3373d1;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    flex-shrink: 0;
}

body.pl-landing-time .pl-email-automation-anim__to div {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
}

body.pl-landing-time .pl-email-automation-anim__to strong {
    font-size: 9px;
    font-weight: 650;
    color: #111;
}

body.pl-landing-time .pl-email-automation-anim__to em {
    font-style: normal;
    font-size: 7px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-automation-anim__hero {
    height: 48px;
    border-radius: 0;
    background:
        linear-gradient(135deg, rgba(17, 17, 17, 0.06), transparent 55%),
        #e5e7eb;
    animation: plEmailAutoHero var(--email-automation-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__line {
    height: 6px;
    border-radius: 0;
    background: #e5e7eb;
    width: 92%;
}

body.pl-landing-time .pl-email-automation-anim__line--short {
    width: 58%;
}

body.pl-landing-time .pl-email-automation-anim__cta {
    align-self: flex-start;
    margin-top: 2px;
    padding: 6px 10px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: -0.01em;
    animation: plEmailAutoCtaText var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__cta::before {
    content: "Complete order";
    animation: plEmailAutoCtaLabel var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__success {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    opacity: 0;
    transform: scale(0.94);
    pointer-events: none;
    animation: plEmailAutoSuccessIn var(--email-automation-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__success-icon {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    color: #111;
}

body.pl-landing-time .pl-email-automation-anim__success-icon svg {
    width: 22px;
    height: 22px;
    display: block;
}

body.pl-landing-time .pl-email-automation-anim__success strong {
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-automation-anim__success span {
    font-size: 10px;
    font-weight: 600;
    color: #111;
}

/* —— Keyframes —— */
@keyframes plEmailAutoPaneIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    12%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAutoFly1 {
    0%, 28% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0.82) rotate(-4deg);
    }
    30% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1) rotate(-2deg);
    }
    36% {
        opacity: 1;
        transform: translate3d(48cqi, 8px, 0) scale(1.08) rotate(2deg);
    }
    40%, 100% {
        opacity: 0;
        transform: translate3d(52cqi, 12px, 0) scale(0.88) rotate(3deg);
    }
}

@keyframes plEmailAutoFly2 {
    0%, 54% {
        opacity: 0;
        transform: translate3d(0, 0, 0) scale(0.82) rotate(-4deg);
    }
    56% {
        opacity: 1;
        transform: translate3d(0, 0, 0) scale(1) rotate(-2deg);
    }
    62% {
        opacity: 1;
        transform: translate3d(48cqi, -18px, 0) scale(1.08) rotate(2deg);
    }
    66%, 100% {
        opacity: 0;
        transform: translate3d(52cqi, -14px, 0) scale(0.88) rotate(3deg);
    }
}

@keyframes plEmailAutoNodeTriggerMove {
    0%, 10% {
        opacity: 0.4;
        transform: translateX(6px);
    }
    16%, 100% {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes plEmailAutoNodeTriggerPaint {
    0%, 10% {
        background: #fafafa;
        border-color: rgba(0, 0, 0, 0.08);
        color: #111;
    }
    11%, 100% {
        background: #111;
        border-color: #111;
        color: #fff;
    }
}

@keyframes plEmailAutoBadgeTrigger {
    0%, 10% { opacity: 0; transform: scale(0.9); }
    11%, 100% { opacity: 1; transform: scale(1); background: #fff; color: #111; }
}

body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-copy span {
    animation: plEmailAutoTriggerMute var(--email-automation-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-copy strong {
    animation: plEmailAutoTriggerStrong var(--email-automation-cycle) steps(1, end) 1 forwards;
}

@keyframes plEmailAutoTriggerMute {
    0%, 10% { color: #9ca3af; }
    11%, 100% { color: rgba(255, 255, 255, 0.55); }
}

@keyframes plEmailAutoTriggerStrong {
    0%, 10% { color: #111; }
    11%, 100% { color: #fff; }
}

@keyframes plEmailAutoNodeEmail1 {
    0%, 24% { opacity: 0.4; transform: translateX(6px); background: #fafafa; }
    30%, 100% { opacity: 1; transform: translateX(0); background: #f3f4f6; border-color: rgba(0, 0, 0, 0.12); }
}

@keyframes plEmailAutoBadge1 {
    0%, 32% { opacity: 0; transform: scale(0.9); }
    38%, 100% { opacity: 1; transform: scale(1); background: #111; color: #fff; }
}

@keyframes plEmailAutoWait {
    0%, 40% { opacity: 0; transform: scale(0.94); }
    46%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAutoNodeEmail2 {
    0%, 52% { opacity: 0.4; transform: translateX(6px); background: #fafafa; }
    58%, 100% { opacity: 1; transform: translateX(0); background: #f3f4f6; border-color: rgba(0, 0, 0, 0.12); }
}

@keyframes plEmailAutoBadge2 {
    0%, 60% { opacity: 0; transform: scale(0.9); }
    66%, 100% { opacity: 1; transform: scale(1); background: #111; color: #fff; }
}

@keyframes plEmailAutoNodeGoal {
    0%, 74% { opacity: 0; transform: translateX(6px) scale(0.96); }
    82%, 100% { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes plEmailAutoPreviewLabel {
    0%, 100% { opacity: 1; }
}

@keyframes plEmailAutoPreviewLabelText {
    0%, 28% { content: "Waiting…"; }
    30%, 72% { content: "Sending…"; }
    78%, 100% { content: "Complete"; }
}

@keyframes plEmailAutoMailIn {
    0%, 30% { opacity: 0; transform: translateY(10px) scale(0.94); }
    36%, 38% { opacity: 1; transform: translateY(0) scale(1.03); }
    42%, 55% { opacity: 1; transform: translateY(0) scale(1); }
    56%, 58% { opacity: 1; transform: translateY(0) scale(1.03); }
    62%, 72% { opacity: 1; transform: translateY(0) scale(1); }
    78%, 100% { opacity: 0; transform: translateY(-6px) scale(0.98); }
}

@keyframes plEmailAutoSubject {
    0%, 100% { opacity: 1; }
}

@keyframes plEmailAutoSubjectText {
    0%, 54% { content: "How was your service?"; }
    58%, 100% { content: "Quick satisfaction survey"; }
}

@keyframes plEmailAutoHero {
    0%, 54% { filter: none; }
    58%, 100% { filter: saturate(1.05); }
}

@keyframes plEmailAutoCtaText {
    0%, 100% { opacity: 1; }
}

@keyframes plEmailAutoCtaLabel {
    0%, 54% { content: "Leave a review"; }
    58%, 100% { content: "Take survey"; }
}

@keyframes plEmailAutoSuccessIn {
    0%, 76% { opacity: 0; transform: scale(0.94); pointer-events: none; }
    84%, 100% { opacity: 1; transform: scale(1); pointer-events: auto; }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-email-automation-anim {
        grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
        gap: 6px;
    }

    body.pl-landing-time .pl-email-automation-anim__node-copy strong {
        font-size: 9px;
    }

    /* Right preview panel — smaller type so subjects don’t wrap on narrow cards */
    body.pl-landing-time .pl-email-automation-anim__preview-head {
        padding: 7px 8px;
    }

    body.pl-landing-time .pl-email-automation-anim__preview-head strong {
        font-size: 8px;
    }

    body.pl-landing-time .pl-email-automation-anim__preview-head span {
        font-size: 7px;
    }

    body.pl-landing-time .pl-email-automation-anim__mail,
    body.pl-landing-time .pl-email-automation-anim__success {
        left: 7px;
        right: 7px;
        top: 34px;
    }

    body.pl-landing-time .pl-email-automation-anim__mail {
        gap: 5px;
    }

    body.pl-landing-time .pl-email-automation-anim__mail-meta span {
        font-size: 7px;
    }

    body.pl-landing-time .pl-email-automation-anim__mail-meta strong {
        font-size: 8px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    body.pl-landing-time .pl-email-automation-anim__mail-body {
        padding: 7px;
        gap: 5px;
    }

    body.pl-landing-time .pl-email-automation-anim__av {
        width: 16px;
        height: 16px;
        font-size: 6px;
    }

    body.pl-landing-time .pl-email-automation-anim__to strong {
        font-size: 7px;
    }

    body.pl-landing-time .pl-email-automation-anim__to em {
        font-size: 6px;
    }

    body.pl-landing-time .pl-email-automation-anim__hero {
        height: 32px;
    }

    body.pl-landing-time .pl-email-automation-anim__line {
        height: 4px;
    }

    body.pl-landing-time .pl-email-automation-anim__cta {
        padding: 4px 7px;
        font-size: 6px;
    }

    body.pl-landing-time .pl-email-automation-anim__success {
        gap: 5px;
    }

    body.pl-landing-time .pl-email-automation-anim__success-icon {
        width: 20px;
        height: 20px;
    }

    body.pl-landing-time .pl-email-automation-anim__success-icon svg {
        width: 16px;
        height: 16px;
    }

    body.pl-landing-time .pl-email-automation-anim__success strong {
        font-size: 9px;
    }

    body.pl-landing-time .pl-email-automation-anim__success span {
        font-size: 7px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-email-automation-anim__flow,
    body.pl-landing-time .pl-email-automation-anim__preview,
    body.pl-landing-time .pl-email-automation-anim__node-body,
    body.pl-landing-time .pl-email-automation-anim__badge,
    body.pl-landing-time .pl-email-automation-anim__wait,
    body.pl-landing-time .pl-email-automation-anim__mail,
    body.pl-landing-time .pl-email-automation-anim__success,
    body.pl-landing-time .pl-email-automation-anim__preview-head span::before,
    body.pl-landing-time .pl-email-automation-anim__mail-meta strong::before,
    body.pl-landing-time .pl-email-automation-anim__cta::before,
    body.pl-landing-time .pl-email-automation-anim__fly,
    body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-copy span,
    body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-copy em,
    body.pl-landing-time .pl-email-automation-anim__node--trigger .pl-email-automation-anim__node-copy strong {
        animation: none !important;
    }

    body.pl-landing-time .pl-email-automation-anim__fly {
        display: none;
    }

    body.pl-landing-time .pl-email-automation-anim__flow,
    body.pl-landing-time .pl-email-automation-anim__preview,
    body.pl-landing-time .pl-email-automation-anim__node-body,
    body.pl-landing-time .pl-email-automation-anim__badge,
    body.pl-landing-time .pl-email-automation-anim__wait {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-email-automation-anim__mail {
        opacity: 0;
    }

    body.pl-landing-time .pl-email-automation-anim__success {
        opacity: 1;
        transform: none;
    }
}


/* ---- css/pl-time-anims/email-domain.css ---- */
/**
 * Branded sending domain verification bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-email-domain-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background:
        radial-gradient(120% 80% at 100% 0%, rgba(0, 122, 77, 0.08), transparent 55%),
        #f7f7f5;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-email-domain-anim {
    --email-domain-cycle: 7.5s;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-email-domain-anim__shell {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    padding: 12px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 14px 32px rgba(0, 0, 0, 0.07);
    opacity: 0;
    transform: translateY(8px);
    animation: plEmailDomainShellIn var(--email-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-email-domain-anim__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-domain-anim__bar-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

body.pl-landing-time .pl-email-domain-anim__bar span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-domain-anim__bar strong {
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.03em;
    color: #111;
}

body.pl-landing-time .pl-email-domain-anim__shield {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 0;
    color: #9ca3af;
    background: #f3f4f6;
    border: 1px solid rgba(0, 0, 0, 0.06);
    animation: plEmailDomainShield var(--email-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__shield svg {
    width: 15px;
    height: 15px;
}

body.pl-landing-time .pl-email-domain-anim__shield-check {
    stroke-dasharray: 18;
    stroke-dashoffset: 18;
    animation: plEmailDomainShieldCheck var(--email-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    flex: 1;
    min-height: 0;
}

body.pl-landing-time .pl-email-domain-anim__item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 7px 9px;
    border-radius: 0;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.06);
    position: relative;
    overflow: hidden;
}

body.pl-landing-time .pl-email-domain-anim__item::after {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    background: linear-gradient(90deg, rgba(0, 122, 77, 0.1), transparent);
    animation: plEmailDomainScan var(--email-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__item--dkim::after {
    animation-name: plEmailDomainScanDkim;
}

body.pl-landing-time .pl-email-domain-anim__item--spf::after {
    animation-name: plEmailDomainScanSpf;
}

body.pl-landing-time .pl-email-domain-anim__item--dmarc::after {
    animation-name: plEmailDomainScanDmarc;
}

body.pl-landing-time .pl-email-domain-anim__badge {
    position: relative;
    z-index: 1;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #111;
}

body.pl-landing-time .pl-email-domain-anim__state {
    position: relative;
    z-index: 1;
    display: inline-grid;
    align-items: center;
    justify-items: end;
    min-width: 68px;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

body.pl-landing-time .pl-email-domain-anim__state i,
body.pl-landing-time .pl-email-domain-anim__state em,
body.pl-landing-time .pl-email-domain-anim__state b {
    grid-area: 1 / 1;
}

body.pl-landing-time .pl-email-domain-anim__state i {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    border: 1.5px solid #d1d5db;
    border-top-color: #111;
    justify-self: end;
    opacity: 0;
    animation: plEmailDomainSpinner var(--email-domain-cycle) linear 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__item--dkim .pl-email-domain-anim__state i {
    animation-name: plEmailDomainSpinnerDkim;
}

body.pl-landing-time .pl-email-domain-anim__item--spf .pl-email-domain-anim__state i {
    animation-name: plEmailDomainSpinnerSpf;
}

body.pl-landing-time .pl-email-domain-anim__item--dmarc .pl-email-domain-anim__state i {
    animation-name: plEmailDomainSpinnerDmarc;
}

body.pl-landing-time .pl-email-domain-anim__state em {
    font-style: normal;
    padding: 3px 7px;
    border-radius: 0;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid rgba(0, 0, 0, 0.06);
    opacity: 1;
    animation: plEmailDomainPending var(--email-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__item--dkim .pl-email-domain-anim__state em {
    animation-name: plEmailDomainPendingDkim;
}

body.pl-landing-time .pl-email-domain-anim__item--spf .pl-email-domain-anim__state em {
    animation-name: plEmailDomainPendingSpf;
}

body.pl-landing-time .pl-email-domain-anim__item--dmarc .pl-email-domain-anim__state em {
    animation-name: plEmailDomainPendingDmarc;
}

body.pl-landing-time .pl-email-domain-anim__state b {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-weight: 650;
    padding: 3px 7px 3px 5px;
    border-radius: 0;
    background: #e6f4ec;
    color: #007a4d;
    border: 1px solid rgba(0, 133, 86, 0.22);
    opacity: 0;
    transform: scale(0.92);
    animation: plEmailDomainVerified var(--email-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__state b svg {
    width: 10px;
    height: 10px;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-email-domain-anim__item--dkim .pl-email-domain-anim__state b {
    animation-name: plEmailDomainVerifiedDkim;
}

body.pl-landing-time .pl-email-domain-anim__item--spf .pl-email-domain-anim__state b {
    animation-name: plEmailDomainVerifiedSpf;
}

body.pl-landing-time .pl-email-domain-anim__item--dmarc .pl-email-domain-anim__state b {
    animation-name: plEmailDomainVerifiedDmarc;
}

body.pl-landing-time .pl-email-domain-anim__ready {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 9px 10px;
    border-radius: 0;
    background: #111;
    color: #fff;
    opacity: 0;
    transform: translateY(6px);
    animation: plEmailDomainReady var(--email-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__from-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

body.pl-landing-time .pl-email-domain-anim__av {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: #111;
    font-size: 8px;
    font-weight: 750;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-email-domain-anim__from-meta {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

body.pl-landing-time .pl-email-domain-anim__from-meta strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-email-domain-anim__from-swap {
    position: relative;
    display: grid;
    font-style: normal;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: -0.01em;
    min-height: 1.2em;
}

body.pl-landing-time .pl-email-domain-anim__from-old,
body.pl-landing-time .pl-email-domain-anim__from-new {
    grid-area: 1 / 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-domain-anim__from-old {
    color: rgba(255, 255, 255, 0.55);
    animation: plEmailDomainFromOld var(--email-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__from-new {
    color: rgba(255, 255, 255, 0.88);
    opacity: 0;
    transform: translateY(4px);
    animation: plEmailDomainFromNew var(--email-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-domain-anim__ready-pill {
    flex: 0 0 auto;
    font-size: 9px;
    font-weight: 650;
    padding: 4px 8px;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.16);
}

@keyframes plEmailDomainShellIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    10%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailDomainShield {
    0%, 68% {
        color: #9ca3af;
        background: #f3f4f6;
        border-color: rgba(0, 0, 0, 0.06);
    }
    74%, 100% {
        color: #007a4d;
        background: #e6f4ec;
        border-color: rgba(0, 133, 86, 0.22);
    }
}

@keyframes plEmailDomainShieldCheck {
    0%, 70% { stroke-dashoffset: 18; }
    78%, 100% { stroke-dashoffset: 0; }
}

@keyframes plEmailDomainScanDkim {
    0%, 12% { width: 0; }
    22%, 28% { width: 100%; }
    30%, 100% { width: 100%; opacity: 0; }
}

@keyframes plEmailDomainScanSpf {
    0%, 32% { width: 0; }
    42%, 48% { width: 100%; }
    50%, 100% { width: 100%; opacity: 0; }
}

@keyframes plEmailDomainScanDmarc {
    0%, 52% { width: 0; }
    62%, 68% { width: 100%; }
    70%, 100% { width: 100%; opacity: 0; }
}

@keyframes plEmailDomainSpinnerDkim {
    0%, 12% { opacity: 0; transform: rotate(0deg); }
    14%, 26% { opacity: 1; transform: rotate(360deg); }
    28%, 100% { opacity: 0; transform: rotate(360deg); }
}

@keyframes plEmailDomainSpinnerSpf {
    0%, 32% { opacity: 0; transform: rotate(0deg); }
    34%, 46% { opacity: 1; transform: rotate(360deg); }
    48%, 100% { opacity: 0; transform: rotate(360deg); }
}

@keyframes plEmailDomainSpinnerDmarc {
    0%, 52% { opacity: 0; transform: rotate(0deg); }
    54%, 66% { opacity: 1; transform: rotate(360deg); }
    68%, 100% { opacity: 0; transform: rotate(360deg); }
}

@keyframes plEmailDomainPendingDkim {
    0%, 26% { opacity: 1; }
    28%, 100% { opacity: 0; }
}

@keyframes plEmailDomainPendingSpf {
    0%, 46% { opacity: 1; }
    48%, 100% { opacity: 0; }
}

@keyframes plEmailDomainPendingDmarc {
    0%, 66% { opacity: 1; }
    68%, 100% { opacity: 0; }
}

@keyframes plEmailDomainVerifiedDkim {
    0%, 26% { opacity: 0; transform: scale(0.92); }
    28%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailDomainVerifiedSpf {
    0%, 46% { opacity: 0; transform: scale(0.92); }
    48%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailDomainVerifiedDmarc {
    0%, 66% { opacity: 0; transform: scale(0.92); }
    68%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailDomainReady {
    0%, 72% { opacity: 0; transform: translateY(6px); }
    78%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailDomainFromOld {
    0%, 80% { opacity: 1; transform: translateY(0); }
    86%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes plEmailDomainFromNew {
    0%, 80% { opacity: 0; transform: translateY(4px); }
    86%, 100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-email-domain-anim__shell,
    body.pl-landing-time .pl-email-domain-anim__item::after,
    body.pl-landing-time .pl-email-domain-anim__state i,
    body.pl-landing-time .pl-email-domain-anim__state em,
    body.pl-landing-time .pl-email-domain-anim__state b,
    body.pl-landing-time .pl-email-domain-anim__ready,
    body.pl-landing-time .pl-email-domain-anim__shield,
    body.pl-landing-time .pl-email-domain-anim__shield-check,
    body.pl-landing-time .pl-email-domain-anim__from-old,
    body.pl-landing-time .pl-email-domain-anim__from-new {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        stroke-dashoffset: 0 !important;
    }

    body.pl-landing-time .pl-email-domain-anim__state em,
    body.pl-landing-time .pl-email-domain-anim__from-old {
        display: none;
    }

    body.pl-landing-time .pl-email-domain-anim__shield {
        color: #007a4d;
        background: #e6f4ec;
        border-color: rgba(0, 133, 86, 0.22);
    }
}


/* ---- css/pl-time-anims/email-analytics.css ---- */
/**
 * Email recipient analytics bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-email-analytics-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-email-analytics-anim {
    --email-analytics-cycle: 8s;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-email-analytics-anim__shell {
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 100%;
    padding: 12px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: plEmailAnalyticsShellIn var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-email-analytics-anim__camp {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-analytics-anim__camp span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-analytics-anim__camp strong {
    flex: 1;
    min-width: 0;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-analytics-anim__camp em {
    font-style: normal;
    font-size: 9px;
    font-weight: 650;
    padding: 3px 7px;
    border-radius: 0;
    background: #f3f4f6;
    color: #6b7280;
    border: 1px solid rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: scale(0.92);
    animation: plEmailAnalyticsSent var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

body.pl-landing-time .pl-email-analytics-anim__stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px;
    border-radius: 0;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-analytics-anim__meter {
    height: 4px;
    border-radius: 0;
    background: #e5e7eb;
    overflow: hidden;
}

body.pl-landing-time .pl-email-analytics-anim__meter i {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: #111;
    animation: plEmailAnalyticsMeter var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__stat--opens .pl-email-analytics-anim__meter i {
    animation-name: plEmailAnalyticsMeterOpens;
    background: #111;
}

body.pl-landing-time .pl-email-analytics-anim__stat--clicks .pl-email-analytics-anim__meter i {
    animation-name: plEmailAnalyticsMeterClicks;
    background: #111;
}

body.pl-landing-time .pl-email-analytics-anim__stat strong {
    font-size: 16px;
    font-weight: 650;
    letter-spacing: -0.03em;
    color: #111;
    line-height: 1;
    opacity: 0;
    transform: translateY(4px);
    animation: plEmailAnalyticsStatNum var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__stat--opens strong {
    animation-name: plEmailAnalyticsNumOpens;
}

body.pl-landing-time .pl-email-analytics-anim__stat--clicks strong {
    animation-name: plEmailAnalyticsNumClicks;
}

body.pl-landing-time .pl-email-analytics-anim__stat span {
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-email-analytics-anim__rows {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-height: 0;
    mask-image: linear-gradient(to bottom, #000 0%, #000 82%, transparent 100%);
}

body.pl-landing-time .pl-email-analytics-anim__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 0;
    border: 1px solid transparent;
    opacity: 0;
    transform: translateY(6px);
}

body.pl-landing-time .pl-email-analytics-anim__row--a {
    animation:
        plEmailAnalyticsRowIn var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards,
        plEmailAnalyticsRowSelect var(--email-analytics-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--b {
    animation: plEmailAnalyticsRowB var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--c {
    animation: plEmailAnalyticsRowC var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__av {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #111;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-email-analytics-anim__meta {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

body.pl-landing-time .pl-email-analytics-anim__meta strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-analytics-anim__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

body.pl-landing-time .pl-email-analytics-anim__tag {
    font-style: normal;
    font-size: 8px;
    font-weight: 650;
    padding: 2px 6px;
    border-radius: 0;
    opacity: 0;
    transform: scale(0.9);
}

body.pl-landing-time .pl-email-analytics-anim__row--a .pl-email-analytics-anim__tag--open,
body.pl-landing-time .pl-email-analytics-anim__row--a .pl-email-analytics-anim__tag--click,
body.pl-landing-time .pl-email-analytics-anim__row--b .pl-email-analytics-anim__tag--open,
body.pl-landing-time .pl-email-analytics-anim__row--c .pl-email-analytics-anim__tag--open,
body.pl-landing-time .pl-email-analytics-anim__row--c .pl-email-analytics-anim__tag--click {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-analytics-anim__row--a .pl-email-analytics-anim__tag--open {
    animation: plEmailAnalyticsTagOpenA var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--a .pl-email-analytics-anim__tag--click {
    animation: plEmailAnalyticsTagClickA var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--b .pl-email-analytics-anim__tag--open {
    animation: plEmailAnalyticsTagOpenB var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--c .pl-email-analytics-anim__tag--open {
    animation: plEmailAnalyticsTagOpenC var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-analytics-anim__row--c .pl-email-analytics-anim__tag--click {
    animation: plEmailAnalyticsTagClickC var(--email-analytics-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

@keyframes plEmailAnalyticsShellIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    10%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsSent {
    0%, 8% { opacity: 0; transform: scale(0.92); }
    14%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAnalyticsMeterOpens {
    0%, 14% { width: 0; }
    28%, 100% { width: 68%; }
}

@keyframes plEmailAnalyticsMeterClicks {
    0%, 22% { width: 0; }
    36%, 100% { width: 24%; }
}

@keyframes plEmailAnalyticsNumOpens {
    0%, 18% { opacity: 0; transform: translateY(4px); }
    24%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsNumClicks {
    0%, 26% { opacity: 0; transform: translateY(4px); }
    32%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsRowIn {
    0%, 44% { opacity: 0; transform: translateY(6px); }
    50%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsRowB {
    0%, 52% { opacity: 0; transform: translateY(6px); }
    58%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsRowC {
    0%, 58% { opacity: 0; transform: translateY(6px); }
    64%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailAnalyticsRowSelect {
    0%, 68% { background: transparent; border-color: transparent; }
    72%, 88% { background: rgba(0, 0, 0, 0.04); border-color: rgba(0, 0, 0, 0.1); }
    92%, 100% { background: transparent; border-color: transparent; }
}

@keyframes plEmailAnalyticsTagOpenA {
    0%, 50% { opacity: 0; transform: scale(0.9); }
    56%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAnalyticsTagClickA {
    0%, 54% { opacity: 0; transform: scale(0.9); }
    60%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAnalyticsTagOpenB {
    0%, 58% { opacity: 0; transform: scale(0.9); }
    64%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAnalyticsTagOpenC {
    0%, 64% { opacity: 0; transform: scale(0.9); }
    70%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailAnalyticsTagClickC {
    0%, 68% { opacity: 0; transform: scale(0.9); }
    74%, 100% { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-email-analytics-anim__shell,
    body.pl-landing-time .pl-email-analytics-anim__camp em,
    body.pl-landing-time .pl-email-analytics-anim__meter i,
    body.pl-landing-time .pl-email-analytics-anim__stat strong,
    body.pl-landing-time .pl-email-analytics-anim__row,
    body.pl-landing-time .pl-email-analytics-anim__tag {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
    }

    body.pl-landing-time .pl-email-analytics-anim__stat--opens .pl-email-analytics-anim__meter i { width: 68%; }
    body.pl-landing-time .pl-email-analytics-anim__stat--clicks .pl-email-analytics-anim__meter i { width: 24%; }
}


/* ---- css/pl-time-anims/email-editor.css ---- */
/**
 * Email drag-and-drop editor bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-email-editor-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim {
    --email-editor-cycle: 12s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-email-editor-anim__shell {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: plEmailEditorShellIn var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    background: #fafafa;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex: 0 0 auto;
}

body.pl-landing-time .pl-email-editor-anim__toolbar > span {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-editor-anim__send {
    flex-shrink: 0;
    padding: 4px 10px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: -0.01em;
    opacity: 0;
    transform: scale(0.92);
    animation: plEmailEditorToolbarSend var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__workspace {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 8px;
    flex: 1;
    min-height: 0;
    height: 100%;
    padding: 8px;
}

body.pl-landing-time .pl-email-editor-anim__palette {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim__blocks {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-height: 0;
    justify-content: space-between;
}

body.pl-landing-time .pl-email-editor-anim__block {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 1;
    min-height: 0;
    padding: 4px 6px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    font-size: 7px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #374151;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03);
    white-space: nowrap;
}

body.pl-landing-time .pl-email-editor-anim__block--btn {
    animation: plEmailEditorPaletteBtn var(--email-editor-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__block--text {
    animation: plEmailEditorPaletteText var(--email-editor-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__block--image {
    animation: plEmailEditorPaletteImage var(--email-editor-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__canvas {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 10px;
    border-radius: 0;
    background: #f8fafc;
    border: 1px dashed rgba(0, 0, 0, 0.1);
}

body.pl-landing-time .pl-email-editor-anim__email {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 8px;
    flex: 1;
    min-height: 0;
}

/* Blocks stay out of the canvas until dragged in */
body.pl-landing-time .pl-email-editor-anim__added {
    position: relative;
    overflow: hidden;
    border-radius: 0;
    opacity: 0;
    max-height: 0;
    transform: scale(0.96);
    pointer-events: none;
}

body.pl-landing-time .pl-email-editor-anim__added--image {
    animation: plEmailEditorAddImage var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__added--text {
    animation: plEmailEditorAddText var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__added--cta {
    animation: plEmailEditorAddCta var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__image {
    height: 88px;
    border-radius: 0;
    background: #e5e7eb;
    border: 1px solid rgba(0, 0, 0, 0.1);
}

body.pl-landing-time .pl-email-editor-anim__text {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 2px 0;
}

body.pl-landing-time .pl-email-editor-anim__line {
    height: 5px;
    border-radius: 0;
    background: #e5e7eb;
}

body.pl-landing-time .pl-email-editor-anim__line--short {
    width: 58%;
}

body.pl-landing-time .pl-email-editor-anim__cta {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 30px;
}

body.pl-landing-time .pl-email-editor-anim__cta span {
    padding: 5px 14px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.01em;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-email-editor-anim__drag {
    position: absolute;
    z-index: 5;
    left: 5%;
    top: 44%;
    pointer-events: none;
    opacity: 0;
    transform-origin: 0 0;
}

body.pl-landing-time .pl-email-editor-anim__drag--image {
    animation: plEmailEditorDragImage var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__drag--text {
    animation: plEmailEditorDragText var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__drag--btn {
    animation: plEmailEditorDragBtn var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__cursor {
    position: absolute;
    left: 0;
    top: 0;
    width: 16px;
    height: 21px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='21' viewBox='0 0 16 21'%3E%3Cpath fill='%23111' stroke='%23fff' stroke-width='1.1' stroke-linejoin='round' d='M1 1v14.5L5 12l2.2 5.8 1.8-.7L6.8 11H13L1 1z'/%3E%3C/svg%3E") no-repeat 0 0 / contain;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.12));
}

body.pl-landing-time .pl-email-editor-anim__floater {
    position: absolute;
    left: 8px;
    top: 6px;
    display: flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.12);
    background: #fff;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
    font-size: 7px;
    font-weight: 650;
    color: #374151;
    white-space: nowrap;
}

/* Native-style campaign send sheet (right panel) */
body.pl-landing-time .pl-email-editor-anim__sheet {
    position: absolute;
    inset: 0;
    z-index: 6;
    pointer-events: none;
    background: rgba(0, 0, 0, 0);
    animation: plEmailEditorSheetScrim var(--email-editor-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(148px, 48%);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: -10px 0 28px rgba(0, 0, 0, 0.12);
    transform: translateX(105%);
    animation: plEmailEditorSheetIn var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim__sheet-head {
    flex: 0 0 auto;
    padding: 9px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-editor-anim__sheet-head strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-editor-anim__sheet-body {
    flex: 1;
    min-height: 0;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim__sheet-subject {
    padding: 7px 8px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fafafa;
    font-size: 9px;
    font-weight: 600;
    color: #111;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-email-editor-anim__sheet-group {
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    overflow: hidden;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 4px;
    padding: 7px 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-email-editor-anim__sheet-row:last-child {
    border-bottom: none;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row span {
    font-size: 8px;
    font-weight: 650;
    color: #111;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row em {
    font-style: normal;
    font-size: 7px;
    font-weight: 600;
    color: #9ca3af;
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row svg {
    opacity: 0.4;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--list {
    animation: plEmailEditorSheetRowPulse var(--email-editor-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--list em {
    animation: plEmailEditorSheetListEm var(--email-editor-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--list em::before {
    content: "Choose lists";
    animation: plEmailEditorSheetListLabel var(--email-editor-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule {
    animation: plEmailEditorSheetSchedulePulse var(--email-editor-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule em {
    animation: plEmailEditorSheetScheduleEm var(--email-editor-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule em::before {
    content: "Immediately";
    animation: plEmailEditorSheetScheduleLabel var(--email-editor-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-foot {
    flex: 0 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    padding: 8px;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    background: #fafafa;
}

body.pl-landing-time .pl-email-editor-anim__sheet-action {
    display: grid;
    place-items: center;
    padding: 7px 6px;
    border-radius: 0;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-email-editor-anim__sheet-action--test {
    background: #fff;
    color: #111;
    border: 1px solid rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-email-editor-anim__sheet-action--send {
    background: #111;
    color: #fff;
    animation: plEmailEditorSheetSmashSend var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-success {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 12px;
    text-align: center;
    background: #fff;
    opacity: 0;
    transform: scale(0.96);
    pointer-events: none;
    animation: plEmailEditorSheetSuccess var(--email-editor-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-email-editor-anim__sheet-success strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-email-editor-anim__sheet-success span {
    font-size: 8px;
    font-weight: 600;
    color: #6b7280;
}

body.pl-landing-time .pl-email-editor-anim__sheet-success span::before {
    content: "Scheduled · Mon 10:00 AM";
}

@keyframes plEmailEditorShellIn {
    0%, 3% { opacity: 0; transform: translateY(8px); }
    8%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plEmailEditorToolbarSend {
    0%, 56% { opacity: 0; transform: scale(0.92); }
    60%, 64% { opacity: 1; transform: scale(1.06); }
    68%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailEditorSheetScrim {
    0%, 62% { background: rgba(0, 0, 0, 0); }
    66%, 100% { background: rgba(0, 0, 0, 0.18); }
}

@keyframes plEmailEditorSheetIn {
    0%, 62% { transform: translateX(105%); }
    68%, 100% { transform: translateX(0); }
}

@keyframes plEmailEditorSheetRowPulse {
    0%, 70% { background: transparent; }
    72%, 78% { background: #f3f4f6; }
    82%, 100% { background: transparent; }
}

@keyframes plEmailEditorSheetListLabel {
    0%, 75% { content: "Choose lists"; }
    76%, 100% { content: "All subscribers"; }
}

@keyframes plEmailEditorSheetListEm {
    0%, 75% { color: #9ca3af; }
    76%, 100% { color: #374151; }
}

@keyframes plEmailEditorSheetSmashSend {
    0%, 88% { transform: scale(1); box-shadow: none; }
    91% { transform: scale(1.08); box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.16); }
    95%, 100% { transform: scale(1); box-shadow: none; }
}

@keyframes plEmailEditorSheetSchedulePulse {
    0%, 80% { background: transparent; }
    82%, 88% { background: #f3f4f6; }
    92%, 100% { background: transparent; }
}

@keyframes plEmailEditorSheetScheduleLabel {
    0%, 85% { content: "Immediately"; }
    86%, 100% { content: "Mon · 10:00 AM"; }
}

@keyframes plEmailEditorSheetScheduleEm {
    0%, 85% { color: #9ca3af; }
    86%, 100% { color: #374151; }
}

@keyframes plEmailEditorSheetSuccess {
    0%, 93% { opacity: 0; transform: scale(0.96); }
    96%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plEmailEditorPaletteImage {
    0%, 8% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
    10%, 18% { border-color: rgba(0, 0, 0, 0.18); background: #f3f4f6; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06); }
    20%, 100% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
}

@keyframes plEmailEditorPaletteText {
    0%, 24% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
    26%, 34% { border-color: rgba(0, 0, 0, 0.18); background: #f3f4f6; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06); }
    36%, 100% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
}

@keyframes plEmailEditorPaletteBtn {
    0%, 40% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
    42%, 50% { border-color: rgba(0, 0, 0, 0.18); background: #f3f4f6; box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06); }
    52%, 100% { border-color: rgba(0, 0, 0, 0.08); background: #fff; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.03); }
}

@keyframes plEmailEditorAddImage {
    0%, 16% { opacity: 0; max-height: 0; transform: scale(0.96); }
    20%, 100% { opacity: 1; max-height: 100px; transform: scale(1); }
}

@keyframes plEmailEditorAddText {
    0%, 32% { opacity: 0; max-height: 0; transform: scale(0.96); }
    36%, 100% { opacity: 1; max-height: 36px; transform: scale(1); }
}

@keyframes plEmailEditorAddCta {
    0%, 48% { opacity: 0; max-height: 0; transform: scale(0.96); }
    52%, 100% { opacity: 1; max-height: 40px; transform: scale(1); }
}

@keyframes plEmailEditorDragImage {
    0%, 8% { opacity: 0; left: 5%; top: 38%; transform: scale(0.96); }
    10% { opacity: 1; left: 5%; top: 38%; transform: scale(1); }
    16% { opacity: 1; left: 55%; top: 32%; transform: scale(1); }
    18%, 100% { opacity: 0; left: 55%; top: 32%; transform: scale(0.96); }
}

@keyframes plEmailEditorDragText {
    0%, 24% { opacity: 0; left: 5%; top: 32%; transform: scale(0.96); }
    26% { opacity: 1; left: 5%; top: 32%; transform: scale(1); }
    32% { opacity: 1; left: 55%; top: 52%; transform: scale(1); }
    34%, 100% { opacity: 0; left: 55%; top: 52%; transform: scale(0.96); }
}

@keyframes plEmailEditorDragBtn {
    0%, 40% { opacity: 0; left: 5%; top: 44%; transform: scale(0.96); }
    42% { opacity: 1; left: 5%; top: 44%; transform: scale(1); }
    48% { opacity: 1; left: 34%; top: 72%; transform: scale(1); }
    50%, 100% { opacity: 0; left: 34%; top: 72%; transform: scale(0.96); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-email-editor-anim__shell,
    body.pl-landing-time .pl-email-editor-anim__block,
    body.pl-landing-time .pl-email-editor-anim__added,
    body.pl-landing-time .pl-email-editor-anim__drag,
    body.pl-landing-time .pl-email-editor-anim__send,
    body.pl-landing-time .pl-email-editor-anim__sheet,
    body.pl-landing-time .pl-email-editor-anim__sheet-panel,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--list,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--list em::before,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--list em,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule em::before,
    body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule em,
    body.pl-landing-time .pl-email-editor-anim__sheet-action--send,
    body.pl-landing-time .pl-email-editor-anim__sheet-success {
        animation: none !important;
        opacity: 1 !important;
        transform: none !important;
        max-height: none !important;
    }

    body.pl-landing-time .pl-email-editor-anim__drag {
        display: none;
    }

    body.pl-landing-time .pl-email-editor-anim__sheet {
        background: rgba(0, 0, 0, 0.18);
    }

    body.pl-landing-time .pl-email-editor-anim__sheet-panel {
        transform: none;
    }

    body.pl-landing-time .pl-email-editor-anim__sheet-row--list em::before {
        content: "All subscribers";
    }

    body.pl-landing-time .pl-email-editor-anim__sheet-row--schedule em::before {
        content: "Mon · 10:00 AM";
    }
}


/* ---- css/pl-time-anims/forms-code.css ---- */
/**
 * HTML form code examples bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-forms-code-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-forms-code-anim {
    --forms-code-cycle: 9s;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-forms-code-anim__window {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #0b1020;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.12);
    overflow: hidden;
    opacity: 0;
    transform: translateY(8px);
    animation: plFormsCodeShellIn var(--forms-code-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__chrome {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    background: rgba(255, 255, 255, 0.03);
}

body.pl-landing-time .pl-forms-code-anim__dots {
    display: inline-flex;
    gap: 4px;
}

body.pl-landing-time .pl-forms-code-anim__dots span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

body.pl-landing-time .pl-forms-code-anim__dots span:nth-child(1) { background: #ff5f57; }
body.pl-landing-time .pl-forms-code-anim__dots span:nth-child(2) { background: #febc2e; }
body.pl-landing-time .pl-forms-code-anim__dots span:nth-child(3) { background: #28c840; }

body.pl-landing-time .pl-forms-code-anim__file {
    font-size: 9px;
    font-weight: 500;
    color: rgba(226, 232, 240, 0.72);
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

body.pl-landing-time .pl-forms-code-anim__file::after {
    content: "contact.html";
    animation: plFormsCodeFile var(--forms-code-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__tabs {
    display: flex;
    gap: 4px;
    padding: 6px 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body.pl-landing-time .pl-forms-code-anim__tab {
    padding: 5px 8px;
    border-radius: 6px 6px 0 0;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: rgba(226, 232, 240, 0.5);
    border: 1px solid transparent;
    animation: plFormsCodeTab var(--forms-code-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__tab--html { animation-name: plFormsCodeTabHtml; }
body.pl-landing-time .pl-forms-code-anim__tab--js { animation-name: plFormsCodeTabJs; }
body.pl-landing-time .pl-forms-code-anim__tab--next { animation-name: plFormsCodeTabNext; }

body.pl-landing-time .pl-forms-code-anim__panels {
    position: relative;
    flex: 1;
    min-height: 0;
    padding: 10px 12px 12px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 8.5px;
    line-height: 1.55;
    color: #e2e8f0;
}

body.pl-landing-time .pl-forms-code-anim__panel {
    position: absolute;
    inset: 10px 12px 12px;
    margin: 0;
    opacity: 0;
    transform: translateY(4px);
    white-space: pre;
    overflow: hidden;
}

body.pl-landing-time .pl-forms-code-anim__panel--html {
    animation: plFormsCodePanelHtml var(--forms-code-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__panel--js {
    animation: plFormsCodePanelJs var(--forms-code-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__panel--next {
    animation: plFormsCodePanelNext var(--forms-code-cycle) ease 1 forwards;
}

body.pl-landing-time .pl-forms-code-anim__panel em {
    color: #a78bfa;
    font-style: normal;
}

body.pl-landing-time .pl-forms-code-anim__panel strong {
    color: #f472b6;
    font-weight: 600;
}

body.pl-landing-time .pl-forms-code-anim__cursor {
    display: inline-block;
    width: 1px;
    height: 0.95em;
    background: #a78bfa;
    vertical-align: text-bottom;
    margin-left: 1px;
    animation: plFormsCodeBlink 1s step-end infinite;
}

@keyframes plFormsCodeShellIn {
    0% { opacity: 0; transform: translateY(8px); }
    4%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsCodeFile {
    0%, 30% { content: "contact.html"; }
    33%, 63% { content: "submit.js"; }
    66%, 100% { content: "ContactForm.tsx"; }
}

@keyframes plFormsCodeTabHtml {
    0%, 30% { color: #f8fafc; background: rgba(124, 58, 237, 0.18); border-color: rgba(124, 58, 237, 0.35); }
    31%, 100% { color: rgba(226, 232, 240, 0.5); background: transparent; border-color: transparent; }
}

@keyframes plFormsCodeTabJs {
    0%, 30% { color: rgba(226, 232, 240, 0.5); background: transparent; border-color: transparent; }
    31%, 63% { color: #f8fafc; background: rgba(124, 58, 237, 0.18); border-color: rgba(124, 58, 237, 0.35); }
    64%, 100% { color: rgba(226, 232, 240, 0.5); background: transparent; border-color: transparent; }
}

@keyframes plFormsCodeTabNext {
    0%, 63% { color: rgba(226, 232, 240, 0.5); background: transparent; border-color: transparent; }
    64%, 100% { color: #f8fafc; background: rgba(124, 58, 237, 0.18); border-color: rgba(124, 58, 237, 0.35); }
}

@keyframes plFormsCodePanelHtml {
    0%, 4% { opacity: 0; transform: translateY(4px); }
    8%, 30% { opacity: 1; transform: translateY(0); }
    34%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes plFormsCodePanelJs {
    0%, 30% { opacity: 0; transform: translateY(4px); }
    34%, 63% { opacity: 1; transform: translateY(0); }
    67%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes plFormsCodePanelNext {
    0%, 63% { opacity: 0; transform: translateY(4px); }
    67%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsCodeBlink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-forms-code-anim__window,
    body.pl-landing-time .pl-forms-code-anim__tab,
    body.pl-landing-time .pl-forms-code-anim__panel {
        animation: none !important;
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-forms-code-anim__panel:not(.pl-forms-code-anim__panel--html) {
        display: none;
    }
}


/* ---- css/pl-time-anims/honeypot.css ---- */
/**
 * Honeypot + AI Spam Agent — three submissions arrive, each gets a verdict.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-honeypot-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-honeypot-anim {
    --honeypot-cycle: 8.4s;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
}

body.pl-landing-time .pl-honeypot-anim__panel {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    border-radius: 12px 12px 0 0;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-honeypot-anim__bar {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fafafa;
}

body.pl-landing-time .pl-honeypot-anim__bar img {
    display: block;
    height: 12px;
    width: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-honeypot-anim__bar-sep {
    width: 1px;
    height: 12px;
    background: rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-honeypot-anim__bar strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-honeypot-anim__rows {
    flex: 1;
    min-height: 0;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

body.pl-landing-time .pl-honeypot-anim__row {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    overflow: hidden;
    opacity: 0;
    transform: translateY(6px);
    animation: plHoneypotRowIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

body.pl-landing-time .pl-honeypot-anim__row--lead { animation-delay: 3.85s; }
body.pl-landing-time .pl-honeypot-anim__row--q1 { animation-delay: 6.05s; }
body.pl-landing-time .pl-honeypot-anim__row--q2 { animation-delay: 6.25s; }
body.pl-landing-time .pl-honeypot-anim__row--q3 { animation-delay: 6.45s; }

body.pl-landing-time .pl-honeypot-anim__row--lead {
    background: rgba(21, 94, 239, 0.06);
    box-shadow: inset 2px 0 0 #155eef;
}

/* Spam rows land (bot is there from the start), then collapse out so the
   real threads rise to the top of the list. */
body.pl-landing-time .pl-honeypot-anim__row.is-ready {
    opacity: 1;
    transform: none;
    animation: plHoneypotSweep 0.5s cubic-bezier(0.4, 0, 1, 1) 5.4s forwards;
}

body.pl-landing-time .pl-honeypot-anim__row--junk {
    animation:
        plHoneypotRowIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) 0.45s forwards,
        plHoneypotSweep 0.5s cubic-bezier(0.4, 0, 1, 1) 5.5s forwards;
}

body.pl-landing-time .pl-honeypot-anim__row--junk2 {
    animation:
        plHoneypotRowIn 0.45s cubic-bezier(0.22, 1, 0.36, 1) 2.15s forwards,
        plHoneypotSweep 0.5s cubic-bezier(0.4, 0, 1, 1) 5.6s forwards;
}

body.pl-landing-time .pl-honeypot-anim__tag.is-ready {
    opacity: 1;
    scale: 1;
    animation: none;
}

body.pl-landing-time .pl-honeypot-anim__row--quiet .pl-honeypot-anim__av {
    background: #d1d5db;
    color: #4b5563;
}

body.pl-landing-time .pl-honeypot-anim__row--quiet .pl-honeypot-anim__copy strong {
    font-weight: 560;
    color: #4b5563;
}

body.pl-landing-time .pl-honeypot-anim__av {
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #9ca3af;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-honeypot-anim__row--junk .pl-honeypot-anim__av,
body.pl-landing-time .pl-honeypot-anim__row--junk2 .pl-honeypot-anim__av { background: #f59e0b; }
body.pl-landing-time .pl-honeypot-anim__row--lead .pl-honeypot-anim__av { background: #111; }

body.pl-landing-time .pl-honeypot-anim__copy {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.pl-landing-time .pl-honeypot-anim__copy strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-honeypot-anim__copy em {
    font-style: normal;
    font-size: 10px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-honeypot-anim__tag {
    flex: 0 0 auto;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.02em;
    opacity: 0;
    scale: 0.9;
    animation: plHoneypotTagIn 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

body.pl-landing-time .pl-honeypot-anim__tag--blocked {
    background: #fef2f2;
    color: #dc2626;
}

body.pl-landing-time .pl-honeypot-anim__tag--filtered {
    background: #fff7ed;
    color: #ea580c;
    animation-delay: 1.35s;
}

body.pl-landing-time .pl-honeypot-anim__tag--filtered2 {
    background: #fff7ed;
    color: #ea580c;
    animation-delay: 3.05s;
}

@keyframes plHoneypotRowIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes plHoneypotSweep {
    from {
        max-height: 54px;
        opacity: 1;
        transform: translateX(0);
    }
    60% {
        opacity: 0;
        transform: translateX(-18px);
    }
    to {
        max-height: 0;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-bottom-color: transparent;
        transform: translateX(-18px);
    }
}

@keyframes plHoneypotTagIn {
    to {
        opacity: 1;
        scale: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-honeypot-anim__row,
    body.pl-landing-time .pl-honeypot-anim__tag {
        animation: none !important;
        opacity: 1;
        transform: none;
        scale: 1;
    }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-time-honeypot-stage {
        height: 280px;
        min-height: 280px;
        max-height: 280px;
    }

    body.pl-landing-time .pl-honeypot-anim__row {
        gap: 8px;
        padding: 9px 10px;
    }

    body.pl-landing-time .pl-honeypot-anim__av {
        width: 22px;
        height: 22px;
        font-size: 7px;
    }

    body.pl-landing-time .pl-honeypot-anim__copy strong { font-size: 10px; }
    body.pl-landing-time .pl-honeypot-anim__copy em { font-size: 9px; }

    body.pl-landing-time .pl-honeypot-anim__tag {
        padding: 3px 7px;
        font-size: 8px;
    }
}


/* ---- css/pl-time-anims/forms-spam.css ---- */
/**
 * AI Spam Agent — staggered messages branch off honeypot & AI, then stay landed.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-forms-spam-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-forms-spam-anim {
    --forms-spam-cycle: 12s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding: 12px 10px 10px;
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-forms-spam-anim__track {
    position: relative;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-forms-spam-anim__paths {
    position: absolute;
    inset: 8px 4px 28px;
    width: calc(100% - 8px);
    height: calc(100% - 36px);
    overflow: visible;
    pointer-events: none;
    z-index: 0;
}

body.pl-landing-time .pl-forms-spam-anim__path {
    fill: none;
    stroke-width: 1.4;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

body.pl-landing-time .pl-forms-spam-anim__path--main {
    stroke: rgba(0, 0, 0, 0.12);
    stroke-dasharray: 3 3;
}

body.pl-landing-time .pl-forms-spam-anim__branch {
    position: absolute;
    top: 34%;
    width: 2px;
    height: 0;
    border: none;
    border-left: none;
    background-image: repeating-linear-gradient(
        to bottom,
        currentColor 0 3px,
        transparent 3px 6px
    );
    background-repeat: no-repeat;
    background-size: 2px 100%;
    transform-origin: top center;
    opacity: 0;
    pointer-events: none;
    z-index: 0;
}

body.pl-landing-time .pl-forms-spam-anim__branch--hp {
    left: 34%;
    translate: -50% 0;
    color: rgba(220, 38, 38, 0.5);
    animation: plFormsSpamBranchHp var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__branch--ai {
    left: 62%;
    translate: -50% 0;
    color: rgba(234, 88, 12, 0.5);
    animation: plFormsSpamBranchAi var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__stop {
    position: absolute;
    top: 34%;
    translate: -50% -50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    z-index: 1;
}

body.pl-landing-time .pl-forms-spam-anim__stop--form { left: 8%; }
body.pl-landing-time .pl-forms-spam-anim__stop--hp { left: 34%; }
body.pl-landing-time .pl-forms-spam-anim__stop--ai { left: 62%; }
body.pl-landing-time .pl-forms-spam-anim__stop--inbox { left: 90%; }

body.pl-landing-time .pl-forms-spam-anim__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #fff;
    border: 2px solid #d1d5db;
    box-shadow: 0 0 0 3px #fff;
}

body.pl-landing-time .pl-forms-spam-anim__stop--hp .pl-forms-spam-anim__dot {
    border-color: rgba(220, 38, 38, 0.35);
}

body.pl-landing-time .pl-forms-spam-anim__stop--ai .pl-forms-spam-anim__dot {
    width: 28px;
    height: 28px;
    border: none;
    background: #111;
    display: grid;
    place-items: center;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.14);
}

body.pl-landing-time .pl-forms-spam-anim__stop--ai .pl-forms-spam-anim__dot img {
    width: 14px !important;
    height: 14px !important;
    min-height: 0 !important;
    max-height: none !important;
    border-radius: 3px;
    object-fit: cover !important;
}

body.pl-landing-time .pl-forms-spam-anim__stop span {
    font-size: 8px;
    font-weight: 650;
    letter-spacing: 0.02em;
    color: #6b7280;
    white-space: nowrap;
}

body.pl-landing-time .pl-forms-spam-anim__stop--ai span {
    color: #111;
}

body.pl-landing-time .pl-forms-spam-anim__hp-flash {
    position: absolute;
    left: 34%;
    top: 34%;
    translate: -50% -50%;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    opacity: 0;
    z-index: 0;
    pointer-events: none;
}

body.pl-landing-time .pl-forms-spam-anim__hp-flash--bad {
    background: rgba(220, 38, 38, 0.18);
    animation: plFormsSpamHpBad var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__hp-flash--ok {
    background: rgba(5, 150, 105, 0.16);
    animation: plFormsSpamHpOk var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__bin {
    position: absolute;
    translate: -50% 0;
    bottom: 8px;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    opacity: 0;
    z-index: 1;
}

body.pl-landing-time .pl-forms-spam-anim__bin--blocked {
    left: 34%;
    top: 74%;
    bottom: auto;
    translate: -50% -50%;
    background: #fef2f2;
    color: #dc2626;
    animation: plFormsSpamBinBlocked var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__bin--filtered {
    left: 62%;
    top: 74%;
    bottom: auto;
    translate: -50% -50%;
    background: #fff7ed;
    color: #ea580c;
    animation: plFormsSpamBinFiltered var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__bin--inbox {
    left: 90%;
    top: 48%;
    bottom: auto;
    translate: -50% -50%;
    background: #eff6ff;
    color: #155eef;
    animation: plFormsSpamBinInbox var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg {
    position: absolute;
    left: 8%;
    top: 34%;
    translate: -50% -50%;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
    opacity: 0;
    max-width: 108px;
    overflow: hidden;
}

body.pl-landing-time .pl-forms-spam-anim__msg-av {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 7px;
    font-weight: 700;
    color: #fff;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-forms-spam-anim__msg--bot .pl-forms-spam-anim__msg-av { background: #9ca3af; }
body.pl-landing-time .pl-forms-spam-anim__msg--junk .pl-forms-spam-anim__msg-av { background: #f59e0b; }
body.pl-landing-time .pl-forms-spam-anim__msg--lead .pl-forms-spam-anim__msg-av { background: #111; }

body.pl-landing-time .pl-forms-spam-anim__msg-copy {
    position: relative;
    min-width: 0;
    flex: 1;
    min-height: 22px;
    overflow: hidden;
}

body.pl-landing-time .pl-forms-spam-anim__msg strong {
    display: block;
    font-size: 8px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-forms-spam-anim__msg-sub {
    display: block;
    font-style: normal;
    font-size: 7px;
    line-height: 1.3;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-forms-spam-anim__msg-sub--result {
    position: absolute;
    left: 0;
    right: 0;
    top: 12px;
    opacity: 0;
}

body.pl-landing-time .pl-forms-spam-anim__msg--bot .pl-forms-spam-anim__msg-sub--pending {
    animation: plFormsSpamBotPending var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--bot .pl-forms-spam-anim__msg-sub--result {
    color: #dc2626;
    animation: plFormsSpamBotResult var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--junk .pl-forms-spam-anim__msg-sub--pending {
    animation: plFormsSpamJunkPending var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--junk .pl-forms-spam-anim__msg-sub--result {
    color: #ea580c;
    animation: plFormsSpamJunkResult var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--lead .pl-forms-spam-anim__msg-sub--pending {
    animation: plFormsSpamLeadPending var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--lead .pl-forms-spam-anim__msg-sub--result {
    color: #155eef;
    animation: plFormsSpamLeadResult var(--forms-spam-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--bot {
    animation: plFormsSpamTravelBot var(--forms-spam-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--junk {
    animation: plFormsSpamTravelJunk var(--forms-spam-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-forms-spam-anim__msg--lead {
    animation: plFormsSpamTravelLead var(--forms-spam-cycle) ease-in-out 1 forwards;
}

/* Branch lines grow from apex as message travels down */
@keyframes plFormsSpamBranchHp {
    0%, 10% { height: 0; opacity: 0; }
    11% { height: 0; opacity: 1; }
    17%, 100% { height: 40%; opacity: 1; }
}

@keyframes plFormsSpamBranchAi {
    0%, 43% { height: 0; opacity: 0; }
    44% { height: 0; opacity: 1; }
    50%, 100% { height: 40%; opacity: 1; }
}

@keyframes plFormsSpamBotPending {
    0%, 10% { opacity: 0; }
    3%, 10% { opacity: 1; }
    12%, 100% { opacity: 0; }
}

@keyframes plFormsSpamBotResult {
    0%, 10% { opacity: 0; }
    12%, 100% { opacity: 1; }
}

@keyframes plFormsSpamJunkPending {
    0%, 28% { opacity: 0; }
    30%, 43% { opacity: 1; }
    46%, 100% { opacity: 0; }
}

@keyframes plFormsSpamJunkResult {
    0%, 44% { opacity: 0; }
    46%, 100% { opacity: 1; }
}

@keyframes plFormsSpamLeadPending {
    0%, 56% { opacity: 0; }
    58%, 78% { opacity: 1; }
    81%, 100% { opacity: 0; }
}

@keyframes plFormsSpamLeadResult {
    0%, 78% { opacity: 0; }
    81%, 100% { opacity: 1; }
}

/* Bot first — branches down at honeypot */
@keyframes plFormsSpamTravelBot {
    0%, 1% { left: 8%; top: 34%; opacity: 0; scale: 0.92; }
    3%, 5% { left: 8%; top: 34%; opacity: 1; scale: 1; }
    11% { left: 34%; top: 34%; opacity: 1; }
    17% { left: 34%; top: 74%; opacity: 1; scale: 0.96; }
    20%, 100% { left: 34%; top: 74%; opacity: 1; scale: 0.96; }
}

/* Junk second — main line then branches down at AI */
@keyframes plFormsSpamTravelJunk {
    0%, 26% { left: 8%; top: 34%; opacity: 0; scale: 0.92; }
    28%, 30% { left: 8%; top: 34%; opacity: 1; scale: 1; }
    36% { left: 34%; top: 34%; opacity: 1; }
    44% { left: 62%; top: 34%; opacity: 1; }
    50% { left: 62%; top: 74%; opacity: 1; scale: 0.96; }
    54%, 100% { left: 62%; top: 74%; opacity: 1; scale: 0.96; }
}

/* Lead last — stays on main trunk to inbox */
@keyframes plFormsSpamTravelLead {
    0%, 54% { left: 8%; top: 34%; opacity: 0; scale: 0.92; }
    56%, 58% { left: 8%; top: 34%; opacity: 1; scale: 1; }
    64% { left: 34%; top: 34%; opacity: 1; }
    72% { left: 62%; top: 34%; opacity: 1; }
    80% { left: 90%; top: 34%; opacity: 1; scale: 1; }
    84%, 100% { left: 90%; top: 34%; opacity: 1; scale: 1; }
}

@keyframes plFormsSpamHpBad {
    0%, 8% { opacity: 0; scale: 0.6; }
    11%, 17% { opacity: 1; scale: 1.4; }
    22%, 100% { opacity: 0.25; scale: 1.15; }
}

@keyframes plFormsSpamHpOk {
    0%, 33% { opacity: 0; scale: 0.6; }
    36%, 42% { opacity: 1; scale: 1.35; }
    48%, 61% { opacity: 0; scale: 1.15; }
    63%, 68% { opacity: 1; scale: 1.35; }
    74%, 100% { opacity: 0.2; scale: 1.1; }
}

@keyframes plFormsSpamBinBlocked {
    0%, 15% { opacity: 0; transform: translateY(4px); }
    18%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsSpamBinFiltered {
    0%, 48% { opacity: 0; transform: translateY(4px); }
    52%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsSpamBinInbox {
    0%, 78% { opacity: 0; transform: translateY(4px); }
    82%, 100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-forms-spam-anim__msg--bot {
        left: 34%;
        top: 74%;
        opacity: 1;
        scale: 0.96;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg--junk {
        left: 62%;
        top: 74%;
        opacity: 1;
        scale: 0.96;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg--lead {
        left: 90%;
        top: 34%;
        opacity: 1;
        scale: 1;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg,
    body.pl-landing-time .pl-forms-spam-anim__hp-flash,
    body.pl-landing-time .pl-forms-spam-anim__bin,
    body.pl-landing-time .pl-forms-spam-anim__branch,
    body.pl-landing-time .pl-forms-spam-anim__msg-sub {
        animation: none !important;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-sub--pending {
        opacity: 0;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-sub--result {
        opacity: 1;
    }

    body.pl-landing-time .pl-forms-spam-anim__branch {
        opacity: 1;
        height: 40%;
    }

    body.pl-landing-time .pl-forms-spam-anim__bin {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-time-forms-spam-stage {
        height: 280px;
        min-height: 280px;
        max-height: 280px;
    }

    body.pl-landing-time .pl-forms-spam-anim {
        padding: 10px 8px 8px;
    }

    body.pl-landing-time .pl-forms-spam-anim__paths {
        inset: 6px 2px 24px;
        width: calc(100% - 4px);
        height: calc(100% - 30px);
    }

    body.pl-landing-time .pl-forms-spam-anim__path--main {
        stroke-width: 1.6;
    }

    body.pl-landing-time .pl-forms-spam-anim__branch {
        width: 2.5px;
        background-size: 2.5px 100%;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop {
        gap: 4px;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop span {
        font-size: 7px;
        letter-spacing: 0;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop--ai > span:last-child {
        font-size: 0;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop--ai > span:last-child::before {
        content: "AI Agent";
        font-size: 7px;
        font-weight: 650;
        color: #111;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop--ai .pl-forms-spam-anim__dot {
        width: 24px;
        height: 24px;
    }

    body.pl-landing-time .pl-forms-spam-anim__stop--ai .pl-forms-spam-anim__dot img {
        width: 12px !important;
        height: 12px !important;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg {
        max-width: 92px;
        gap: 5px;
        padding: 4px 6px;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-av {
        width: 16px;
        height: 16px;
        font-size: 6px;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-copy {
        min-height: 20px;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg strong {
        font-size: 7px;
        margin-bottom: 1px;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-sub {
        font-size: 6px;
    }

    body.pl-landing-time .pl-forms-spam-anim__msg-sub--result {
        top: 10px;
    }

    /* Keep lead card clear of the Inbox stop/bin on the right edge */
    body.pl-landing-time .pl-forms-spam-anim__msg--lead {
        max-width: 84px;
    }

    @keyframes plFormsSpamTravelLead {
        0%, 54% { left: 8%; top: 34%; opacity: 0; scale: 0.92; }
        56%, 58% { left: 8%; top: 34%; opacity: 1; scale: 1; }
        64% { left: 34%; top: 34%; opacity: 1; }
        72% { left: 62%; top: 34%; opacity: 1; }
        80% { left: 84%; top: 34%; opacity: 1; scale: 1; }
        84%, 100% { left: 84%; top: 34%; opacity: 1; scale: 1; }
    }

    body.pl-landing-time .pl-forms-spam-anim__bin--inbox {
        left: 84%;
        top: 58%;
    }

    body.pl-landing-time .pl-forms-spam-anim__bin {
        padding: 3px 7px;
        font-size: 6px;
    }
}


/* ---- css/pl-time-anims/forms.css ---- */
/**
 * Website forms → Pathline Messages bento animation.
 * Scoped to body.pl-landing-time only.
 */
/* Website forms → Pathline Messages animation */
body.pl-landing-time .pl-time-forms-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-forms-anim {
    --forms-cycle: 7.2s;
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(48px, 0.55fr) minmax(0, 1.1fr);
    align-items: stretch;
    gap: 10px;
    width: 100%;
    height: 100%;
    min-height: 0;
    padding-bottom: 0;
}

body.pl-landing-time .pl-forms-anim__browser,
body.pl-landing-time .pl-forms-anim__inbox {
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

body.pl-landing-time .pl-forms-anim__browser {
    animation: plFormsBrowserPulse var(--forms-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__chrome {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 10px;
    background: #f3f4f6;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-forms-anim__chrome > span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d1d5db;
}

body.pl-landing-time .pl-forms-anim__chrome > span:nth-child(1) { background: #111; }
body.pl-landing-time .pl-forms-anim__chrome > span:nth-child(2) { background: #9ca3af; }
body.pl-landing-time .pl-forms-anim__chrome > span:nth-child(3) { background: #d1d5db; }

body.pl-landing-time .pl-forms-anim__url {
    flex: 1;
    margin-left: 4px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    font-size: 9px;
    font-weight: 500;
    color: #6b7280;
    letter-spacing: -0.01em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-forms-anim__form {
    padding: 14px 14px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

body.pl-landing-time .pl-forms-anim__label {
    margin: 0 0 10px !important;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-forms-anim__field {
    height: 28px;
    margin-bottom: 9px;
    padding: 0 9px;
    border-radius: 6px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fafafa;
    display: flex;
    align-items: center;
    overflow: hidden;
}

body.pl-landing-time .pl-forms-anim__field--tall {
    height: 40px;
    min-height: 40px;
    flex: 0 0 auto;
    align-items: flex-start;
    padding-top: 8px;
    margin-bottom: 10px;
}

body.pl-landing-time .pl-forms-anim__type {
    display: inline-block;
    height: auto;
    line-height: 1.35;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 500;
    color: #111;
    border-right: 1.5px solid transparent;
}

body.pl-landing-time .pl-forms-anim__type--name {
    animation: plFormsTypeName var(--forms-cycle) steps(12, end) 1 forwards;
}

body.pl-landing-time .pl-forms-anim__type--name::after { content: "Jordan Rivera"; }

body.pl-landing-time .pl-forms-anim__type--email {
    animation: plFormsTypeEmail var(--forms-cycle) steps(18, end) 1 forwards;
}

body.pl-landing-time .pl-forms-anim__type--email::after { content: "jordan@acme.co"; }

body.pl-landing-time .pl-forms-anim__type--msg {
    animation: plFormsTypeMsg var(--forms-cycle) steps(16, end) 1 forwards;
}

body.pl-landing-time .pl-forms-anim__type--msg::after { content: "Need a quote this week"; }

body.pl-landing-time .pl-forms-anim__submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: auto;
    align-self: flex-start;
    padding: 7px 16px;
    border: none;
    border-radius: 7px;
    background: #111;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.01em;
    cursor: default;
    pointer-events: none;
    animation: plFormsSubmit var(--forms-cycle) ease-in-out 1 forwards;
    box-shadow: 0 0 0 0 rgba(21, 94, 239, 0);
}

body.pl-landing-time .pl-forms-anim__flight {
    position: relative;
    height: auto;
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(0, 0, 0, 0.18);
    align-self: stretch;
}

body.pl-landing-time .pl-forms-anim__path {
    width: 100%;
    height: 80px;
    overflow: visible;
    display: block;
}

body.pl-landing-time .pl-forms-anim__path-line {
    animation: plFormsPathDash var(--forms-cycle) linear 1 forwards;
}

body.pl-landing-time .pl-forms-anim__runner {
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

body.pl-landing-time .pl-forms-anim__inbox {
    position: relative;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    min-height: 0;
    animation: plFormsInboxArrive var(--forms-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__inbox-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    background: #fafafa;
}

body.pl-landing-time .pl-forms-anim__inbox-bar img {
    display: block;
    height: 12px;
    width: auto;
    min-height: 0;
    max-height: none;
    object-fit: contain;
}

body.pl-landing-time .pl-forms-anim__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 999px;
    background: #155eef;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    opacity: 0;
    scale: 0.5;
    animation: plFormsBadge var(--forms-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__threads {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-forms-anim__thread {
    position: relative;
    display: flex;
    gap: 10px;
    align-items: flex-start;
    flex: 0 0 auto;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

body.pl-landing-time .pl-forms-anim__thread--existing {
    opacity: 1;
    transform: none;
    animation: plFormsThreadExisting var(--forms-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__thread--new {
    max-height: 0;
    opacity: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    border-bottom-color: transparent;
    transform: translateY(-6px);
    animation: plFormsThreadNew var(--forms-cycle) ease-out 1 forwards;
    background: rgba(21, 94, 239, 0.04);
}

body.pl-landing-time .pl-forms-anim__thread--new.is-unread .pl-forms-anim__thread-top strong {
    font-weight: 700;
}

body.pl-landing-time .pl-forms-anim__thread--new.is-unread .pl-forms-anim__thread-top em {
    color: #155eef;
}

body.pl-landing-time .pl-forms-anim__thread--new.is-unread .pl-forms-anim__thread-body p {
    color: #374151;
    font-weight: 550;
}

body.pl-landing-time .pl-forms-anim__unread-dot {
    position: absolute;
    right: 12px;
    top: 50%;
    translate: 0 -50%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #155eef;
    opacity: 0;
    scale: 0.5;
    animation: plFormsUnreadDot var(--forms-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__avatar {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-forms-anim__avatar--muted {
    background: #9ca3af;
}

body.pl-landing-time .pl-forms-anim__thread-body {
    min-width: 0;
    flex: 1;
    padding-right: 12px;
}

body.pl-landing-time .pl-forms-anim__thread-top {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 2px;
}

body.pl-landing-time .pl-forms-anim__thread-top strong {
    font-size: 11px;
    font-weight: 650;
    color: #111;
    letter-spacing: -0.02em;
}

body.pl-landing-time .pl-forms-anim__thread--existing .pl-forms-anim__thread-top strong {
    font-weight: 560;
    color: #4b5563;
}

body.pl-landing-time .pl-forms-anim__thread-top em {
    font-style: normal;
    font-size: 9px;
    font-weight: 600;
    color: #9ca3af;
}

body.pl-landing-time .pl-forms-anim__thread-body p {
    margin: 0 !important;
    font-size: 10px;
    line-height: 1.35;
    color: #6b7280;
}

body.pl-landing-time .pl-forms-anim__push {
    position: absolute;
    left: 12px;
    bottom: 10px;
    z-index: 2;
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 0.01em;
    opacity: 0;
    transform: translateY(6px);
    animation: plFormsPush var(--forms-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-forms-anim__push-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.35);
    animation: plFormsPushDot 1.4s ease-out 1 forwards;
}

@keyframes plFormsTypeName {
    0%, 4% { max-width: 0; border-right-color: #111; }
    18% { max-width: 7.2em; border-right-color: #111; }
    22%, 100% { max-width: 7.2em; border-right-color: transparent; }
}

@keyframes plFormsTypeEmail {
    0%, 18% { max-width: 0; border-right-color: transparent; }
    19% { border-right-color: #111; }
    32% { max-width: 8.5em; border-right-color: #111; }
    36%, 100% { max-width: 8.5em; border-right-color: transparent; }
}

@keyframes plFormsTypeMsg {
    0%, 32% { max-width: 0; border-right-color: transparent; }
    33% { border-right-color: #111; }
    46% { max-width: 11em; border-right-color: #111; }
    50%, 100% { max-width: 11em; border-right-color: transparent; }
}

@keyframes plFormsSubmit {
    0%, 48% { transform: scale(1); background: #111; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
    52% { transform: scale(0.94); background: #000; box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.12); }
    58%, 100% { transform: scale(1); background: #111; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
}

@keyframes plFormsPathDash {
    0% { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: -24; }
}

@keyframes plFormsThreadNew {
    0%, 70% {
        max-height: 0;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-bottom-color: transparent;
        transform: translateY(-6px);
    }
    76%, 100% {
        max-height: 64px;
        opacity: 1;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom-color: rgba(0, 0, 0, 0.05);
        transform: translateY(0);
    }
}

@keyframes plFormsThreadExisting {
    0%, 70% { transform: translateY(0); }
    76%, 100% { transform: translateY(0); }
}

@keyframes plFormsUnreadDot {
    0%, 72% { opacity: 0; scale: 0.5; }
    78%, 100% { opacity: 1; scale: 1; }
}

@keyframes plFormsBadge {
    0%, 72% { opacity: 0; scale: 0.5; }
    78% { opacity: 1; scale: 1.15; }
    84%, 100% { opacity: 1; scale: 1; }
}

@keyframes plFormsPush {
    0%, 78% { opacity: 0; transform: translateY(6px); }
    84%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsPushDot {
    0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.35); }
    70% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

@keyframes plFormsBrowserPulse {
    0%, 50% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.06); }
    54% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.14); }
    62%, 100% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.06); }
}

@keyframes plFormsInboxArrive {
    0%, 68% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.06); }
    74% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 14px 32px rgba(0, 0, 0, 0.14); }
    86%, 100% { box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 12px 28px rgba(0, 0, 0, 0.06); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-forms-anim__type,
    body.pl-landing-time .pl-forms-anim__submit,
    body.pl-landing-time .pl-forms-anim__path-line,
    body.pl-landing-time .pl-forms-anim__thread,
    body.pl-landing-time .pl-forms-anim__thread--new,
    body.pl-landing-time .pl-forms-anim__badge,
    body.pl-landing-time .pl-forms-anim__unread-dot,
    body.pl-landing-time .pl-forms-anim__push,
    body.pl-landing-time .pl-forms-anim__push-dot,
    body.pl-landing-time .pl-forms-anim__browser,
    body.pl-landing-time .pl-forms-anim__inbox,
    body.pl-landing-time .pl-forms-anim__flight {
        animation: none !important;
    }

    body.pl-landing-time .pl-forms-anim__type {
        max-width: 12em;
        border-right-color: transparent;
    }

    body.pl-landing-time .pl-forms-anim__runner {
        opacity: 0;
    }

    body.pl-landing-time .pl-forms-anim__thread,
    body.pl-landing-time .pl-forms-anim__thread--new,
    body.pl-landing-time .pl-forms-anim__badge,
    body.pl-landing-time .pl-forms-anim__unread-dot,
    body.pl-landing-time .pl-forms-anim__push {
        opacity: 1;
        transform: none;
        scale: 1;
        max-height: none;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    @media (max-width: 720px) {
        body.pl-landing-time .pl-forms-anim__browser,
        body.pl-landing-time .pl-forms-anim__flight {
            opacity: 0;
        }

        body.pl-landing-time .pl-forms-anim__inbox {
            opacity: 1;
            transform: none;
        }
    }
}

@media (max-width: 720px) {
    /* Mobile forms: two scenes (form → inbox) */
    body.pl-landing-time .pl-forms-anim {
        --forms-cycle: 7.2s;
        display: block;
        position: relative;
        grid-template-columns: none;
        gap: 0;
        width: 100%;
        height: 100%;
        min-height: 0;
    }

    body.pl-landing-time .pl-forms-anim__browser,
    body.pl-landing-time .pl-forms-anim__inbox {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        margin: 0;
        align-self: stretch;
        min-height: 0;
        opacity: 0;
        pointer-events: none;
        box-shadow: none;
    }

    body.pl-landing-time .pl-forms-anim__browser {
        animation: plFormsSceneForm var(--forms-cycle) ease both;
        z-index: 1;
    }

    body.pl-landing-time .pl-forms-anim__flight {
        display: none;
    }

    body.pl-landing-time .pl-forms-anim__inbox {
        animation: plFormsSceneInbox var(--forms-cycle) ease both;
        z-index: 1;
    }

    body.pl-landing-time .pl-forms-anim__type--name {
        animation-name: plFormsTypeNameMobile;
    }

    body.pl-landing-time .pl-forms-anim__type--email {
        animation-name: plFormsTypeEmailMobile;
    }

    body.pl-landing-time .pl-forms-anim__type--msg {
        animation-name: plFormsTypeMsgMobile;
    }

    body.pl-landing-time .pl-forms-anim__submit {
        animation-name: plFormsSubmitMobile;
    }

    body.pl-landing-time .pl-forms-anim__thread--new {
        animation-name: plFormsThreadNewMobile;
    }

    body.pl-landing-time .pl-forms-anim__unread-dot {
        animation-name: plFormsUnreadDotMobile;
    }

    body.pl-landing-time .pl-forms-anim__badge {
        animation-name: plFormsBadgeMobile;
    }

    body.pl-landing-time .pl-forms-anim__push {
        animation-name: plFormsPushMobile;
    }
}

@keyframes plFormsSceneForm {
    0%, 2% { opacity: 0; transform: translateY(8px); }
    6%, 48% { opacity: 1; transform: translateY(0); }
    56%, 100% { opacity: 0; transform: translateY(-6px); }
}

@keyframes plFormsSceneInbox {
    0%, 52% { opacity: 0; transform: translateY(8px); }
    58%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plFormsTypeNameMobile {
    0%, 6% { max-width: 0; border-right-color: #111; }
    16% { max-width: 7.2em; border-right-color: #111; }
    20%, 100% { max-width: 7.2em; border-right-color: transparent; }
}

@keyframes plFormsTypeEmailMobile {
    0%, 18% { max-width: 0; border-right-color: transparent; }
    19% { border-right-color: #111; }
    30% { max-width: 8.5em; border-right-color: #111; }
    34%, 100% { max-width: 8.5em; border-right-color: transparent; }
}

@keyframes plFormsTypeMsgMobile {
    0%, 32% { max-width: 0; border-right-color: transparent; }
    33% { border-right-color: #111; }
    42% { max-width: 11em; border-right-color: #111; }
    46%, 100% { max-width: 11em; border-right-color: transparent; }
}

@keyframes plFormsSubmitMobile {
    0%, 44% { transform: scale(1); background: #111; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
    47% { transform: scale(0.94); background: #000; box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.12); }
    51%, 100% { transform: scale(1); background: #111; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
}

@keyframes plFormsThreadNewMobile {
    0%, 60% {
        max-height: 0;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 0;
        border-bottom-color: transparent;
        transform: translateY(-6px);
    }
    68%, 100% {
        max-height: 64px;
        opacity: 1;
        padding-top: 10px;
        padding-bottom: 10px;
        border-bottom-color: rgba(0, 0, 0, 0.05);
        transform: translateY(0);
    }
}

@keyframes plFormsUnreadDotMobile {
    0%, 62% { opacity: 0; scale: 0.5; }
    70%, 100% { opacity: 1; scale: 1; }
}

@keyframes plFormsBadgeMobile {
    0%, 62% { opacity: 0; scale: 0.5; }
    70% { opacity: 1; scale: 1.12; }
    76%, 100% { opacity: 1; scale: 1; }
}

@keyframes plFormsPushMobile {
    0%, 72% { opacity: 0; transform: translateY(6px); }
    78%, 100% { opacity: 1; transform: translateY(0); }
}



/* ---- css/pl-time-anims/webstudio.css ---- */
/**
 * Web Studio drop & publish bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-webstudio-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-anim {
    --webstudio-cycle: 8s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-anim__shell {
    position: relative;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    height: 100%;
    padding: 10px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: plWebstudioShellIn var(--webstudio-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-anim__editor,
body.pl-landing-time .pl-webstudio-anim__browser {
    display: flex;
    flex-direction: column;
    min-height: 0;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    overflow: hidden;
    background: #fff;
}

body.pl-landing-time .pl-webstudio-anim__editor {
    background: #0f172a;
    border-color: rgba(15, 23, 42, 0.9);
}

body.pl-landing-time .pl-webstudio-anim__ed-bar,
body.pl-landing-time .pl-webstudio-anim__chrome {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 9px;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-anim__ed-bar {
    background: rgba(255, 255, 255, 0.06);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body.pl-landing-time .pl-webstudio-anim__ed-bar span {
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: rgba(255, 255, 255, 0.72);
}

body.pl-landing-time .pl-webstudio-anim__ed-bar em {
    margin-left: auto;
    font-style: normal;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 3px 7px;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.85);
    animation: plWebstudioPublishBtn var(--webstudio-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__code {
    flex: 1;
    min-height: 0;
    padding: 10px 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 9px;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.55);
}

body.pl-landing-time .pl-webstudio-anim__line {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    max-width: 0;
    opacity: 0;
}

body.pl-landing-time .pl-webstudio-anim__line--1 {
    color: #93c5fd;
    animation: plWebstudioLine1 var(--webstudio-cycle) steps(18, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__line--2 {
    color: #a7f3d0;
    padding-left: 10px;
    animation: plWebstudioLine2 var(--webstudio-cycle) steps(16, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__line--3 {
    color: #fde68a;
    padding-left: 10px;
    animation: plWebstudioLine3 var(--webstudio-cycle) steps(14, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__line--4 {
    color: #93c5fd;
    animation: plWebstudioLine4 var(--webstudio-cycle) steps(10, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__chrome {
    background: #fafafa;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-webstudio-anim__chrome > i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d1d5db;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-anim__chrome > i:nth-child(1) { background: #111; }
body.pl-landing-time .pl-webstudio-anim__chrome > i:nth-child(2) { background: #9ca3af; }

body.pl-landing-time .pl-webstudio-anim__url {
    display: flex;
    align-items: center;
    gap: 5px;
    flex: 1;
    min-width: 0;
    margin-left: 2px;
    padding: 3px 8px;
    border-radius: 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    font-size: 9px;
    font-weight: 600;
    color: #6b7280;
    letter-spacing: -0.01em;
}

body.pl-landing-time .pl-webstudio-anim__lock {
    width: 8px;
    height: 8px;
    border-radius: 2px;
    border: 1.5px solid #22c55e;
    position: relative;
    flex: 0 0 auto;
    opacity: 0;
    animation: plWebstudioLockIn var(--webstudio-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__lock::before {
    content: "";
    position: absolute;
    left: 1px;
    top: -4px;
    width: 4px;
    height: 3px;
    border: 1.5px solid #22c55e;
    border-bottom: none;
    border-radius: 3px 3px 0 0;
}

body.pl-landing-time .pl-webstudio-anim__page {
    flex: 1;
    min-height: 0;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    background: #fff;
    opacity: 0;
    transform: translateY(6px);
    animation: plWebstudioPageIn var(--webstudio-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__nav {
    display: flex;
    align-items: center;
    gap: 6px;
}

body.pl-landing-time .pl-webstudio-anim__nav strong {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-webstudio-anim__nav span {
    width: 18px;
    height: 4px;
    border-radius: 0;
    background: #e5e7eb;
}

body.pl-landing-time .pl-webstudio-anim__nav span:first-of-type {
    margin-left: auto;
}

body.pl-landing-time .pl-webstudio-anim__hero {
    height: 48px;
    border-radius: 0;
    background: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 55%, #fce7f3 100%);
    animation: plWebstudioHeroPulse var(--webstudio-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-anim__lines {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

body.pl-landing-time .pl-webstudio-anim__lines i {
    display: block;
    height: 5px;
    border-radius: 0;
    background: #e5e7eb;
}

body.pl-landing-time .pl-webstudio-anim__cta {
    align-self: flex-start;
    margin-top: auto;
    padding: 5px 10px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 0.01em;
}

body.pl-landing-time .pl-webstudio-anim__live {
    position: absolute;
    right: 18px;
    bottom: 18px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 9px;
    border-radius: 0;
    background: #111;
    color: #fff;
    font-size: 9px;
    font-weight: 650;
    letter-spacing: 0.01em;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
    opacity: 0;
    transform: translateY(8px) scale(0.96);
    animation: plWebstudioLiveIn var(--webstudio-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    z-index: 2;
}

body.pl-landing-time .pl-webstudio-anim__live i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45);
    animation: plWebstudioLiveDot var(--webstudio-cycle) ease-out 1 forwards;
}

@keyframes plWebstudioShellIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    12%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plWebstudioLine1 {
    0%, 12% { max-width: 0; opacity: 0; }
    14% { opacity: 1; }
    28%, 100% { max-width: 100%; opacity: 1; }
}

@keyframes plWebstudioLine2 {
    0%, 22% { max-width: 0; opacity: 0; }
    24% { opacity: 1; }
    36%, 100% { max-width: 100%; opacity: 1; }
}

@keyframes plWebstudioLine3 {
    0%, 30% { max-width: 0; opacity: 0; }
    32% { opacity: 1; }
    42%, 100% { max-width: 100%; opacity: 1; }
}

@keyframes plWebstudioLine4 {
    0%, 38% { max-width: 0; opacity: 0; }
    40% { opacity: 1; }
    48%, 100% { max-width: 100%; opacity: 1; }
}

@keyframes plWebstudioPublishBtn {
    0%, 48% {
        background: rgba(255, 255, 255, 0.1);
        color: rgba(255, 255, 255, 0.85);
        transform: scale(1);
        box-shadow: none;
    }
    52% {
        background: #22c55e;
        color: #052e16;
        transform: scale(0.96);
        box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.25);
    }
    58%, 100% {
        background: #22c55e;
        color: #052e16;
        transform: scale(1);
        box-shadow: none;
    }
}

@keyframes plWebstudioPageIn {
    0%, 54% { opacity: 0; transform: translateY(6px); }
    64%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plWebstudioLockIn {
    0%, 58% { opacity: 0; }
    68%, 100% { opacity: 1; }
}

@keyframes plWebstudioHeroPulse {
    0%, 62% { filter: saturate(0.7) brightness(0.98); }
    72%, 100% { filter: saturate(1) brightness(1); }
}

@keyframes plWebstudioLiveIn {
    0%, 70% { opacity: 0; transform: translateY(8px) scale(0.96); }
    80%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes plWebstudioLiveDot {
    0%, 72% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.45); }
    85% { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

@media (max-width: 640px) {
    body.pl-landing-time .pl-webstudio-anim__shell {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 1fr;
    }

    body.pl-landing-time .pl-webstudio-anim__live {
        right: 14px;
        bottom: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-webstudio-anim__shell,
    body.pl-landing-time .pl-webstudio-anim__line,
    body.pl-landing-time .pl-webstudio-anim__ed-bar em,
    body.pl-landing-time .pl-webstudio-anim__page,
    body.pl-landing-time .pl-webstudio-anim__lock,
    body.pl-landing-time .pl-webstudio-anim__hero,
    body.pl-landing-time .pl-webstudio-anim__live,
    body.pl-landing-time .pl-webstudio-anim__live i {
        animation: none !important;
    }

    body.pl-landing-time .pl-webstudio-anim__shell,
    body.pl-landing-time .pl-webstudio-anim__page,
    body.pl-landing-time .pl-webstudio-anim__lock,
    body.pl-landing-time .pl-webstudio-anim__live {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-webstudio-anim__line {
        max-width: 100%;
        opacity: 1;
    }

    body.pl-landing-time .pl-webstudio-anim__ed-bar em {
        background: #22c55e;
        color: #052e16;
    }
}


/* ---- css/pl-time-anims/webstudio-leads.css ---- */
/**
 * Web Studio leads: homepage forms input → iOS push (reuses pl-forms-anim + pl-ios-anim).
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-webstudio-leads-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-leads-anim {
    --webstudio-leads-cycle: 12s;
    --webstudio-leads-ios-delay: 4.6s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-leads-anim__form-scene,
body.pl-landing-time .pl-webstudio-leads-anim__ios-scene {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-leads-anim__form-scene {
    z-index: 2;
    display: flex;
    align-items: stretch;
    padding: 4px 2px 0;
    animation: plWsLeadsSceneForm var(--webstudio-leads-cycle) ease both;
}

body.pl-landing-time .pl-webstudio-leads-anim__ios-scene {
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding: 4px 8px 0;
    animation: plWsLeadsSceneIos var(--webstudio-leads-cycle) ease both;
}

/* Scene 1: exact homepage form (single browser panel) */
body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim {
    --forms-cycle: 7.2s;
    display: block;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__browser {
    width: 100%;
    height: 100%;
    min-height: 0;
}

@media (max-width: 720px) {
    /*
     * Forms mobile styles hide .pl-forms-anim__browser (opacity 0 + scene swap).
     * This bento only has the browser panel → iOS push, so undo that hide or it
     * sits blank until the iOS scene (~4.8s).
     */
    body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__browser {
        position: relative;
        inset: auto;
        opacity: 1;
        transform: none;
        pointer-events: none;
        box-shadow:
            0 1px 2px rgba(0, 0, 0, 0.04),
            0 12px 28px rgba(0, 0, 0, 0.06);
        animation: plFormsBrowserPulse var(--forms-cycle) ease-in-out 1 forwards;
    }

    body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__type--name {
        animation-name: plFormsTypeName;
    }

    body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__type--email {
        animation-name: plFormsTypeEmail;
    }

    body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__type--msg {
        animation-name: plFormsTypeMsg;
    }

    body.pl-landing-time .pl-webstudio-leads-anim .pl-forms-anim__submit {
        animation-name: plFormsSubmit;
    }
}

/* Scene 2: index iOS push, offset until form finishes */
body.pl-landing-time .pl-time-webstudio-leads-stage .pl-ios-anim,
body.pl-landing-time .pl-time-webstudio-leads-stage .pl-ios-anim * {
    animation-delay: var(--webstudio-leads-ios-delay);
}

@keyframes plWsLeadsSceneForm {
    0%, 2% { opacity: 0; transform: translateY(8px); }
    6%, 36% { opacity: 1; transform: translateY(0); }
    40%, 100% { opacity: 0; transform: translateY(-6px); visibility: hidden; }
}

@keyframes plWsLeadsSceneIos {
    0%, 38% { opacity: 0; transform: translateY(8px); visibility: hidden; }
    42%, 100% { opacity: 1; transform: translateY(0); visibility: visible; }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-webstudio-leads-anim__form-scene,
    body.pl-landing-time .pl-webstudio-leads-anim__ios-scene {
        animation: none !important;
    }

    body.pl-landing-time .pl-webstudio-leads-anim__form-scene {
        opacity: 0;
        visibility: hidden;
    }

    body.pl-landing-time .pl-webstudio-leads-anim__ios-scene {
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    body.pl-landing-time .pl-time-webstudio-leads-stage .pl-ios-anim,
    body.pl-landing-time .pl-time-webstudio-leads-stage .pl-ios-anim * {
        animation-delay: 0s !important;
    }
}


/* ---- css/pl-time-anims/webstudio-domain.css ---- */
/**
 * Web Studio domain + SSL — lock secures, then secure URL reveal.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-webstudio-domain-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-domain-anim {
    --webstudio-domain-cycle: 8s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-domain-anim__lock-scene,
body.pl-landing-time .pl-webstudio-domain-anim__secure-scene {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-domain-anim__lock-scene {
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    animation: plWsDomainSceneLock var(--webstudio-domain-cycle) ease both;
}

body.pl-landing-time .pl-webstudio-domain-anim__secure-scene {
    z-index: 1;
    display: flex;
    align-items: stretch;
    justify-content: center;
    padding: 8px 6px 0;
    animation: plWsDomainSceneSecure var(--webstudio-domain-cycle) ease both;
}

body.pl-landing-time .pl-webstudio-domain-anim__vault {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-domain-anim__ring {
    position: absolute;
    width: 88px;
    height: 88px;
    border-radius: 50%;
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    opacity: 0;
    animation: plWsDomainRing var(--webstudio-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__ring--2 {
    animation-name: plWsDomainRing2;
}

body.pl-landing-time .pl-webstudio-domain-anim__lock {
    position: relative;
    z-index: 1;
    width: 44px;
    height: 52px;
    animation: plWsDomainLockPop var(--webstudio-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__shackle {
    position: absolute;
    left: 50%;
    top: 0;
    width: 28px;
    height: 22px;
    margin-left: -14px;
    border: 4px solid #9ca3af;
    border-bottom: none;
    border-radius: 14px 14px 0 0;
    transform-origin: center bottom;
    animation:
        plWsDomainShackleClose var(--webstudio-domain-cycle) cubic-bezier(0.34, 1.56, 0.64, 1) 1 forwards,
        plWsDomainShackleColor var(--webstudio-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__body {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 44px;
    height: 34px;
    margin-left: -22px;
    border-radius: 0;
    background: #9ca3af;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    animation: plWsDomainLockSecure var(--webstudio-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__body::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 11px;
    width: 8px;
    height: 8px;
    margin-left: -4px;
    border-radius: 50%;
    background: #fff;
    box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.12);
}

body.pl-landing-time .pl-webstudio-domain-anim__secure-label {
    position: relative;
    z-index: 1;
    margin: 0 !important;
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7280;
    opacity: 0;
    animation: plWsDomainSecureLabel var(--webstudio-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__burst {
    position: absolute;
    left: 50%;
    top: 42%;
    width: 120px;
    height: 120px;
    margin: -60px 0 0 -60px;
    border-radius: 50%;
    border: 2px solid rgba(0, 0, 0, 0.08);
    background: transparent;
    opacity: 0;
    transform: scale(0.2);
    animation: plWsDomainBurst var(--webstudio-domain-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-webstudio-domain-anim__browser {
    position: relative;
    z-index: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 16px 36px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    transform: scale(0.88) translateY(12px);
    opacity: 0;
    animation: plWsDomainBrowserSlam var(--webstudio-domain-cycle) cubic-bezier(0.34, 1.45, 0.64, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__chrome {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 10px;
    background: #f3f4f6;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

body.pl-landing-time .pl-webstudio-domain-anim__chrome > i {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d1d5db;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-domain-anim__chrome > i:nth-child(1) { background: #111; }
body.pl-landing-time .pl-webstudio-domain-anim__chrome > i:nth-child(2) { background: #9ca3af; }

body.pl-landing-time .pl-webstudio-domain-anim__url-bar {
    margin: 10px 12px 0;
    padding: 9px 12px;
    border-radius: 0;
    border: 1.5px solid rgba(0, 0, 0, 0.1);
    background: #fafafa;
    display: flex;
    align-items: center;
    gap: 8px;
    transform: scale(0.92);
    opacity: 0;
    animation: plWsDomainUrlBam var(--webstudio-domain-cycle) cubic-bezier(0.34, 1.56, 0.64, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__url-lock {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    border: 2px solid #22c55e;
    position: relative;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-domain-anim__url-lock::before {
    content: "";
    position: absolute;
    left: 1px;
    top: -6px;
    width: 6px;
    height: 5px;
    border: 2px solid #22c55e;
    border-bottom: none;
    border-radius: 5px 5px 0 0;
}

body.pl-landing-time .pl-webstudio-domain-anim__url-text {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #111;
    white-space: nowrap;
}

body.pl-landing-time .pl-webstudio-domain-anim__url-text em {
    font-style: normal;
    color: #111;
    font-weight: 650;
}

body.pl-landing-time .pl-webstudio-domain-anim__page {
    margin: 10px 12px 12px;
    padding: 12px;
    border-radius: 0;
    background: #fafafa;
    border: 1px solid rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: plWsDomainPageIn var(--webstudio-domain-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-domain-anim__page-hero {
    height: 42px;
    border-radius: 0;
    background: #e5e7eb;
    margin-bottom: 8px;
}

body.pl-landing-time .pl-webstudio-domain-anim__page-line {
    display: block;
    height: 5px;
    border-radius: 0;
    background: #e5e7eb;
    margin-bottom: 5px;
}

@keyframes plWsDomainSceneLock {
    0%, 2% { opacity: 0; transform: translateY(8px); }
    6%, 38% { opacity: 1; transform: translateY(0); }
    44%, 100% { opacity: 0; transform: scale(0.96); visibility: hidden; }
}

@keyframes plWsDomainSceneSecure {
    0%, 40% { opacity: 0; visibility: hidden; }
    44%, 100% { opacity: 1; visibility: visible; }
}

@keyframes plWsDomainRing {
    0%, 14% { opacity: 0; transform: scale(0.6); }
    24% { opacity: 0.9; transform: scale(1); }
    36%, 100% { opacity: 0; transform: scale(1.45); }
}

@keyframes plWsDomainRing2 {
    0%, 20% { opacity: 0; transform: scale(0.55); }
    30% { opacity: 0.55; transform: scale(1.05); }
    42%, 100% { opacity: 0; transform: scale(1.6); }
}

@keyframes plWsDomainLockPop {
    0%, 4% { opacity: 0; transform: scale(0.7); }
    10%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plWsDomainShackleClose {
    0%, 8% { transform: translateY(-8px); }
    22%, 100% { transform: translateY(0); }
}

@keyframes plWsDomainShackleColor {
    0%, 26% { border-color: #9ca3af; }
    32%, 100% { border-color: #111; }
}

@keyframes plWsDomainLockSecure {
    0%, 22% {
        background: #9ca3af;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    }
    28% {
        background: #111;
        box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.06), 0 10px 24px rgba(0, 0, 0, 0.18);
    }
    36%, 100% {
        background: #111;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.16);
    }
}

@keyframes plWsDomainSecureLabel {
    0%, 10% { opacity: 0; transform: translateY(4px); }
    16%, 34% { opacity: 1; transform: translateY(0); }
    40%, 100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes plWsDomainBurst {
    0%, 42% { opacity: 0; transform: scale(0.2); }
    48% { opacity: 1; transform: scale(1); }
    58%, 100% { opacity: 0; transform: scale(1.35); }
}

@keyframes plWsDomainBrowserSlam {
    0%, 42% { opacity: 0; transform: scale(0.88) translateY(12px); }
    48% { opacity: 1; transform: scale(1.04) translateY(-2px); }
    54%, 100% { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes plWsDomainUrlBam {
    0%, 48% { opacity: 0; transform: scale(0.82); }
    54% { opacity: 1; transform: scale(1.08); }
    60%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plWsDomainPageIn {
    0%, 56% { opacity: 0; transform: translateY(8px); }
    64%, 100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-webstudio-domain-anim__lock-scene,
    body.pl-landing-time .pl-webstudio-domain-anim__secure-scene,
    body.pl-landing-time .pl-webstudio-domain-anim__ring,
    body.pl-landing-time .pl-webstudio-domain-anim__lock,
    body.pl-landing-time .pl-webstudio-domain-anim__shackle,
    body.pl-landing-time .pl-webstudio-domain-anim__body,
    body.pl-landing-time .pl-webstudio-domain-anim__secure-label,
    body.pl-landing-time .pl-webstudio-domain-anim__burst,
    body.pl-landing-time .pl-webstudio-domain-anim__browser,
    body.pl-landing-time .pl-webstudio-domain-anim__url-bar,
    body.pl-landing-time .pl-webstudio-domain-anim__page {
        animation: none !important;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__lock-scene {
        opacity: 0;
        visibility: hidden;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__secure-scene {
        opacity: 1;
        visibility: visible;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__browser,
    body.pl-landing-time .pl-webstudio-domain-anim__url-bar,
    body.pl-landing-time .pl-webstudio-domain-anim__page {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__body {
        background: #111;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__shackle {
        border-color: #111;
    }

    body.pl-landing-time .pl-webstudio-domain-anim__burst {
        opacity: 0;
    }
}


/* ---- css/pl-time-anims/webstudio-speed.css ---- */
/**
 * Web Studio speed race — WordPress vs Pathline first paint.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-webstudio-speed-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-speed-anim {
    --webstudio-speed-cycle: 9s;
    width: 100%;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(8px);
    animation: plWsSpeedShellIn var(--webstudio-speed-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-speed-anim__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-speed-anim__head span {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-webstudio-speed-anim__result {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: #111;
    padding: 4px 8px;
    border-radius: 0;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    opacity: 0;
    transform: scale(0.9);
    animation: plWsSpeedResult var(--webstudio-speed-cycle) cubic-bezier(0.34, 1.45, 0.64, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__result em {
    font-style: normal;
    color: #047857;
}

body.pl-landing-time .pl-webstudio-speed-anim__lanes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    flex: 1;
    min-height: 0;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 0;
    padding: 8px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fafafa;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl {
    border-color: rgba(0, 0, 0, 0.1);
    background: #fff;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 6px;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane-top strong {
    font-size: 9px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: #6b7280;
    line-height: 1.3;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__lane-top strong {
    color: #111;
}

body.pl-landing-time .pl-webstudio-speed-anim__timer {
    position: relative;
    min-width: 38px;
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.03em;
    text-align: right;
    color: #9ca3af;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__timer {
    color: #111;
}

body.pl-landing-time .pl-webstudio-speed-anim__timer-wait,
body.pl-landing-time .pl-webstudio-speed-anim__timer-done {
    display: block;
}

body.pl-landing-time .pl-webstudio-speed-anim__timer-wait {
    animation: plWsSpeedWpTimerWait var(--webstudio-speed-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__timer-done {
    position: absolute;
    right: 0;
    top: 0;
    opacity: 0;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__timer-done {
    animation: plWsSpeedWpTimerDone var(--webstudio-speed-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__timer-wait {
    animation: plWsSpeedPlTimerWait var(--webstudio-speed-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__timer-done {
    animation: plWsSpeedPlTimerDone var(--webstudio-speed-cycle) steps(1, end) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__preview {
    position: relative;
    flex: 1;
    min-height: 52px;
    border-radius: 0;
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: #fff;
    overflow: hidden;
}

body.pl-landing-time .pl-webstudio-speed-anim__skeleton {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #f3f4f6 0%, #e5e7eb 45%, #f3f4f6 90%);
    background-size: 200% 100%;
    animation: plWsSpeedWpSkeleton var(--webstudio-speed-cycle) linear 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__skeleton {
    animation: plWsSpeedPlSkeleton var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__content {
    position: relative;
    z-index: 1;
    padding: 8px;
    opacity: 0;
    transform: translateY(4px);
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__content {
    animation: plWsSpeedWpContent var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__content {
    animation: plWsSpeedPlContent var(--webstudio-speed-cycle) cubic-bezier(0.34, 1.45, 0.64, 1) 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__hero {
    height: 18px;
    border-radius: 0;
    margin-bottom: 5px;
    background: #e5e7eb;
}

body.pl-landing-time .pl-webstudio-speed-anim__line {
    display: block;
    height: 4px;
    border-radius: 0;
    background: #e5e7eb;
    margin-bottom: 4px;
}

body.pl-landing-time .pl-webstudio-speed-anim__progress {
    height: 4px;
    border-radius: 0;
    background: rgba(0, 0, 0, 0.06);
    overflow: hidden;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-speed-anim__fill {
    display: block;
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: #9ca3af;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__fill {
    animation: plWsSpeedWpFill var(--webstudio-speed-cycle) linear 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__fill {
    background: #111;
    animation: plWsSpeedPlFill var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 0 0 auto;
}

body.pl-landing-time .pl-webstudio-speed-anim__steps li {
    font-size: 8px;
    font-weight: 500;
    color: #9ca3af;
    letter-spacing: -0.01em;
    opacity: 0.45;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__steps li {
    color: #374151;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__step--1 {
    animation: plWsSpeedStep1 var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__step--2 {
    animation: plWsSpeedStep2 var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--wp .pl-webstudio-speed-anim__step--3 {
    animation: plWsSpeedStep3 var(--webstudio-speed-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-webstudio-speed-anim__lane--pl .pl-webstudio-speed-anim__step--1 {
    animation: plWsSpeedPlStep var(--webstudio-speed-cycle) ease-out 1 forwards;
}

@keyframes plWsSpeedShellIn {
    0%, 3% { opacity: 0; transform: translateY(8px); }
    8%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plWsSpeedResult {
    0%, 78% { opacity: 0; transform: scale(0.9); }
    84% { opacity: 1; transform: scale(1.06); }
    90%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes plWsSpeedWpTimerWait {
    0%, 72% { opacity: 1; }
    74%, 100% { opacity: 0; }
}

@keyframes plWsSpeedWpTimerDone {
    0%, 72% { opacity: 0; }
    74%, 100% { opacity: 1; }
}

@keyframes plWsSpeedPlTimerWait {
    0%, 8% { opacity: 1; }
    10%, 100% { opacity: 0; }
}

@keyframes plWsSpeedPlTimerDone {
    0%, 8% { opacity: 0; }
    10%, 100% { opacity: 1; }
}

@keyframes plWsSpeedWpSkeleton {
    0%, 8% { background-position: 100% 0; opacity: 1; }
    74% { background-position: 0% 0; opacity: 1; }
    78%, 100% { opacity: 0; }
}

@keyframes plWsSpeedPlSkeleton {
    0%, 6% { opacity: 1; }
    12%, 100% { opacity: 0; }
}

@keyframes plWsSpeedWpContent {
    0%, 72% { opacity: 0; transform: translateY(4px); }
    78%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plWsSpeedPlContent {
    0%, 8% { opacity: 0; transform: scale(0.94) translateY(4px); }
    14% { opacity: 1; transform: scale(1.02) translateY(0); }
    18%, 100% { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes plWsSpeedWpFill {
    0%, 8% { width: 0; }
    74%, 100% { width: 100%; }
}

@keyframes plWsSpeedPlFill {
    0%, 8% { width: 0; }
    12%, 100% { width: 100%; }
}

@keyframes plWsSpeedStep1 {
    0%, 12% { opacity: 0.45; color: #9ca3af; font-weight: 500; }
    14%, 28% { opacity: 1; color: #374151; font-weight: 650; }
    30%, 100% { opacity: 0.55; color: #9ca3af; font-weight: 500; }
}

@keyframes plWsSpeedStep2 {
    0%, 28% { opacity: 0.45; color: #9ca3af; font-weight: 500; }
    30%, 48% { opacity: 1; color: #374151; font-weight: 650; }
    50%, 100% { opacity: 0.55; color: #9ca3af; font-weight: 500; }
}

@keyframes plWsSpeedStep3 {
    0%, 48% { opacity: 0.45; color: #9ca3af; font-weight: 500; }
    50%, 72% { opacity: 1; color: #374151; font-weight: 650; }
    74%, 100% { opacity: 0.55; color: #9ca3af; font-weight: 500; }
}

@keyframes plWsSpeedPlStep {
    0%, 8% { opacity: 0.45; font-weight: 500; }
    12%, 100% { opacity: 1; font-weight: 650; }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-time-webstudio-speed-stage {
        height: 420px;
        min-height: 420px;
        max-height: 420px;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__lanes {
        grid-template-columns: 1fr;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__preview {
        min-height: 56px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-webstudio-speed-anim,
    body.pl-landing-time .pl-webstudio-speed-anim__result,
    body.pl-landing-time .pl-webstudio-speed-anim__timer-wait,
    body.pl-landing-time .pl-webstudio-speed-anim__timer-done,
    body.pl-landing-time .pl-webstudio-speed-anim__skeleton,
    body.pl-landing-time .pl-webstudio-speed-anim__content,
    body.pl-landing-time .pl-webstudio-speed-anim__fill,
    body.pl-landing-time .pl-webstudio-speed-anim__steps li {
        animation: none !important;
    }

    body.pl-landing-time .pl-webstudio-speed-anim {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__timer-wait {
        display: none;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__timer-done {
        opacity: 1;
        position: static;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__skeleton {
        opacity: 0;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__content {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__fill {
        width: 100%;
    }

    body.pl-landing-time .pl-webstudio-speed-anim__result {
        opacity: 1;
        transform: none;
    }
}


/* ---- css/pl-landing-domains.css ---- */
/* Domains marketing page — extends pl-landing-time */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ── Hero: registration-first ── */
body.pl-landing-time.pl-landing-domains .pl-time-hero-copy--domains {
    max-width: 760px;
}

body.pl-landing-time.pl-landing-domains .pl-time-hero-copy--domains .pl-time-hero-title {
    max-width: 14ch;
}

body.pl-landing-time.pl-landing-domains .pl-time-hero-copy--domains .pl-time-hero-lead {
    max-width: 46ch;
    margin-bottom: clamp(20px, 3vh, 28px);
}

body.pl-landing-time.pl-landing-domains .pl-domains-mode {
    display: inline-flex;
    gap: 0;
    margin: 0 0 18px;
    border: 1px solid #0e0e0e;
    background: #fff;
}

body.pl-landing-time.pl-landing-domains .pl-domains-mode-btn {
    appearance: none;
    margin: 0;
    padding: 10px 18px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #6f6f6f;
    background: transparent;
    border: none;
    cursor: pointer;
}

body.pl-landing-time.pl-landing-domains .pl-domains-mode-btn.is-active {
    color: #fff;
    background: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer {
    width: 100%;
    max-width: 720px;
    min-width: 0;
    margin: 0 auto;
    box-sizing: border-box;
    text-align: left;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer .pl-domains-search-bar + .pl-domains-search-bar {
    margin-top: 10px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 16px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-footer[hidden] {
    display: none !important;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-price {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-submit {
    appearance: none;
    margin: 0;
    margin-left: auto;
    padding: 12px 18px;
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #fff;
    background: #0e0e0e;
    border: 1px solid #0e0e0e;
    cursor: pointer;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-submit:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer-submit[hidden] {
    display: none !important;
}

body.pl-landing-time.pl-landing-domains .pl-domains-transfer .pl-domains-hint {
    text-align: left;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search {
    width: 100%;
    max-width: 720px;
    min-width: 0;
    margin: 0 auto;
    box-sizing: border-box;
    text-align: left;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search.has-results .pl-domains-tlds-label,
body.pl-landing-time.pl-landing-domains .pl-domains-search.has-results .pl-domains-tlds {
    display: none;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search.has-results .pl-domains-hint {
    margin-top: 18px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-bar {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0 20px;
    background: #fff;
    border: 2px solid #0e0e0e;
    border-radius: 0;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-bar:focus-within {
    border-color: #0e0e0e;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1);
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-bar.is-error {
    border-color: #e8b4b0;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-bar.is-error:focus-within {
    border-color: #d46a62;
    box-shadow: none;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 14px;
    color: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-input {
    flex: 1;
    min-width: 0;
    padding: 20px 0;
    font: inherit;
    font-size: clamp(18px, 2.6vw, 22px);
    font-weight: 500;
    letter-spacing: -0.02em;
    color: #0e0e0e;
    background: transparent;
    border: none;
    outline: none;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search-input::placeholder {
    color: #949494;
    font-weight: 400;
}

body.pl-landing-time.pl-landing-domains .pl-domains-tlds-label {
    margin: 18px 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #949494;
    text-align: center;
}

body.pl-landing-time.pl-landing-domains .pl-domains-tlds {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

body.pl-landing-time.pl-landing-domains .pl-domains-tlds li {
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #6f6f6f;
    background: #fff;
    border: 1px solid #e4e4e4;
    border-radius: 0;
}

body.pl-landing-time.pl-landing-domains .pl-domains-hint {
    margin: 14px 0 0;
    font-size: 12px;
    color: #949494;
    text-align: center;
}

body.pl-landing-time.pl-landing-domains .pl-domains-hint.is-error {
    color: #b42318;
}

body.pl-landing-time.pl-landing-domains .pl-domains-search.is-loading .pl-domains-search-input {
    opacity: 0.72;
}

body.pl-landing-time.pl-landing-domains .pl-domains-tlds [data-pl-tld] {
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}

body.pl-landing-time.pl-landing-domains .pl-domains-tlds [data-pl-tld]:hover {
    color: #0e0e0e;
    border-color: #0e0e0e;
    background: #fafafa;
}

body.pl-landing-time.pl-landing-domains .pl-domains-results {
    margin: 12px 0 0;
    text-align: left;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

body.pl-landing-time.pl-landing-domains .pl-domains-results-panel {
    overflow: hidden;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: min(400px, 52vh);
    background: #fff;
    border: 1px solid #ececec;
    border-radius: 0;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    box-sizing: border-box;
    padding: 6px 16px 14px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-results.is-entering .pl-domains-results-panel {
    animation: pl-domains-drop-in 0.26s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes pl-domains-drop-in {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 14px 0;
    background: transparent;
    border: none;
    transition: opacity 0.15s ease;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result.is-exact {
    padding: 14px 16px;
    margin-bottom: 6px;
    border: 1px solid #e4e4e4;
    border-radius: 0;
    background: #fff;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result.is-available:not(.is-exact):hover {
    opacity: 0.72;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result.is-taken {
    opacity: 0.55;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result.is-taken .pl-domains-result-name,
body.pl-landing-time.pl-landing-domains .pl-domains-result.is-taken .pl-domains-result-tld {
    color: #949494;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    min-width: 0;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-name {
    min-width: 0;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: -0.02em;
    line-height: 1.3;
    word-break: break-word;
    color: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-tld {
    font-weight: 400;
    color: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #166534;
    background: #ecfdf3;
    border-radius: 999px;
    white-space: nowrap;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-badge::before {
    content: '✓';
    font-size: 10px;
    font-weight: 700;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    flex-shrink: 0;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-pricing {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-pricing--sale {
    flex-direction: row;
    align-items: baseline;
    gap: 10px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-price-sale,
body.pl-landing-time.pl-landing-domains .pl-domains-result-price-compare {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-price-sale {
    color: #0e0e0e;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-price-compare {
    color: #949494;
    text-decoration: line-through;
    text-decoration-thickness: 1px;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-price {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #0e0e0e;
    white-space: nowrap;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-period {
    font-size: 13px;
    font-weight: 400;
    color: #6f6f6f;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-unavailable {
    font-size: 13px;
    font-weight: 400;
    color: #949494;
    white-space: nowrap;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    color: #0e0e0e;
    background: transparent;
    border: none;
    border-radius: 0;
    cursor: pointer;
    transition: background 0.15s ease, opacity 0.15s ease;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-cart:hover {
    background: #f4f4f4;
}

body.pl-landing-time.pl-landing-domains .pl-domains-result-cart:active {
    opacity: 0.7;
}

/* ── Simple perks bento ── */
body.pl-landing-time.pl-landing-domains .pl-time-bento-section--domains {
    padding-top: 0;
}

body.pl-landing-time.pl-landing-domains .pl-time-bento--domains {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.pl-landing-time.pl-landing-domains .pl-time-bento--domains .pl-time-card--plain {
    background: #fff;
    border: 1px solid #0e0e0e;
    box-shadow: none;
}

body.pl-landing-time.pl-landing-domains .pl-time-bento--domains .pl-time-card--plain .pl-time-card-kicker {
    color: #949494;
}

body.pl-landing-time.pl-landing-domains .pl-time-bento--domains .pl-time-card {
    min-height: 0;
}

body.pl-landing-time.pl-landing-domains .pl-time-bento--domains .pl-time-card h3 {
    font-size: clamp(18px, 2.2vw, 22px);
}

@media (max-width: 900px) {
    body.pl-landing-time.pl-landing-domains .pl-time-bento--domains {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px) {
    body.pl-landing-time.pl-landing-domains .pl-domains-result {
        gap: 12px;
        padding: 12px 0;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-result.is-exact {
        padding: 12px 14px;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-result-name {
        font-size: 15px;
        overflow-wrap: anywhere;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-result-end {
        gap: 12px;
    }
}

@media (max-width: 768px) {
    body.pl-landing-time.pl-landing-domains .pl-domains-search-bar {
        padding: 0 16px;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-search-input {
        padding: 17px 0;
        font-size: 17px;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-transfer-footer {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-transfer-price {
        text-align: center;
        width: 100%;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-transfer-submit {
        margin-left: 0;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-transfer .pl-domains-hint {
        text-align: center;
    }
}
@media (max-width: 480px) {
    body.pl-landing-time.pl-landing-domains .pl-domains-result {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-result-end {
        width: 100%;
        justify-content: space-between;
    }

    body.pl-landing-time.pl-landing-domains .pl-domains-result.is-taken .pl-domains-result-end {
        width: auto;
        margin-left: auto;
    }
}


/* ---- css/pl-connector-pages.css ---- */
/* Text-first connector briefs */

/* pl-landing.css locks the document and scrolls a .pl-landing-scroll container;
   these pages scroll natively instead. */
html:has(body.pl-connector-page),
body.pl-connector-page {
    height: auto;
    overflow: visible;
}

body.pl-connector-page {
    --pl-connector-ink: #101010;
    --pl-connector-muted: #666;
    --pl-connector-line: #e5e5e5;
    --pl-connector-inset: clamp(20px, 5vw, 48px);
    --pl-connector-max: 900px;
    --pl-marketing-bar-max: 900px;
    --pl-marketing-bar-gutter: clamp(20px, 5vw, 48px);
    background: #fff;
    color: var(--pl-connector-ink);
}

body.pl-connector-page .pl-connector-main {
    width: min(100% - (var(--pl-connector-inset) * 2), var(--pl-connector-max));
    margin: 0 auto;
    padding: calc(var(--pl-marketing-header-h, 72px) + 72px) 0 96px;
}

body.pl-connector-page .pl-connector-hero {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
    padding-bottom: 56px;
    border-bottom: 1px solid var(--pl-connector-line);
}

body.pl-connector-page .pl-connector-logo {
    display: block;
    width: 48px;
    height: 48px;
    object-fit: contain;
}

body.pl-connector-page .pl-connector-kicker {
    margin: 0 0 12px;
    color: var(--pl-connector-muted);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.pl-connector-page .pl-connector-title {
    margin: 0;
    font-size: clamp(42px, 6vw, 64px);
    font-weight: 400;
    letter-spacing: -0.045em;
    line-height: 0.98;
}

body.pl-connector-page .pl-connector-deck {
    max-width: 620px;
    margin: 20px 0 0;
    color: #444;
    font-size: clamp(18px, 2vw, 21px);
    line-height: 1.5;
}

body.pl-connector-page .pl-connector-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

body.pl-connector-page .pl-connector-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 16px;
    border: 1px solid var(--pl-connector-ink);
    background: var(--pl-connector-ink);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

body.pl-connector-page .pl-connector-button--secondary {
    background: #fff;
    color: var(--pl-connector-ink);
}

body.pl-connector-page .pl-connector-section {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: clamp(28px, 6vw, 80px);
    padding: 48px 0;
    border-bottom: 1px solid var(--pl-connector-line);
}

body.pl-connector-page .pl-connector-section-label {
    margin: 3px 0 0;
    color: var(--pl-connector-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.pl-connector-page .pl-connector-section h2 {
    margin: 0 0 16px;
    font-size: clamp(25px, 3vw, 34px);
    font-weight: 400;
    letter-spacing: -0.035em;
    line-height: 1.1;
}

body.pl-connector-page .pl-connector-section p,
body.pl-connector-page .pl-connector-section li {
    color: #444;
    font-size: 16px;
    line-height: 1.65;
}

body.pl-connector-page .pl-connector-section p {
    margin: 0 0 16px;
}

body.pl-connector-page .pl-connector-section ul,
body.pl-connector-page .pl-connector-section ol {
    margin: 20px 0 0;
    padding: 0;
    list-style: none;
    counter-reset: connector-step;
}

body.pl-connector-page .pl-connector-section li {
    position: relative;
    margin: 0;
    padding: 17px 0 17px 42px;
    border-top: 1px solid var(--pl-connector-line);
}

body.pl-connector-page .pl-connector-section li:last-child {
    border-bottom: 1px solid var(--pl-connector-line);
}

body.pl-connector-page .pl-connector-section ol li::before {
    counter-increment: connector-step;
    content: counter(connector-step, decimal-leading-zero);
    position: absolute;
    top: 20px;
    left: 0;
    color: var(--pl-connector-muted);
    font-size: 12px;
    font-weight: 600;
}

body.pl-connector-page .pl-connector-section li strong {
    color: var(--pl-connector-ink);
}

body.pl-connector-page .pl-connector-note {
    padding: 20px 22px;
    border-left: 2px solid var(--pl-connector-ink);
    background: #f7f7f7;
}

body.pl-connector-page .pl-connector-note p:last-child {
    margin-bottom: 0;
}

body.pl-connector-page .pl-connector-footer-link {
    display: inline-block;
    margin-top: 32px;
    color: var(--pl-connector-ink);
    font-size: 14px;
    font-weight: 600;
}

@media (max-width: 640px) {
    body.pl-connector-page .pl-connector-main {
        padding-top: calc(var(--pl-marketing-header-h, 72px) + 40px);
        padding-bottom: 56px;
    }

    body.pl-connector-page .pl-connector-hero,
    body.pl-connector-page .pl-connector-section {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    body.pl-connector-page .pl-connector-hero {
        gap: 18px;
        padding-bottom: 40px;
    }
}


/* ---- css/pl-landing-workspaces.css ---- */
/* Workspaces page — extends pl-landing-v4 (violet accent) */
.pl-landing-workspaces {
    --ws-violet: #7c3aed;
    --ws-indigo: #6366f1;
    --ws-lilac: #a855f7;
}

.pl-landing-workspaces .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-workspaces .pl-landing-slide-inner,
.pl-landing-workspaces .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-workspaces .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-workspaces .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(195deg, #f5f0ff 0%, #fff 50%, #faf8ff 100%);
}

.pl-landing-workspaces .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(160deg, #f3eeff 0%, #fff 55%, #f5f0ff 100%);
}

.pl-landing-workspaces .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(210deg, #fff 0%, #f3eeff 42%, #faf8ff 100%);
}

/* ── Hero copy / actions ─────────────────────────────────────── */
.pl-landing-ws-hero-copy .pl-landing-headline--hero {
    max-width: 16ch;
}

.pl-landing-ws-hero-copy .pl-landing-sub--hero {
    max-width: 50ch;
}

.pl-landing-ws-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(20px, 3vh, 28px);
}

.pl-landing-workspaces .pl-landing-actions .pl-landing-btn--ghost,
.pl-landing-ws-hero-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--ws-violet);
    border: 1px solid rgba(124, 58, 237, 0.35);
    box-shadow: none;
}

.pl-landing-workspaces .pl-landing-actions .pl-landing-btn--ghost:hover,
.pl-landing-ws-hero-actions .pl-landing-btn--ghost:hover {
    background: rgba(124, 58, 237, 0.06);
    border-color: rgba(124, 58, 237, 0.5);
}

/* ── App store badges (iOS + Android) ────────────────────────── */
.pl-landing-ws-stores {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(16px, 2.5vh, 22px);
}

.pl-landing-ws-store {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 168px;
    padding: 9px 16px;
    border-radius: 12px;
    background: #0a0a0a;
    color: #fff;
    text-decoration: none;
    border: 1px solid #0a0a0a;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.pl-landing-ws-store:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(10, 10, 10, 0.18);
}

.pl-landing-ws-store svg {
    flex: none;
    width: 22px;
    height: 22px;
}

.pl-landing-ws-store-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    text-align: left;
}

.pl-landing-ws-store-text small {
    font-size: 9px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    opacity: 0.72;
}

.pl-landing-ws-store-text strong {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* ── Generic screenshot placeholder slot ─────────────────────── */
.pl-landing-ws-shot {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: 14px;
    border: 1px dashed rgba(124, 58, 237, 0.4);
    background:
        repeating-linear-gradient(
            45deg,
            rgba(124, 58, 237, 0.04),
            rgba(124, 58, 237, 0.04) 12px,
            rgba(124, 58, 237, 0.08) 12px,
            rgba(124, 58, 237, 0.08) 24px
        ),
        linear-gradient(135deg, #ede9fe, #f5f3ff);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--ws-violet);
    overflow: hidden;
}

.pl-landing-ws-shot svg {
    width: 30px;
    height: 30px;
    opacity: 0.7;
}

.pl-landing-ws-shot span {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* ── Invite perks grid ───────────────────────────────────────── */
.pl-landing-ws-perks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-ws-perk {
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-ws-perk-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-bottom: 12px;
    border-radius: 10px;
    color: var(--ws-violet);
    background: rgba(124, 58, 237, 0.1);
    border: 1px solid rgba(124, 58, 237, 0.18);
}

.pl-landing-ws-perk-ico svg {
    width: 18px;
    height: 18px;
}

.pl-landing-ws-perk h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--ws-violet);
}

.pl-landing-ws-perk p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

/* ── Chat / DM mockup ────────────────────────────────────────── */
.pl-landing-ws-chat {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 18px;
    box-shadow: 0 18px 48px rgba(76, 29, 149, 0.12);
    overflow: hidden;
}

.pl-landing-ws-chat-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--pl-border);
    background: linear-gradient(180deg, #faf8ff, #fff);
}

.pl-landing-ws-chat-head h4 {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.pl-landing-ws-chat-head p {
    margin: 2px 0 0;
    font-size: 11px;
    color: var(--pl-muted);
}

.pl-landing-ws-chat-body {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 18px 16px;
    background: #fbfbfe;
}

.pl-landing-ws-msg {
    display: flex;
    flex-direction: column;
    max-width: 80%;
    gap: 6px;
}

.pl-landing-ws-msg--in {
    align-self: flex-start;
    align-items: flex-start;
}

.pl-landing-ws-msg--out {
    align-self: flex-end;
    align-items: flex-end;
}

.pl-landing-ws-msg-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
}

.pl-landing-ws-bubble {
    padding: 10px 13px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 1.45;
}

.pl-landing-ws-msg--in .pl-landing-ws-bubble {
    background: #fff;
    border: 1px solid var(--pl-border);
    border-bottom-left-radius: 5px;
    color: var(--pl-text);
}

.pl-landing-ws-msg--out .pl-landing-ws-bubble {
    background: linear-gradient(135deg, var(--ws-violet), var(--ws-indigo));
    border-bottom-right-radius: 5px;
    color: #fff;
}

.pl-landing-ws-msg-name {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--pl-muted);
    padding: 0 4px;
}

/* ── Avatars (read receipts / activity) ──────────────────────── */
.pl-landing-ws-avatar {
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-weight: 700;
    color: #fff;
    background: var(--ws-violet);
    box-shadow: 0 0 0 2px #fff;
}

.pl-landing-ws-avatar--lg {
    width: 38px;
    height: 38px;
    font-size: 14px;
}

.pl-landing-ws-avatar--sm {
    width: 22px;
    height: 22px;
    font-size: 9px;
    letter-spacing: 0.02em;
}

.pl-landing-ws-avatar--a { background: linear-gradient(135deg, #7c3aed, #a855f7); }
.pl-landing-ws-avatar--b { background: linear-gradient(135deg, #2563eb, #38bdf8); }
.pl-landing-ws-avatar--c { background: linear-gradient(135deg, #db2777, #fb7185); }
.pl-landing-ws-avatar--d { background: linear-gradient(135deg, #059669, #34d399); }

.pl-landing-ws-seen {
    display: flex;
    align-items: center;
    gap: 6px;
    align-self: flex-end;
    padding: 0 2px;
}

.pl-landing-ws-seen-stack {
    display: inline-flex;
}

.pl-landing-ws-seen-stack .pl-landing-ws-avatar:not(:first-child) {
    margin-left: -8px;
}

.pl-landing-ws-seen-label {
    font-size: 10px;
    color: var(--pl-muted);
}

/* ── Typing indicator ────────────────────────────────────────── */
.pl-landing-ws-typing {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 12px 14px;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 16px;
    border-bottom-left-radius: 5px;
}

.pl-landing-ws-typing span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ws-violet);
    opacity: 0.4;
    animation: pl-ws-typing-bounce 1.3s infinite ease-in-out;
}

.pl-landing-ws-typing span:nth-child(2) { animation-delay: 0.18s; }
.pl-landing-ws-typing span:nth-child(3) { animation-delay: 0.36s; }

@keyframes pl-ws-typing-bounce {
    0%, 60%, 100% { transform: translateY(0); opacity: 0.4; }
    30% { transform: translateY(-4px); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .pl-landing-ws-typing span { animation: none; opacity: 0.7; }
}

.pl-landing-ws-typing-caption {
    margin-top: 8px;
    font-size: 11px;
    color: var(--pl-muted);
    padding: 0 4px;
}

/* ── Activity strip (avatars showing who's active) ───────────── */
.pl-landing-ws-activity {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: clamp(20px, 3vh, 28px);
    padding: 16px 18px;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-ws-activity-stack {
    display: inline-flex;
}

.pl-landing-ws-activity-stack .pl-landing-ws-avatar:not(:first-child) {
    margin-left: -10px;
}

.pl-landing-ws-activity-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    margin-left: -10px;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
    color: var(--ws-violet);
    background: #ede9fe;
    box-shadow: 0 0 0 2px #fff;
}

.pl-landing-ws-activity-text strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.pl-landing-ws-activity-text span {
    font-size: 12px;
    color: var(--pl-muted);
}

.pl-landing-ws-activity-dot {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--pl-green, #008556);
    box-shadow: 0 0 0 3px rgba(0, 133, 86, 0.18);
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 900px) {
    .pl-landing-ws-perks {
        grid-template-columns: 1fr;
    }

    .pl-landing-ws-hero-copy .pl-landing-headline--hero {
        max-width: none;
    }
}

@media (min-width: 600px) and (max-width: 1100px) {
    .pl-landing-ws-perks {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* ---- css/pl-landing-compare.css ---- */
/* Compare — Pathline vs competitors (marketing VIP, not article) */
body.pl-landing-compare {
    --pl-compare-ink: #0e0e0e;
    --pl-compare-muted: #6f6f6f;
    --pl-compare-border: #e8e8e8;
    --pl-compare-surface: #f6f6f6;
}

body.pl-landing-compare .pl-time-hero {
    min-height: auto;
    padding-bottom: clamp(48px, 8vh, 80px);
}

body.pl-landing-compare.pl-landing-connect .pl-time-hero {
    padding-bottom: 24px;
}

body.pl-landing-compare.pl-landing-connect .pl-compare-section {
    padding-top: 0;
    border-top: none;
}

body.pl-landing-compare .pl-time-hero-lead {
    max-width: 36em;
}

body.pl-landing-compare .pl-compare-section {
    padding: clamp(56px, 8vh, 96px) var(--pl-time-inset, clamp(20px, 5vw, 48px));
    border-top: 1px solid var(--pl-compare-border);
}

body.pl-landing-compare .pl-compare-section-inner {
    width: 100%;
    max-width: var(--pl-time-max, 1120px);
    margin: 0 auto;
}

body.pl-landing-compare .pl-compare-section-head {
    margin-bottom: clamp(28px, 4vh, 40px);
    max-width: 40em;
}

body.pl-landing-compare .pl-compare-section-head .pl-time-title {
    margin-bottom: 10px;
}

/* ── Matrix ── */
body.pl-landing-compare .pl-compare-matrix-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 calc(-1 * min(12px, 2vw));
    padding: 0 min(12px, 2vw);
}

body.pl-landing-compare .pl-compare-matrix {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    table-layout: fixed;
}

body.pl-landing-compare .pl-compare-matrix th,
body.pl-landing-compare .pl-compare-matrix td {
    padding: 14px 16px;
    text-align: left;
    vertical-align: top;
    border-bottom: 1px solid var(--pl-compare-border);
    font-size: 14px;
    line-height: 1.45;
}

body.pl-landing-compare .pl-compare-matrix thead th {
    padding-top: 0;
    padding-bottom: 16px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--pl-compare-muted);
    border-bottom-color: #d8d8d8;
}

body.pl-landing-compare .pl-compare-matrix thead th:first-child {
    color: transparent;
    user-select: none;
}

body.pl-landing-compare .pl-compare-matrix tbody th {
    font-weight: 500;
    color: var(--pl-compare-ink);
    width: 36%;
}

body.pl-landing-compare .pl-compare-matrix td {
    color: var(--pl-compare-muted);
    width: 32%;
}

body.pl-landing-compare .pl-compare-matrix td.pl-compare-yes {
    color: var(--pl-compare-ink);
    font-weight: 500;
}

body.pl-landing-compare .pl-compare-matrix td.pl-compare-no {
    color: #a3a3a3;
}

body.pl-landing-compare .pl-compare-matrix tr.pl-compare-matrix-highlight td,
body.pl-landing-compare .pl-compare-matrix tr.pl-compare-matrix-highlight th {
    background: var(--pl-compare-surface);
}

body.pl-landing-compare .pl-compare-matrix tbody tr:last-child th,
body.pl-landing-compare .pl-compare-matrix tbody tr:last-child td {
    border-bottom: none;
}

/* ── Reason stack ── */
body.pl-landing-compare .pl-compare-reasons {
    display: grid;
    gap: 0;
    border-top: 1px solid var(--pl-compare-border);
}

body.pl-landing-compare .pl-compare-reason {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: clamp(24px, 4vw, 56px);
    align-items: start;
    padding: clamp(36px, 5vh, 56px) 0;
    border-bottom: 1px solid var(--pl-compare-border);
}

body.pl-landing-compare .pl-compare-reason:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

body.pl-landing-compare .pl-compare-reason-label {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-compare-muted);
}

body.pl-landing-compare .pl-compare-reason h3 {
    margin: 0;
    font-size: clamp(22px, 3vw, 30px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: var(--pl-compare-ink);
}

body.pl-landing-compare .pl-compare-reason p {
    margin: 0 0 12px;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-compare-muted);
    max-width: 38em;
}

body.pl-landing-compare .pl-compare-reason p:last-child {
    margin-bottom: 0;
}

/* ── Hub tiles ── */
body.pl-landing-compare .pl-compare-hub {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1px;
    background: var(--pl-compare-border);
    border: 1px solid var(--pl-compare-border);
}

body.pl-landing-compare .pl-compare-hub-tile {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: clamp(28px, 4vw, 40px);
    background: #fff;
    text-decoration: none;
    color: inherit;
    transition: background 0.2s ease;
}

body.pl-landing-compare .pl-compare-hub-logo {
    display: block;
    width: 40px;
    height: 40px;
    object-fit: contain;
}

body.pl-landing-compare .pl-compare-hub-tile--soon {
    pointer-events: none;
    justify-content: flex-end;
    min-height: 200px;
    background: #0e0e0e;
    color: #fff;
}

body.pl-landing-compare .pl-compare-hub-tile--soon .pl-path-mark {
    width: 96px;
    height: 96px;
    margin-bottom: auto;
}

body.pl-landing-compare .pl-compare-hub-tile--soon .pl-compare-hub-more {
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
}

body.pl-landing-compare .pl-compare-hub-tile:hover {
    background: var(--pl-compare-surface);
}

body.pl-landing-compare .pl-compare-hub-tile:focus-visible {
    outline: 2px solid var(--pl-compare-ink);
    outline-offset: -2px;
    z-index: 1;
}

body.pl-landing-compare .pl-compare-hub-kicker {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-compare-muted);
}

body.pl-landing-compare .pl-compare-hub-tile h2 {
    margin: 0;
    font-size: clamp(24px, 3.2vw, 32px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: var(--pl-compare-ink);
}

body.pl-landing-compare .pl-compare-hub-tile p {
    margin: 0;
    font-size: 15px;
    line-height: 1.5;
    color: var(--pl-compare-muted);
    max-width: 32em;
}

body.pl-landing-compare .pl-compare-hub-more {
    margin-top: auto;
    padding-top: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--pl-compare-ink);
}

/* ── Also compare strip ── */
body.pl-landing-compare .pl-compare-also {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px 20px;
}

body.pl-landing-compare .pl-compare-also-label {
    margin: 0;
    font-size: 13px;
    color: var(--pl-compare-muted);
}

body.pl-landing-compare .pl-compare-also a {
    font-size: 14px;
    font-weight: 500;
    color: var(--pl-compare-ink);
    text-decoration: none;
    border-bottom: 1px solid #d0d0d0;
}

body.pl-landing-compare .pl-compare-also a:hover {
    border-bottom-color: var(--pl-compare-ink);
}

body.pl-landing-compare .pl-compare-proof {
    margin: 0 auto;
    max-width: 560px;
}

body.pl-landing-compare .pl-compare-proof img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--pl-compare-border);
}

body.pl-landing-compare .pl-compare-section--proof .pl-compare-section-head {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

body.pl-landing-compare .pl-compare-section--proof .pl-compare-section-head .pl-time-lead {
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 760px) {
    body.pl-landing-compare .pl-compare-reason {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    body.pl-landing-compare .pl-compare-hub {
        grid-template-columns: 1fr;
    }

    body.pl-landing-compare .pl-compare-section {
        padding-left: 16px;
        padding-right: 16px;
    }

    body.pl-landing-compare .pl-compare-matrix-wrap {
        overflow-x: visible;
        margin: 0;
        padding: 0;
        width: 100%;
    }

    body.pl-landing-compare .pl-compare-matrix {
        min-width: 0;
        width: 100%;
        table-layout: fixed;
    }

    body.pl-landing-compare .pl-compare-matrix th,
    body.pl-landing-compare .pl-compare-matrix td {
        padding: 10px 4px;
        font-size: 12px;
        line-height: 1.35;
        text-align: center;
        word-break: break-word;
        overflow-wrap: anywhere;
        hyphens: auto;
    }

    body.pl-landing-compare .pl-compare-matrix thead th {
        font-size: 10px;
        letter-spacing: 0.04em;
        padding-bottom: 12px;
    }

    body.pl-landing-compare .pl-compare-matrix tbody th {
        width: 36%;
        text-align: center;
        font-size: 11px;
    }

    body.pl-landing-compare .pl-compare-matrix td {
        width: 32%;
    }
}


/* ---- css/pl-landing-resources.css ---- */
/* Resources, Pathline marketing (three-column index + article) */
body.pl-landing-resources {
    --pl-res-ink: #0e0e0e;
    --pl-res-muted: #666;
    --pl-res-line: #e4e4e4;
    --pl-res-inset: clamp(20px, 5vw, 48px);
    --pl-res-gap: 16px;
    background: #fff;
}

body.pl-landing-resources .pl-res-kicker {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-resources .pl-res-kicker a {
    color: inherit;
    text-decoration: none;
}

body.pl-landing-resources .pl-res-kicker a:hover {
    color: var(--pl-res-ink);
}

/* ── Type filter (index) ── */
body.pl-landing-resources .pl-res-filter {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 2px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px var(--pl-res-inset) 0;
    border-top: 1px solid var(--pl-res-line);
}

body.pl-landing-resources .pl-res-filter-btn {
    appearance: none;
    margin: 0;
    padding: 10px 14px;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    color: #888;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease;
}

body.pl-landing-resources .pl-res-filter-btn:hover {
    color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-filter-btn.is-active {
    color: var(--pl-res-ink);
    border-bottom-color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-filter-btn:focus-visible {
    outline: 2px solid #1774ff;
    outline-offset: 2px;
}

@media (max-width: 640px) {
    body.pl-landing-resources .pl-res-filter {
        position: sticky;
        top: var(--pl-marketing-header-h, 72px);
        z-index: 8;
        flex-wrap: nowrap;
        gap: 0;
        max-width: none;
        margin: 0;
        padding: 0 0 0 var(--pl-res-inset);
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        border-top: 1px solid var(--pl-res-line);
        border-bottom: 1px solid var(--pl-res-line);
        background: rgba(255, 255, 255, 0.94);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        mask-image: linear-gradient(
            to right,
            #000 0,
            #000 calc(100% - 36px),
            transparent 100%
        );
    }

    body.pl-landing-resources .pl-res-filter::-webkit-scrollbar {
        display: none;
    }

    body.pl-landing-resources .pl-res-filter-btn {
        flex: 0 0 auto;
        padding: 14px 16px;
        font-size: 14px;
        white-space: nowrap;
        scroll-snap-align: start;
        touch-action: manipulation;
    }

    body.pl-landing-resources .pl-res-filter-btn:last-child {
        margin-right: var(--pl-res-inset);
    }
}

/* ── Three equal columns ── */
body.pl-landing-resources .pl-res-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--pl-res-gap);
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px var(--pl-res-inset) clamp(40px, 6vh, 64px);
}

body.pl-landing-resources .pl-res-tile.is-filtered-out {
    display: none;
}

body.pl-landing-resources .pl-res-tile {
    --mx: 50%;
    --my: 50%;
    --pl-grow-flash: #1774ff;
    position: relative;
    isolation: isolate;
    box-sizing: border-box;
    min-width: 0;
    min-height: 320px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 28px;
    border: 1px solid var(--pl-res-line);
    background: #fafafa;
    color: var(--pl-res-ink);
    text-decoration: none;
    overflow: hidden;
    transition: border-color 0.2s ease;
}

body.pl-landing-resources .pl-res-tile[data-tag="product"] {
    --pl-grow-flash: #1774ff;
}

body.pl-landing-resources .pl-res-tile[data-tag="design"] {
    --pl-grow-flash: #7c3aed;
}

body.pl-landing-resources .pl-res-tile[data-tag="web-studio"] {
    --pl-grow-flash: #2563eb;
}

body.pl-landing-resources .pl-res-tile[data-tag="forms"] {
    --pl-grow-flash: #0d9488;
}

body.pl-landing-resources .pl-res-tile[data-tag="voice"] {
    --pl-grow-flash: #6366f1;
}

body.pl-landing-resources .pl-res-tile[data-tag="team"] {
    --pl-grow-flash: #008556;
}

body.pl-landing-resources .pl-res-tile[data-tag="engineering"] {
    --pl-grow-flash: #0f766e;
}

body.pl-landing-resources .pl-res-tile[data-tag="company"] {
    --pl-grow-flash: #b45309;
}

body.pl-landing-resources .pl-res-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--pl-grow-flash);
    clip-path: circle(0% at var(--mx) var(--my));
    transition:
        clip-path 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1) 0.12s;
}

body.pl-landing-resources .pl-res-tile.is-hot::before {
    clip-path: circle(160% at var(--mx) var(--my));
}

body.pl-landing-resources .pl-res-tile.is-ink::before {
    background-color: #0e0e0e;
}

body.pl-landing-resources .pl-res-tile.is-leaving::before {
    clip-path: circle(0% at var(--mx) var(--my));
    background-color: var(--pl-grow-flash);
    transition:
        clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.2s ease;
}

body.pl-landing-resources .pl-res-tile > * {
    position: relative;
    z-index: 1;
}

body.pl-landing-resources .pl-res-tile:hover {
    border-color: #0e0e0e;
}

body.pl-landing-resources .pl-res-tile.is-hot .pl-res-tile-tag,
body.pl-landing-resources .pl-res-tile.is-hot .pl-res-tile-title,
body.pl-landing-resources .pl-res-tile.is-hot .pl-res-tile-deck,
body.pl-landing-resources .pl-res-tile.is-hot .pl-res-tile-meta {
    color: #fff;
    transition: color 0.12s ease;
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-resources .pl-res-tile::before {
        transition: none;
    }

    body.pl-landing-resources .pl-res-tile.is-hot::before {
        clip-path: none;
        background: #0e0e0e;
    }
}

body.pl-landing-resources .pl-res-tile-tag {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-resources .pl-res-tile-title {
    margin: 0;
    font-size: clamp(22px, 2.2vw, 28px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.15;
}

body.pl-landing-resources .pl-res-tile-deck {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-res-muted);
}

body.pl-landing-resources .pl-res-tile-meta {
    margin-top: auto;
    padding-top: 20px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #888;
}

@media (max-width: 900px) {
    body.pl-landing-resources .pl-res-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.pl-landing-resources .pl-res-tile {
        min-height: 280px;
    }
}

@media (max-width: 640px) {
    body.pl-landing-resources .pl-res-grid {
        grid-template-columns: 1fr;
    }

    body.pl-landing-resources .pl-res-tile {
        min-height: 0;
        padding: 24px;
    }
}

/* ── Article ── */
body.pl-landing-resources--article .pl-res-article {
    max-width: 720px;
    margin: 0 auto;
    padding: calc(var(--pl-marketing-header-h, 72px) + clamp(48px, 8vh, 88px)) var(--pl-res-inset) clamp(56px, 8vh, 88px);
}

body.pl-landing-resources .pl-res-article-date {
    margin: 0 0 18px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-resources .pl-res-article-title {
    margin: 0 0 18px;
    font-size: clamp(32px, 5vw, 48px);
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1.08;
    color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-article-deck {
    margin: 0 0 18px;
    font-size: 18px;
    line-height: 1.5;
    color: #444;
}

body.pl-landing-resources .pl-res-author {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 24px;
}

body.pl-landing-resources .pl-res-article-ai {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    margin: 0 0 40px;
    padding-top: 4px;
}

body.pl-landing-resources .pl-res-article-ai-btn {
    appearance: none;
    margin: 0;
    padding: 10px 16px;
    border: 1px solid #0e0e0e;
    border-radius: 0;
    background: #0e0e0e;
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

body.pl-landing-resources .pl-res-article-ai-btn:hover {
    background: #333;
    border-color: #333;
}

body.pl-landing-resources .pl-res-article-ai-hint {
    margin: 0;
    max-width: 28em;
    font-size: 13px;
    line-height: 1.45;
    color: var(--pl-res-muted, #6f6f6f);
}

body.pl-landing-resources .pl-res-author-photo-link {
    display: block;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: #e8e8e8;
    text-decoration: none;
}

body.pl-landing-resources .pl-res-author-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pl-landing-resources .pl-res-author-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

body.pl-landing-resources .pl-res-author-name {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-res-ink);
    text-decoration: none;
}

body.pl-landing-resources .pl-res-author-name:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.pl-landing-resources .pl-res-author-meta {
    margin: 0;
    font-size: 13px;
    color: #888;
}

body.pl-landing-resources .pl-res-article-body {
    font-size: 17px;
    line-height: 1.7;
    color: #2a2a2a;
}

body.pl-landing-resources .pl-res-article-body p,
body.pl-landing-resources .pl-res-article-body ul,
body.pl-landing-resources .pl-res-article-body ol,
body.pl-landing-resources .pl-res-article-body blockquote {
    margin: 0 0 1.25em;
}

body.pl-landing-resources .pl-res-article-body h2 {
    margin: 2em 0 0.75em;
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-article-body h3 {
    margin: 1.75em 0 0.5em;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.35;
    color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-article-body h3:first-child {
    margin-top: 0;
}

body.pl-landing-resources .pl-res-article-body li {
    margin: 0 0 0.65em;
}

body.pl-landing-resources .pl-res-article-body ul,
body.pl-landing-resources .pl-res-article-body ol {
    padding-left: 1.25em;
}

body.pl-landing-resources .pl-res-article-body blockquote {
    margin: 2em 0;
    padding: 0 0 0 1.1em;
    border-left: 2px solid #0e0e0e;
}

body.pl-landing-resources .pl-res-article-body blockquote p {
    margin: 0;
    font-size: clamp(20px, 2.6vw, 26px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.3;
    color: var(--pl-res-ink);
}

body.pl-landing-resources .pl-res-article-body a {
    color: var(--pl-res-ink);
    text-underline-offset: 3px;
}

body.pl-landing-resources .pl-res-article-body a:has(> .pl-link-out-icon) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

body.pl-landing-resources .pl-res-article-body pre {
    margin: 0 0 1.25em;
    padding: 16px 18px;
    overflow-x: auto;
    border: 1px solid var(--pl-res-line);
    background: #f7f7f7;
    font-size: 13px;
    line-height: 1.55;
}

body.pl-landing-resources .pl-res-code {
    position: relative;
    margin: 0 0 1.25em;
    border: 1px solid var(--pl-res-line);
    background: #f7f7f7;
}

body.pl-landing-resources .pl-res-code-copy {
    appearance: none;
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0;
    padding: 0;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #666;
    cursor: pointer;
    transition: color 0.15s ease;
}

body.pl-landing-resources .pl-res-code-copy:hover {
    color: #0e0e0e;
}

body.pl-landing-resources .pl-res-code-copy.is-copied {
    color: #0e0e0e;
}

body.pl-landing-resources .pl-res-code-copy .pl-res-code-copy-check {
    display: none;
}

body.pl-landing-resources .pl-res-code-copy.is-copied .pl-res-code-copy-icon {
    display: none;
}

body.pl-landing-resources .pl-res-code-copy.is-copied .pl-res-code-copy-check {
    display: block;
}

body.pl-landing-resources .pl-res-code pre {
    margin: 0;
    border: none;
    background: transparent;
    padding-right: 44px;
}

body.pl-landing-resources .pl-res-article-body pre.pl-res-tree {
    line-height: 1.45;
}

body.pl-landing-resources .pl-res-article-body pre.pl-res-tree code {
    font-variant-ligatures: none;
}

body.pl-landing-resources .pl-res-article-body code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.92em;
}

body.pl-landing-resources .pl-res-article-body pre code {
    font-size: inherit;
}

body.pl-landing-resources .pl-res-article-embed {
    margin: 2em 0 1.5em;
}

body.pl-landing-resources .pl-res-article-embed .pl-time-bento {
    display: block;
    max-width: 340px;
    margin: 0 auto;
}

body.pl-landing-resources .pl-res-article-embed--wide .pl-time-bento {
    max-width: 100%;
}

/* Full-width iOS/Android pocket stage inside news articles */
body.pl-landing-resources .pl-res-article-embed--ios .pl-time-card {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

body.pl-landing-resources .pl-res-article-embed--ios .pl-time-ios-stage {
    width: 100%;
    height: 440px;
    min-height: 440px;
    max-height: 440px;
    padding: 24px 16px 0;
    box-sizing: border-box;
}

body.pl-landing-resources .pl-res-article-embed--ios .pl-ios-anim {
    max-width: 260px;
    transform: scale(1.45);
    transform-origin: bottom center;
    margin-bottom: 8px;
}

@media (max-width: 640px) {
    body.pl-landing-resources .pl-res-article-embed--ios .pl-time-ios-stage {
        height: 360px;
        min-height: 360px;
        max-height: 360px;
    }

    body.pl-landing-resources .pl-res-article-embed--ios .pl-ios-anim {
        transform: scale(1.15);
    }
}

body.pl-landing-resources .pl-res-article-embed .pl-time-card {
    width: 100%;
    min-height: 0;
}

body.pl-landing-resources .pl-res-article-shot {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--pl-res-line);
    background: #fafafa;
}

body.pl-landing-resources .pl-res-article-stores {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 16px 0 0;
}

body.pl-landing-resources .pl-res-article-stores .pl-landing-v4-footer-appstore-img--light {
    display: none;
}

body.pl-landing-resources .pl-res-article-stores .pl-landing-v4-footer-appstore-img--dark {
    display: block;
}

body.pl-landing-resources .pl-res-article-embed--ws .pl-landing-ws-chat {
    max-width: 420px;
    margin: 0 auto;
    border: 1px solid var(--pl-res-line);
    background: #fafafa;
}

body.pl-landing-resources .pl-res-article-foot {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 28px;
    margin-top: 56px;
    padding-top: 36px;
    border-top: 1px solid var(--pl-res-line);
}

body.pl-landing-resources .pl-res-discover-title {
    margin: 0 0 4px;
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
    color: #888;
}

/* Same tiles as index; break out of article column width */
body.pl-landing-resources .pl-res-grid--discover {
    width: min(1200px, calc(100vw - (2 * var(--pl-res-inset))));
    max-width: none;
    margin-left: 50%;
    transform: translateX(-50%);
    padding: 12px 0 0;
    border-top: none;
}

body.pl-landing-resources--article .pl-res-grid--discover .pl-res-tile-title {
    font-size: clamp(18px, 2vw, 24px);
}

body.pl-landing-resources .pl-res-back {
    align-self: flex-start;
    font-size: 14px;
    font-weight: 600;
    color: var(--pl-res-ink);
    text-decoration: none;
}

body.pl-landing-resources .pl-res-back:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.pl-landing-resources .pl-res-article-sales {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    margin: 0 0 32px;
    padding: 18px 20px;
    border: 1px solid var(--pl-res-line);
    background: #fafafa;
}

body.pl-landing-resources .pl-res-article-sales-copy {
    margin: 0;
    flex: 1 1 220px;
    max-width: 36em;
    font-size: 15px;
    line-height: 1.5;
    color: #2a2a2a;
}

body.pl-landing-resources .pl-res-article-sales .pl-time-btn {
    flex: 0 0 auto;
}


/* ---- css/pl-landing-news.css ---- */
/* News article — reading layout (index reuses Resources tile styles) */
body.pl-landing-news {
    --pl-news-ink: #0e0e0e;
    --pl-news-muted: #666;
    --pl-news-line: #e4e4e4;
    --pl-news-inset: clamp(20px, 5vw, 48px);
    background: #fff;
}

body.pl-landing-news .pl-news-kicker {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-news .pl-news-kicker a {
    color: inherit;
    text-decoration: none;
}

body.pl-landing-news .pl-news-kicker a:hover {
    color: var(--pl-news-ink);
}

body.pl-landing-news--article .pl-news-article {
    max-width: 720px;
    margin: 0 auto;
    padding: calc(var(--pl-marketing-header-h, 72px) + clamp(48px, 8vh, 88px)) var(--pl-news-inset) clamp(56px, 8vh, 88px);
}

body.pl-landing-news .pl-news-article-date {
    margin: 0 0 18px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #888;
}

body.pl-landing-news .pl-news-article-title {
    margin: 0 0 18px;
    font-size: clamp(32px, 5vw, 48px);
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1.08;
    color: var(--pl-news-ink);
}

body.pl-landing-news .pl-news-article-deck {
    margin: 0 0 18px;
    font-size: 18px;
    line-height: 1.5;
    color: #444;
}

body.pl-landing-news .pl-news-author {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 40px;
}

body.pl-landing-news .pl-news-author-photo-link {
    display: block;
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: #e8e8e8;
    text-decoration: none;
}

body.pl-landing-news .pl-news-author-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.pl-landing-news .pl-news-author-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

body.pl-landing-news .pl-news-author-name {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-news-ink);
    text-decoration: none;
}

body.pl-landing-news .pl-news-author-name:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.pl-landing-news .pl-news-author-meta {
    margin: 0;
    font-size: 13px;
    color: #888;
}

body.pl-landing-news .pl-news-article-body {
    font-size: 17px;
    line-height: 1.7;
    color: #2a2a2a;
}

body.pl-landing-news .pl-news-article-body p,
body.pl-landing-news .pl-news-article-body ul,
body.pl-landing-news .pl-news-article-body ol,
body.pl-landing-news .pl-news-article-body blockquote {
    margin: 0 0 1.25em;
}

body.pl-landing-news .pl-news-article-body h2 {
    margin: 2em 0 0.75em;
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.2;
    color: var(--pl-news-ink);
}

body.pl-landing-news .pl-news-article-body li {
    margin: 0 0 0.65em;
}

body.pl-landing-news .pl-news-article-body ul,
body.pl-landing-news .pl-news-article-body ol {
    padding-left: 1.25em;
}

body.pl-landing-news .pl-news-article-body blockquote {
    margin: 2em 0;
    padding: 0 0 0 1.1em;
    border-left: 2px solid #0e0e0e;
}

body.pl-landing-news .pl-news-article-body blockquote p {
    margin: 0;
    font-size: clamp(20px, 2.6vw, 26px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.3;
    color: var(--pl-news-ink);
}

body.pl-landing-news .pl-news-article-body a {
    color: var(--pl-news-ink);
    text-underline-offset: 3px;
}

body.pl-landing-news .pl-news-article-foot {
    margin-top: 56px;
    padding-top: 28px;
    border-top: 1px solid var(--pl-news-line);
}

body.pl-landing-news .pl-news-back {
    font-size: 14px;
    font-weight: 600;
    color: var(--pl-news-ink);
    text-decoration: none;
}

body.pl-landing-news .pl-news-back:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ── Index: one line per post ── */
body.pl-landing-news .pl-news-index-head {
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(var(--pl-marketing-header-h, 72px) + clamp(40px, 6vh, 64px)) var(--pl-news-inset) 8px;
}

body.pl-landing-news .pl-news-index-head h1 {
    margin: 0;
    font-size: clamp(36px, 5.5vw, 56px);
    font-weight: 400;
    letter-spacing: -0.04em;
    line-height: 1.05;
    color: var(--pl-news-ink);
}

body.pl-landing-news .pl-res-filter {
    max-width: 1200px;
    padding-top: 20px;
    padding-bottom: 8px;
    border-top: 0;
}

body.pl-landing-news .pl-res-filter-btn {
    position: relative;
    display: inline-block;
    margin: 0 22px 0 0;
    padding: 8px 0;
    border: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

body.pl-landing-news .pl-res-filter-btn:last-child {
    margin-right: 0;
}

body.pl-landing-news .pl-res-filter-btn::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 4px;
    width: 0;
    height: 0;
    border-bottom: 2px solid currentColor;
    transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

body.pl-landing-news .pl-res-filter-btn:hover::after,
body.pl-landing-news .pl-res-filter-btn.is-active::after {
    width: 100%;
}

body.pl-landing-news .pl-res-filter-btn.is-active {
    border-bottom-color: transparent;
}

body.pl-landing-news .pl-res-grid {
    display: block;
    max-width: 1200px;
    padding-top: 0;
    padding-bottom: clamp(56px, 8vh, 88px);
}

body.pl-landing-news .pl-res-tile {
    display: grid;
    grid-template-columns: 7.5rem minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 8px 24px;
    min-height: 0;
    padding: 16px 0;
    border: 0;
    border-top: 1px solid var(--pl-news-line);
    background: transparent;
    overflow: visible;
    isolation: auto;
}

body.pl-landing-news .pl-res-tile::before {
    content: none;
}

body.pl-landing-news .pl-res-tile:last-child {
    border-bottom: 1px solid var(--pl-news-line);
}

body.pl-landing-news .pl-news-row-date {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: -0.01em;
    color: var(--pl-news-muted);
    white-space: nowrap;
}

body.pl-landing-news .pl-news-row-title {
    margin: 0;
    font-size: clamp(16px, 1.8vw, 20px);
    font-weight: 500;
    letter-spacing: -0.03em;
    line-height: 1.3;
    color: var(--pl-news-ink);
}

body.pl-landing-news .pl-news-row-tag {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--pl-news-muted);
    white-space: nowrap;
}

body.pl-landing-news .pl-res-tile:hover {
    border-color: var(--pl-news-line);
}

body.pl-landing-news .pl-res-tile:hover .pl-news-row-title {
    text-decoration: underline;
    text-underline-offset: 3px;
}

body.pl-landing-news .pl-res-tile-tag,
body.pl-landing-news .pl-res-tile-title,
body.pl-landing-news .pl-res-tile-deck,
body.pl-landing-news .pl-res-tile-meta {
    display: none;
}

@media (max-width: 720px) {
    body.pl-landing-news .pl-res-filter {
        position: static;
        flex-wrap: wrap;
        overflow: visible;
        mask-image: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-bottom: 0;
        background: transparent;
    }

    body.pl-landing-news .pl-res-tile {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 16px;
        padding: 14px 0;
    }

    body.pl-landing-news .pl-news-row-date {
        grid-column: 1 / -1;
        font-size: 12px;
    }

    body.pl-landing-news .pl-news-row-title {
        font-size: 17px;
    }
}


/* ---- css/pl-landing-learn.css ---- */
/* Learn index — field notes / proof sheet. Not a card grid. */
body.pl-landing-learn {
    --pl-learn-ink: #0e0e0e;
    --pl-learn-muted: #6a6a6a;
    --pl-learn-line: #e4e4e4;
    background: #fff;
}

body.pl-landing-learn .pl-learn {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(var(--pl-marketing-header-h, 72px) + 28px) clamp(20px, 5vw, 48px) clamp(48px, 7vh, 72px);
}

body.pl-landing-learn .pl-learn__sheet {
    position: relative;
    padding: clamp(28px, 4vw, 48px) clamp(20px, 3vw, 40px) clamp(20px, 3vw, 32px);
    border: 1px solid var(--pl-learn-line);
}

body.pl-landing-learn .pl-learn__crop {
    position: absolute;
    width: 14px;
    height: 14px;
    pointer-events: none;
}

body.pl-landing-learn .pl-learn__crop--tl {
    top: -1px;
    left: -1px;
    border-top: 1px solid var(--pl-learn-ink);
    border-left: 1px solid var(--pl-learn-ink);
}

body.pl-landing-learn .pl-learn__crop--tr {
    top: -1px;
    right: -1px;
    border-top: 1px solid var(--pl-learn-ink);
    border-right: 1px solid var(--pl-learn-ink);
}

body.pl-landing-learn .pl-learn__crop--bl {
    bottom: -1px;
    left: -1px;
    border-bottom: 1px solid var(--pl-learn-ink);
    border-left: 1px solid var(--pl-learn-ink);
}

body.pl-landing-learn .pl-learn__crop--br {
    bottom: -1px;
    right: -1px;
    border-bottom: 1px solid var(--pl-learn-ink);
    border-right: 1px solid var(--pl-learn-ink);
}

body.pl-landing-learn .pl-learn__mast {
    margin: 0 0 clamp(28px, 4vw, 40px);
}

body.pl-landing-learn .pl-learn__issue {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--pl-learn-muted);
}

body.pl-landing-learn .pl-learn__mast h1 {
    margin: 0;
    max-width: 14ch;
    font-size: clamp(40px, 7vw, 72px);
    font-weight: 400;
    letter-spacing: -0.05em;
    line-height: 0.95;
    color: var(--pl-learn-ink);
}

body.pl-landing-learn .pl-res-filter {
    max-width: none;
    margin: 0;
    padding: 0 0 8px;
    border-top: 0;
    gap: 0 4px;
}

body.pl-landing-learn .pl-res-filter-btn {
    position: relative;
    display: inline-block;
    margin: 0 22px 0 0;
    padding: 8px 0;
    border: 0;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

body.pl-landing-learn .pl-res-filter-btn:last-child {
    margin-right: 0;
}

body.pl-landing-learn .pl-res-filter-btn::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    bottom: 4px;
    width: 0;
    height: 0;
    border-bottom: 2px solid currentColor;
    transition: width 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

body.pl-landing-learn .pl-res-filter-btn:hover::after,
body.pl-landing-learn .pl-res-filter-btn.is-active::after {
    width: 100%;
}

body.pl-landing-learn .pl-res-filter-btn.is-active {
    border-bottom-color: transparent;
}

body.pl-landing-learn .pl-res-grid {
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
    counter-reset: learn;
}

body.pl-landing-learn .pl-res-tile.is-filtered-out {
    display: none;
}

body.pl-landing-learn .pl-res-tile:not(.is-filtered-out) {
    counter-increment: learn;
}

body.pl-landing-learn .pl-res-tile {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 16px;
    row-gap: 4px;
    min-height: 0;
    margin: 0;
    padding: clamp(20px, 2.4vw, 28px) 0;
    border: 0;
    border-top: 1px solid var(--pl-learn-line);
    background: transparent;
    overflow: visible;
    isolation: auto;
}

body.pl-landing-learn .pl-res-tile::before {
    content: none;
}

body.pl-landing-learn .pl-res-tile:last-child {
    border-bottom: 1px solid var(--pl-learn-line);
}

body.pl-landing-learn .pl-res-tile:hover {
    border-color: var(--pl-learn-line);
}

body.pl-landing-learn .pl-learn__n {
    grid-row: 1 / span 2;
    align-self: start;
    padding-top: 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.08em;
    font-variant-numeric: tabular-nums;
    color: var(--pl-learn-muted);
}

body.pl-landing-learn .pl-learn__n::before {
    content: counter(learn, decimal-leading-zero);
}

body.pl-landing-learn .pl-learn__kicker {
    grid-column: 2;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--pl-learn-muted);
}

body.pl-landing-learn .pl-res-tile h2 {
    grid-column: 2;
    margin: 0;
    font-size: clamp(22px, 3.2vw, 36px);
    font-weight: 500;
    letter-spacing: -0.04em;
    line-height: 1.12;
    color: var(--pl-learn-ink);
}

body.pl-landing-learn .pl-res-tile:hover h2 {
    text-decoration: underline;
    text-underline-offset: 4px;
}

body.pl-landing-learn .pl-res-tile-tag,
body.pl-landing-learn .pl-res-tile-title,
body.pl-landing-learn .pl-res-tile-deck,
body.pl-landing-learn .pl-res-tile-meta {
    display: none;
}

@media (max-width: 640px) {
    body.pl-landing-learn .pl-res-filter {
        position: static;
        flex-wrap: wrap;
        overflow: visible;
        mask-image: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-bottom: 0;
        background: transparent;
    }

    body.pl-landing-learn .pl-res-tile {
        grid-template-columns: 2.4rem minmax(0, 1fr);
    }

    body.pl-landing-learn .pl-res-tile h2 {
        font-size: 22px;
    }
}


/* ---- css/pl-docs.css ---- */


html {
    overflow-x: hidden;
    max-width: 100%;
}

body.pl-docs {
    --pl-docs-nav-width: 248px;
    --pl-docs-gutter: 28px;
    --pl-muted-2: #949494;
    --pl-border-strong: #d4d4d4;
    --pl-docs-head-h: var(--pl-marketing-header-h, 72px);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    max-width: 100%;
    background: var(--pl-bg);
}

body.pl-docs .pl-landing-v4-footer {
    width: 100%;
    max-width: none;
    margin: 0;
    padding-inline: var(--pl-docs-gutter);
    box-sizing: border-box;
}

body.pl-docs .pl-landing-v4-footer-main {
    max-width: none;
    width: 100%;
}

.pl-docs-app {
    display: grid;
    grid-template-columns: var(--pl-docs-nav-width) minmax(0, 1fr);
    align-items: start;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex: 1 0 auto;
    overflow-x: clip;
}

.pl-docs-nav {
    position: sticky;
    top: var(--pl-docs-head-h);
    align-self: start;
    z-index: 2;
    display: flex;
    flex-direction: column;
    width: var(--pl-docs-nav-width);
    height: calc(100dvh - var(--pl-docs-head-h));
    overflow-x: hidden;
    overflow-y: auto;
    padding: 20px 12px 40px 20px;
    border-right: 1px solid var(--pl-border);
    background: var(--pl-bg);
    box-sizing: border-box;
}

.pl-docs-nav-toggle {
    display: none;
}

.pl-docs-nav-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.pl-docs-nav-title {
    margin: 0 8px 12px;
    padding: 0;
    border: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

.pl-docs-nav-list {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.pl-docs-nav-group {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 10px 0 0;
}

.pl-docs-nav-group:first-child {
    margin-top: 0;
}

.pl-docs-nav-link {
    display: block;
    padding: 6px 10px;
    border: 0;
    border-radius: 0;
    margin: 0;
    background: transparent;
    color: var(--pl-text);
    text-decoration: none;
    font-size: 13px;
    line-height: 1.4;
    letter-spacing: -0.01em;
    box-shadow: inset 2px 0 0 transparent;
}

.pl-docs-nav-link:hover {
    background: transparent;
    opacity: 1;
    color: #0e0e0e;
    box-shadow: inset 2px 0 0 #d0d0d0;
}

.pl-docs-nav-link.is-active {
    background: transparent;
    font-weight: 600;
    box-shadow: inset 2px 0 0 #0e0e0e;
}

.pl-docs-nav-link--sub {
    padding: 5px 10px 5px 20px;
    font-size: 13px;
    font-weight: 400;
    color: var(--pl-muted);
}

.pl-docs-nav-link--sub.is-active {
    color: var(--pl-text);
}

.pl-docs-detail {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 36px clamp(28px, 5vw, 72px) 80px 40px;
    box-sizing: border-box;
    background: var(--pl-bg);
    overflow-x: clip;
}

.pl-docs-page-title {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pl-docs-main {
    flex: 1;
    min-width: 0;
    width: 100%;
    max-width: none;
    padding: 0;
    box-sizing: border-box;
}

.pl-docs-main.is-swapping {
    opacity: 0.45;
    transition: opacity 0.12s ease;
}

.pl-legal-content.pl-docs-content {
    max-width: none;
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.pl-docs-content-inner {
    width: 100%;
    max-width: min(46rem, 100%);
    min-width: 0;
}

/* ── Content typography ── */

.pl-docs-section,
.pl-docs-steps > li,
.pl-docs-tip,
.pl-docs-agent-card,
.pl-docs-role-card,
.pl-docs-copy-row {
    min-width: 0;
    max-width: 100%;
}

.pl-docs-section {
    scroll-margin-top: 24px;
    padding-bottom: 32px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--pl-border);
}

.pl-docs-section:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.pl-docs-section--flush {
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: none;
}

.pl-docs-copy-row--top {
    margin: 0 0 28px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--pl-border);
}

.pl-docs-hero {
    margin: 0 0 28px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--pl-border);
}

.pl-docs-hero--compact {
    margin-bottom: 24px;
    padding-bottom: 18px;
}

.pl-docs-eyebrow {
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

.pl-docs-main h1 {
    margin: 0 0 16px;
    font-size: clamp(28px, 3.2vw, 36px);
    font-weight: 500;
    letter-spacing: -0.035em;
    line-height: 1.15;
}

.pl-docs-main h2 {
    margin: 0 0 14px;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-transform: none;
    line-height: 1.3;
}

.pl-docs-h3 {
    margin: 24px 0 10px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
    line-height: 1.35;
}

.pl-docs-h3:first-child {
    margin-top: 0;
}

.pl-legal-content.pl-docs-content .pl-docs-lead {
    margin: 0;
    max-width: 62ch;
    font-size: 15px;
    line-height: 1.6;
    color: var(--pl-muted);
}

/* Dashboard links open in a new tab — match footer outbound affordance */
.pl-docs-content a:has(> .pl-link-out-icon) {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ── Topic rows (overview + hub pages) ── */

.pl-docs-rows {
    border: 1px solid var(--pl-border);
    border-bottom: none;
    margin: 0 0 28px;
}

.pl-docs-rows:last-child {
    margin-bottom: 0;
}

.pl-docs-rows-head {
    margin: 0 !important;
    padding: 10px 16px;
    border-bottom: 1px solid var(--pl-border);
    background: #fafafa;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    color: var(--pl-muted-2);
}

.pl-legal-content.pl-docs-content a.pl-docs-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--pl-border);
    color: var(--pl-text);
    text-decoration: none;
    transition: background 0.15s ease;
}

.pl-legal-content.pl-docs-content a.pl-docs-row:hover {
    background: #fcfcfc;
    opacity: 1;
}

.pl-docs-row-main {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1;
}

.pl-docs-row-main strong {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
}

.pl-docs-row-main span {
    font-size: 13px;
    line-height: 1.45;
    color: var(--pl-muted);
}

.pl-docs-row-chevron {
    flex-shrink: 0;
    color: var(--pl-muted-2);
}

/* ── Buttons ── */

.pl-docs-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 20px;
}

.pl-legal-content.pl-docs-content a.pl-docs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid var(--pl-text);
    border-radius: 0;
    background: var(--pl-text);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.01em;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}

.pl-legal-content.pl-docs-content a.pl-docs-btn:hover {
    opacity: 1;
    background: #2a2a2a;
}

.pl-legal-content.pl-docs-content a.pl-docs-btn--ghost {
    border-color: var(--pl-border-strong);
    background: #fff;
    color: var(--pl-text);
}

.pl-legal-content.pl-docs-content a.pl-docs-btn--ghost:hover {
    background: #f5f5f5;
}

/* ── Help card ── */

.pl-docs-help-card {
    padding: 20px;
    border: 1px solid var(--pl-border);
    background: #fafafa;
}

.pl-docs-help-card-label {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted-2);
}

.pl-legal-content.pl-docs-content a.pl-docs-help-card-link {
    display: inline-block;
    font-size: 20px;
    font-weight: 500;
    letter-spacing: -0.02em;
    text-decoration: none;
    color: var(--pl-text);
}

.pl-docs-help-card-note {
    margin: 8px 0 0;
    font-size: 13px;
    color: var(--pl-muted);
}

/* ── Legacy content blocks ── */

.pl-docs-overview-list {
    margin: 0;
    padding-left: 1.25rem;
}

.pl-docs-overview-list li {
    margin-bottom: 8px;
}

.pl-docs-agent-card {
    margin: 20px 0;
    padding: 18px 20px;
    border: 1px solid var(--pl-border);
    border-radius: 0;
    background: #fafafa;
}

.pl-docs-agent-card .pl-docs-h3 {
    margin-top: 0;
}

.pl-docs-agent-card ul {
    margin: 0;
    padding-left: 1.2rem;
}

.pl-docs-agent-card li {
    margin-bottom: 6px;
}

.pl-docs-agent-card .pl-docs-tip {
    margin-top: 14px;
    margin-bottom: 0;
}

.pl-docs-role-card {
    margin: 0 0 12px;
    padding: 16px 18px;
    border: 1px solid var(--pl-border);
    border-radius: 0;
    background: #fafafa;
}

.pl-docs-role-card:last-child {
    margin-bottom: 0;
}

.pl-docs-role-card .pl-docs-h3 {
    margin: 0 0 6px;
}

.pl-docs-role-card p {
    margin: 0;
    font-size: 14px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-docs-flow {
    margin: 0;
    padding-left: 1.25rem;
}

.pl-docs-flow li {
    margin-bottom: 8px;
}

.pl-docs-steps {
    margin: 0 0 32px;
    padding: 0;
    list-style: none;
    counter-reset: pl-docs-step;
}

.pl-docs-steps > li {
    counter-increment: pl-docs-step;
    margin: 0 0 28px;
    padding-left: 44px;
    position: relative;
}

.pl-docs-steps > li::before {
    content: counter(pl-docs-step);
    position: absolute;
    left: 0;
    top: 2px;
    width: 28px;
    height: 28px;
    border-radius: 0;
    border: 1px solid var(--pl-border-strong);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--pl-text);
    background: #fff;
}

.pl-docs-steps h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-transform: none;
}

.pl-docs-steps p:last-child {
    margin-bottom: 0;
}

.pl-docs-code-window-wrap {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 16px 0 0;
}

.pl-docs-code-window-wrap .pl-code-window {
    max-width: 100%;
    min-width: 0;
}

.pl-docs-code {
    display: block;
    box-sizing: border-box;
    margin: 12px 0 0;
    padding: 14px 16px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border: 1px solid var(--pl-border);
    border-radius: 0;
    background: #f7f7f7;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
    line-height: 1.55;
    color: #1a1a1a;
    white-space: pre;
}

.pl-docs-tip {
    margin: 16px 0 0;
    padding: 12px 14px;
    border: 1px solid var(--pl-border);
    border-left: 3px solid var(--pl-text);
    border-radius: 0;
    background: #fafafa;
    font-size: 14px;
}

.pl-docs-tip strong {
    display: block;
    margin-bottom: 4px;
}

.pl-docs-table-wrap {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 12px 0 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.pl-docs-table {
    width: max-content;
    min-width: 100%;
    max-width: none;
    border-collapse: collapse;
    font-size: 14px;
}

.pl-docs-table th,
.pl-docs-table td {
    padding: 10px 12px;
    border: 1px solid var(--pl-border);
    text-align: left;
    vertical-align: top;
}

.pl-docs-table th {
    background: #fafafa;
    font-weight: 600;
}

.pl-docs-table code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
}

.pl-docs-perm-chart th:not(:first-child),
.pl-docs-perm-chart .pl-docs-perm-cell {
    width: 72px;
    text-align: center;
    white-space: nowrap;
}

.pl-docs-perm-yes {
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    color: #008556;
}

.pl-docs-perm-no {
    display: inline-block;
    font-size: 14px;
    line-height: 1;
    color: var(--pl-muted-2);
}

.pl-docs-perm-line {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-muted);
}

.pl-docs-perm-note {
    margin: 12px 0 0;
    max-width: 58ch;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-docs-copy-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin: 0 0 8px;
}

.pl-docs-copy-btn {
    padding: 10px 16px;
    border: 1px solid var(--pl-text);
    border-radius: 0;
    background: var(--pl-text);
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

.pl-docs-copy-btn:hover {
    background: #2a2a2a;
}

.pl-docs-copy-hint {
    font-size: 13px;
    color: var(--pl-muted);
}

.pl-legal-content code {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.92em;
    padding: 0.12em 0.35em;
    border-radius: 0;
    background: #f3f3f3;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.pl-legal-content .pl-code-window code {
    padding: 0;
    background: transparent;
    font-size: inherit;
    overflow-wrap: normal;
    word-break: normal;
}

body.pl-docs .pl-landing-v4-footer-col a {
    white-space: nowrap;
}

/* ── Mobile: stack, collapse the list into a toggle ── */

@media (max-width: 820px) {
    .pl-docs-app {
        display: flex;
        flex-direction: column;
        max-width: 100%;
        padding-bottom: 32px;
        overflow-x: clip;
    }

    .pl-docs-nav {
        position: relative;
        top: auto;
        width: 100%;
        height: auto;
        overflow: visible;
        padding: 16px var(--pl-docs-gutter) 0;
        border-right: none;
        border-bottom: 1px solid var(--pl-border);
    }

    .pl-docs-nav-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        width: 100%;
        margin: 0 0 12px;
        padding: 12px 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: var(--pl-text);
        font-family: inherit;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.3;
        text-align: left;
        cursor: pointer;
    }

    .pl-docs-nav-toggle:hover {
        background: transparent;
        opacity: 0.7;
    }

    .pl-docs-nav-toggle-text {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pl-docs-nav-toggle-chevron {
        display: block;
        width: 7px;
        height: 7px;
        margin-top: -2px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        flex-shrink: 0;
        transform: rotate(45deg);
        transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), margin-top 0.22s ease;
    }

    .pl-docs-nav.is-open .pl-docs-nav-toggle-chevron {
        margin-top: 2px;
        transform: rotate(225deg);
    }

    .pl-docs-nav-panel {
        display: none;
        padding-bottom: 16px;
    }

    .pl-docs-nav.is-open .pl-docs-nav-panel {
        display: flex;
    }

    .pl-docs-detail {
        width: 100%;
        max-width: 100%;
        padding: 24px var(--pl-docs-gutter) 48px;
        overflow-x: clip;
    }

    .pl-docs-page-title {
        font-size: 28px;
    }

    .pl-docs-main h1 {
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    body.pl-docs {
        --pl-docs-gutter: 20px;
        --pl-marketing-bar-gutter: clamp(16px, 5vw, 24px);
    }
}


/* ---- css/pl-product-pricing.css ---- */
.pl-product-pricing {
    --pl-pp-inset: var(--pl-time-inset, clamp(20px, 5vw, 48px));
    --pl-pp-max: var(--pl-time-max, 1120px);
    --pl-pp-font: var(--pl-font, "Helvetica Neue", Helvetica, Arial, sans-serif);
    padding: 72px var(--pl-pp-inset);
    background: var(--pl-surface, #f4f4f4);
    color: #0e0e0e;
    font-family: var(--pl-pp-font);
}

.pl-product-pricing__inner {
    max-width: var(--pl-pp-max);
    margin: 0 auto;
}

.pl-product-pricing__head {
    max-width: 42rem;
    margin: 0 0 36px;
}

.pl-product-pricing__head h2 {
    margin: 0 0 14px;
    font-size: clamp(36px, 5vw, 52px);
    font-weight: 700;
    letter-spacing: -0.04em;
    line-height: 1.1;
}

.pl-product-pricing__head p {
    margin: 0 0 18px;
    font-size: clamp(18px, 2vw, 22px);
    line-height: 1.4;
    color: #6f6f6f;
}

.pl-product-pricing__learn {
    display: inline;
    border: 0;
    padding: 0;
    margin: 0;
    background: none;
    color: #0e0e0e;
    font: inherit;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: -0.01em;
    text-decoration: underline;
    text-underline-offset: 4px;
    cursor: pointer;
}

.pl-product-pricing__learn:hover {
    color: #6f6f6f;
}

/* Left: plan copy · Right: price over stepper + Start — full width */
.pl-product-pricing__plan {
    --pl-pp-angle: 0deg;
    --pl-pp-h: 217;
    position: relative;
    z-index: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px 40px;
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 28px 32px;
    border: 2px solid transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        conic-gradient(
            from var(--pl-pp-angle),
            hsl(var(--pl-pp-h) 92% 54%) 0deg,
            hsl(var(--pl-pp-h) 80% 76%) 90deg,
            #0e0e0e 180deg,
            hsl(var(--pl-pp-h) 92% 54%) 270deg,
            hsl(var(--pl-pp-h) 92% 54%) 360deg
        ) border-box;
    animation:
        pl-pp-border-spin 8s linear infinite,
        pl-pp-hue-cycle 30s linear infinite;
}

@property --pl-pp-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

@property --pl-pp-h {
    syntax: "<number>";
    inherits: false;
    initial-value: 217;
}

@keyframes pl-pp-border-spin {
    to {
        --pl-pp-angle: 360deg;
    }
}

@keyframes pl-pp-hue-cycle {
    0%,
    26.666% {
        --pl-pp-h: 217;
    }
    33.333%,
    60% {
        --pl-pp-h: 334;
    }
    66.666%,
    93.333% {
        --pl-pp-h: 263;
    }
    100% {
        --pl-pp-h: 217;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-product-pricing__plan {
        animation: none;
        background:
            linear-gradient(#fff, #fff) padding-box,
            conic-gradient(from 135deg, #1774ff, #ff4d9d, #7c3aed, #1774ff) border-box;
    }
}

.pl-product-pricing__plan-copy h3 {
    margin: 0;
    font-size: clamp(22px, 2.4vw, 28px);
    font-weight: 700;
    letter-spacing: -0.03em;
}

.pl-product-pricing__plan-copy p {
    margin: 8px 0 0;
    font-size: 16px;
    line-height: 1.4;
    color: #6f6f6f;
}

.pl-product-pricing__plan-buy {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
}

.pl-product-pricing__plan-price {
    text-align: right;
}

.pl-product-pricing__price {
    margin: 0;
    font-size: clamp(40px, 4.5vw, 52px);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.pl-product-pricing__price [data-pl-pp-amt].is-tick {
    display: inline-block;
    animation: pl-pp-tick 0.32s ease;
}

@keyframes pl-pp-tick {
    from {
        transform: translateY(6px);
        opacity: 0.55;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.pl-product-pricing__price span[data-pl-pp-per],
.pl-product-pricing__price span:not([data-pl-pp-amt]) {
    font-size: 0.45em;
    letter-spacing: -0.03em;
    color: #6f6f6f;
}

.pl-product-pricing__per {
    margin: 8px 0 0;
    font-size: 14px;
    font-weight: 550;
    color: #6f6f6f;
}

.pl-product-pricing__controls {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
}

.pl-product-pricing__stepper {
    display: inline-flex;
    align-items: center;
    height: 48px;
    padding: 0 4px;
    border: 1px solid #dde3ec;
    background: #fff;
}

.pl-product-pricing__stepper-btn {
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    color: #0e0e0e;
    font-size: 20px;
    font-weight: 600;
    cursor: pointer;
}

.pl-product-pricing__stepper-btn:hover:not(:disabled) {
    background: rgba(23, 116, 255, 0.12);
}

.pl-product-pricing__stepper-btn:disabled {
    opacity: 0.35;
    cursor: default;
}

.pl-product-pricing__stepper-val {
    min-width: 9.5rem;
    padding: 0 8px;
    text-align: center;
    font-size: 14px;
    font-weight: 650;
}

.pl-product-pricing__cta {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
    min-height: 48px;
    height: 48px;
    margin-top: 0;
    padding: 0 22px;
    border-radius: 0;
    font: inherit;
    font-size: 16px;
    font-weight: 650;
    letter-spacing: -0.01em;
    text-decoration: none;
    box-sizing: border-box;
}

.pl-product-pricing__cta[hidden] {
    display: none !important;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta,
.pl-product-pricing a.pl-product-pricing__cta--sales {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    border: 1px solid #0e0e0e;
    background: #0e0e0e;
    color: #fff !important;
    --mx: 50%;
    --my: 50%;
    --pl-grow-flash: #2563eb;
    transition: color 0.12s ease, border-color 0.12s ease, background 0.12s ease;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: var(--pl-grow-flash);
    clip-path: circle(0% at var(--mx) var(--my));
    transition:
        clip-path 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.38s cubic-bezier(0.4, 0, 0.2, 1) 0.12s;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta.is-hot::before {
    clip-path: circle(160% at var(--mx) var(--my));
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta.is-ink::before {
    background-color: #0e0e0e;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta.is-leaving::before {
    clip-path: circle(0% at var(--mx) var(--my));
    background-color: var(--pl-grow-flash);
    transition:
        clip-path 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        background-color 0.2s ease;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta > * {
    position: relative;
    z-index: 1;
}

.pl-product-pricing a.pl-crew-btn.pl-pricing-cta:hover,
.pl-product-pricing a.pl-product-pricing__cta--sales:hover {
    background: #0e0e0e;
    border-color: #0e0e0e;
    color: #fff !important;
}

@media (prefers-reduced-motion: reduce) {
    .pl-product-pricing a.pl-crew-btn.pl-pricing-cta::before {
        transition: none;
    }

    .pl-product-pricing a.pl-crew-btn.pl-pricing-cta.is-hot::before {
        clip-path: none;
        background: #0e0e0e;
    }
}

.pl-product-pricing__cta--ghost {
    border: 1px solid #0e0e0e;
    background: #fff;
    color: #0e0e0e;
}

.pl-product-pricing__cta--ghost:hover {
    background: #f7f7f7;
    color: #0e0e0e;
}

@media (max-width: 900px) {
    .pl-product-pricing__plan {
        grid-template-columns: 1fr;
        gap: 20px;
        padding: 24px 22px;
    }

    .pl-product-pricing__plan-buy {
        align-items: stretch;
    }

    .pl-product-pricing__plan-price {
        text-align: left;
    }

    .pl-product-pricing__controls {
        justify-content: stretch;
    }

    .pl-product-pricing__stepper,
    .pl-product-pricing__controls .pl-product-pricing__cta {
        flex: 1 1 auto;
        width: 100%;
        justify-content: space-between;
    }
}

@media (max-width: 640px) {
    .pl-product-pricing {
        padding: 48px var(--pl-pp-inset);
    }
}

.pl-product-faq {
    --pl-pp-inset: var(--pl-time-inset, clamp(20px, 5vw, 48px));
    --pl-pp-max: var(--pl-time-max, 1120px);
    padding: 72px var(--pl-pp-inset);
    background: #fff;
    color: #0e0e0e;
    font-family: var(--pl-font, "Helvetica Neue", Helvetica, Arial, sans-serif);
    box-sizing: border-box;
}

/* Match .pl-product-pricing__inner width — no extra horizontal inset on the FAQ column. */
.pl-product-faq .pl-pricing-faq {
    max-width: var(--pl-pp-max);
    margin: 0 auto;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
}

.pl-product-faq .pl-pricing-faq h2 {
    margin: 0 0 20px;
    font-size: clamp(18px, 2.2vw, 22px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.12;
}

.pl-product-faq .pl-pricing-faq-list {
    border-top: 1px solid var(--line, #e2e2e2);
}

.pl-product-faq .pl-pricing-faq-item {
    border-bottom: 1px solid var(--line, #e2e2e2);
}

.pl-product-faq .pl-pricing-faq-item summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    padding: 20px 40px 20px 0;
    font-size: clamp(18px, 2vw, 20px);
    font-weight: 600;
    letter-spacing: -0.02em;
    line-height: 1.35;
}

.pl-product-faq .pl-pricing-faq-item summary::-webkit-details-marker {
    display: none;
}

.pl-product-faq .pl-pricing-faq-item summary::after {
    content: "";
    position: absolute;
    right: 4px;
    top: 50%;
    width: 8px;
    height: 8px;
    border-right: 1.5px solid #888;
    border-bottom: 1.5px solid #888;
    transform: translateY(-65%) rotate(45deg);
    transition: transform 0.2s ease;
}

.pl-product-faq .pl-pricing-faq-item[open] summary::after {
    transform: translateY(-20%) rotate(225deg);
}

.pl-product-faq .pl-pricing-faq-item p {
    margin: 0 0 20px;
    max-width: none;
    padding-right: 48px;
    font-size: clamp(16px, 1.6vw, 18px);
    line-height: 1.55;
    color: var(--muted, var(--pl-muted, #6f6f6f));
}

@media (max-width: 640px) {
    .pl-product-faq {
        padding: 48px var(--pl-pp-inset);
    }
}


/* ---- css/pl-get-started.css ---- */
/**
 * /get-started — full-viewport split layout with multi-step form.
 */
html {
    height: 100%;
}

body.pl-get-started {
    --pl-gs-bg: #ffffff;
    --pl-gs-text: #0e0e0e;
    --pl-gs-muted: #6f6f6f;
    --pl-gs-muted-2: #949494;
    --pl-gs-border: #e4e4e4;
    --pl-gs-accent: #1774ff;
    --pl-gs-visual: #0a0a0a;
    --pl-gs-font: "Helvetica Neue", Helvetica, Arial, sans-serif;

    margin: 0;
    min-height: 100%;
    min-height: 100dvh;
    background: var(--pl-gs-bg);
    color: var(--pl-gs-text);
    font-family: var(--pl-gs-font);
    -webkit-font-smoothing: antialiased;
}

.pl-get-started__shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    min-height: 100vh;
    min-height: 100dvh;
    width: 100vw;
    overflow: hidden;
}

/* ── Left visual panel ── */
.pl-get-started__visual {
    position: relative;
    overflow: hidden;
    background: var(--pl-gs-visual);
    color: #fff;
}

.pl-get-started__paths {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.pl-get-started__visual-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: clamp(32px, 6vh, 56px);
    height: 100%;
    padding: clamp(28px, 4vw, 48px);
}

.pl-get-started__visual-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.pl-get-started__panel-signin--mobile {
    display: none;
}

.pl-get-started__visual-logo {
    display: inline-flex;
    flex-shrink: 0;
}

.pl-get-started__visual-logo img {
    display: block;
    height: 24px;
    width: auto;
    max-width: 140px;
    object-fit: contain;
    filter: brightness(0) invert(1);
}

.pl-get-started__visual-copy {
    max-width: 28rem;
    padding-top: clamp(12px, 3vh, 32px);
}

.pl-get-started__visual-eyebrow {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.55);
}

.pl-get-started__visual-title {
    margin: 0 0 16px;
    font-size: clamp(32px, 4.5vw, 52px);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1.05;
}

.pl-get-started__path-hub {
    display: inline-block;
    vertical-align: -0.08em;
    width: 0.18em;
    height: 0.18em;
    margin-left: 0.02em;
    transform: translate(1px, -2px);
    border-radius: 50%;
    --pl-cta-feed-r: 255;
    --pl-cta-feed-g: 255;
    --pl-cta-feed-b: 255;
    background: rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 1);
    box-shadow: 0 0 6px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.55);
    position: relative;
    z-index: 2;
    flex-shrink: 0;
    transition: background 0.25s ease, box-shadow 0.25s ease;
}

.pl-get-started__path-hub.is-fed {
    animation: pl-get-started-hub-feed 0.85s ease-out;
}

@keyframes pl-get-started-hub-feed {
    0%, 100% {
        box-shadow: 0 0 6px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.55);
        transform: translate(1px, -2px) scale(1);
    }
    35% {
        box-shadow:
            0 0 10px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.95),
            0 0 28px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.7),
            0 0 48px rgba(var(--pl-cta-feed-r), var(--pl-cta-feed-g), var(--pl-cta-feed-b), 0.45);
        transform: translate(1px, -2px) scale(1.35);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-get-started__path-hub.is-fed {
        animation: none;
    }
}

.pl-get-started__visual-lead {
    margin: 0;
    font-size: clamp(15px, 1.6vw, 17px);
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.68);
}

/* ── Right form panel ── */
.pl-get-started__panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: auto;
    background: var(--pl-gs-bg);
}

.pl-get-started__panel-head {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    flex-shrink: 0;
    padding: clamp(20px, 3vw, 32px) clamp(24px, 5vw, 56px) 0;
}

.pl-get-started__panel-body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: clamp(24px, 8vh, 72px) clamp(24px, 5vw, 56px) clamp(24px, 4vh, 40px);
}

.pl-get-started__panel-signin {
    margin: 0;
    font-size: 13px;
    color: var(--pl-gs-muted);
}

.pl-get-started__panel-signin a {
    color: var(--pl-gs-text);
    font-weight: 600;
    text-decoration: none;
}

.pl-get-started__panel-signin a:hover {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.pl-get-started__form-wrap {
    width: min(100%, 520px);
    margin: 0 auto;
    box-sizing: border-box;
}

.pl-get-started__success {
    width: min(100%, 520px);
    margin: 0 auto;
    box-sizing: border-box;
}

.pl-get-started__form {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.pl-get-started__intro {
    margin-bottom: 28px;
    min-height: 7.5rem;
}

.pl-get-started__title {
    margin: 0 0 8px;
    font-size: clamp(26px, 3.5vw, 34px);
    font-weight: 500;
    letter-spacing: -0.02em;
    line-height: 1.15;
    min-height: 1.15em;
}

.pl-get-started__lead {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--pl-gs-muted);
    min-height: 3.1em;
}

.pl-get-started__eyebrow {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--pl-gs-muted);
}

/* Progress — percentage bar (never starts at 0) */
.pl-get-started__progress {
    margin-bottom: 28px;
}

.pl-get-started__progress-meta {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.pl-get-started__progress-label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-gs-muted-2);
}

.pl-get-started__progress-pct {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--pl-gs-text);
    font-variant-numeric: tabular-nums;
}

.pl-get-started__progress-track {
    height: 4px;
    background: #f0f0f0;
    border-radius: 999px;
    overflow: hidden;
}

.pl-get-started__progress-fill {
    display: block;
    height: 100%;
    background: var(--pl-gs-text);
    border-radius: inherit;
    transition:
        width 0.45s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.35s ease,
        box-shadow 0.35s ease;
}

.pl-get-started__progress.is-complete .pl-get-started__progress-pct {
    color: #16a34a;
    transition: color 0.35s ease;
}

.pl-get-started__progress.is-complete .pl-get-started__progress-fill {
    background: linear-gradient(90deg, #15803d 0%, #22c55e 55%, #4ade80 100%);
    background-size: 200% 100%;
    box-shadow:
        0 0 0 1px rgba(34, 197, 94, 0.2),
        0 0 14px rgba(34, 197, 94, 0.45);
    transition:
        width 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        background 0.35s ease,
        box-shadow 0.35s ease;
    animation: plGsProgressSucceed 0.85s ease-out;
}

@keyframes plGsProgressSucceed {
    0% {
        background-position: 100% 0;
        filter: brightness(1);
    }
    45% {
        background-position: 0% 0;
        filter: brightness(1.18);
    }
    100% {
        background-position: 0% 0;
        filter: brightness(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pl-get-started__progress.is-complete .pl-get-started__progress-fill {
        animation: none;
        transition: width 0.2s ease, background 0.2s ease;
    }
}

/* Form steps — one column, one step visible */
.pl-get-started__steps-viewport {
    width: 100%;
    min-height: 17.5rem;
}

.pl-get-started__step {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-height: 17.5rem;
}

.pl-get-started__step[hidden] {
    display: none;
}

.pl-get-started__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.pl-get-started__label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-gs-muted);
}

.pl-get-started__label--required::after {
    content: " *";
    color: #c2410c;
}

.pl-get-started__input,
.pl-get-started__select {
    width: 100%;
    padding: 14px 15px;
    border: 1px solid var(--pl-gs-border);
    border-radius: 8px;
    background: #fff;
    color: var(--pl-gs-text);
    font-family: inherit;
    font-size: 15px;
    line-height: 1.4;
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.pl-get-started__input::placeholder {
    color: var(--pl-gs-muted-2);
}

.pl-get-started__input:focus,
.pl-get-started__select:focus {
    outline: none;
    border-color: var(--pl-gs-text);
    box-shadow: inset 0 0 0 1px var(--pl-gs-text);
}

.pl-get-started__select-wrap {
    position: relative;
    min-width: 0;
}

.pl-get-started__select {
    appearance: none;
    -webkit-appearance: none;
    padding-right: 40px;
    cursor: pointer;
}

.pl-get-started__select-wrap::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 16px;
    width: 8px;
    height: 8px;
    border-right: 1.5px solid var(--pl-gs-muted);
    border-bottom: 1.5px solid var(--pl-gs-muted);
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none;
}

.pl-get-started__hint {
    margin: -4px 0 10px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--pl-gs-muted-2);
}

.pl-get-started__multi {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.pl-get-started__multi-option {
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
}

.pl-get-started__multi-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.pl-get-started__multi-option span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 7px 10px;
    border: 1px solid var(--pl-gs-border);
    border-radius: 999px;
    background: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    color: var(--pl-gs-muted);
    white-space: nowrap;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.pl-get-started__multi-option:hover span {
    border-color: #cfcfcf;
    color: var(--pl-gs-text);
}

.pl-get-started__multi-option input:focus-visible + span {
    outline: 2px solid var(--pl-gs-text);
    outline-offset: 2px;
}

.pl-get-started__multi-option input:checked + span {
    border-color: var(--pl-gs-text);
    background: var(--pl-gs-text);
    color: #fff;
    box-shadow: none;
}

.pl-get-started__review {
    padding: 18px 20px;
    border: 1px solid var(--pl-gs-border);
    border-radius: 10px;
    background: #fafafa;
}

.pl-get-started__review-label {
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-gs-muted);
}

.pl-get-started__review-list {
    margin: 0;
    display: grid;
    gap: 10px;
}

.pl-get-started__review-list div {
    display: grid;
    grid-template-columns: 88px 1fr;
    gap: 8px;
    align-items: baseline;
}

.pl-get-started__review-list dt {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--pl-gs-muted-2);
}

.pl-get-started__review-list dd {
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--pl-gs-text);
    word-break: break-word;
}

.pl-get-started__error {
    margin: 16px 0 0;
    padding: 12px 14px;
    border-left: 3px solid var(--pl-gs-text);
    background: #f5f5f5;
    font-size: 14px;
    line-height: 1.45;
}

.pl-get-started__error[hidden] {
    display: none;
}

.pl-get-started__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 28px;
    flex-shrink: 0;
}

.pl-get-started__btn[hidden] {
    display: none !important;
}

.pl-get-started__btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: 48px;
    padding: 14px 28px;
    border: none;
    border-radius: 0;
    background: var(--pl-gs-text);
    color: #fff;
    font-family: inherit;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    overflow: hidden;
    transition: background 0.2s ease, transform 0.15s ease;
}

a.pl-get-started__btn,
a.pl-get-started__btn:link,
a.pl-get-started__btn:visited,
a.pl-get-started__btn:hover,
a.pl-get-started__btn:active {
    color: #fff;
    text-decoration: none;
}

.pl-get-started__btn--primary {
    min-width: 148px;
}

.pl-get-started__btn--ghost {
    margin-right: auto;
    min-width: 96px;
    background: #fff;
    color: var(--pl-gs-text);
    border: 1px solid #d4d4d4;
}

.pl-get-started__btn::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--pl-gs-accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s cubic-bezier(0.22, 1, 0.36, 1);
}

.pl-get-started__btn:hover:not(:disabled) {
    background: #1a1a1a;
}

.pl-get-started__btn:hover:not(:disabled)::before {
    transform: scaleX(1);
}

.pl-get-started__btn:active:not(:disabled) {
    transform: scale(0.995);
}

.pl-get-started__btn:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.pl-get-started__btn--ghost::before {
    display: none;
}

.pl-get-started__btn--ghost:hover:not(:disabled) {
    background: #fafafa;
    border-color: var(--pl-gs-text);
}

.pl-get-started__powered {
    margin: 18px 0 0;
    text-align: left;
    font-size: 12px;
    line-height: 1.4;
    color: var(--pl-gs-muted-2);
}

.pl-get-started__powered-link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: inherit;
    text-decoration: none;
}

.pl-get-started__powered-link:hover {
    color: var(--pl-gs-text);
}

.pl-get-started__powered-link .pl-link-out-icon {
    display: block;
    flex-shrink: 0;
}

.pl-get-started__botcheck {
    position: absolute;
    left: -9999px;
    opacity: 0;
    pointer-events: none;
}

/* Success */
.pl-get-started__success[hidden] {
    display: none;
}

.pl-get-started__success-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
    border-radius: 50%;
    background: #0e0e0e;
    color: #fff;
}

.pl-get-started__success-title {
    margin: 0 0 10px;
    font-size: clamp(26px, 3.5vw, 32px);
    font-weight: 500;
    letter-spacing: -0.02em;
}

.pl-get-started__success-copy {
    margin: 0 0 28px;
    font-size: 15px;
    line-height: 1.6;
    color: var(--pl-gs-muted);
    max-width: 36em;
}

.pl-get-started__success .pl-get-started__btn {
    display: inline-flex;
    width: auto;
    min-width: 148px;
}

/* Mobile: stack with visual on top */
@media (max-width: 900px) {
    .pl-get-started__shell {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        min-height: 100dvh;
        width: 100%;
        overflow: auto;
    }

    .pl-get-started__visual {
        min-height: auto;
        padding-bottom: 8px;
    }

    .pl-get-started__visual-inner {
        justify-content: flex-start;
        gap: 20px;
        padding-bottom: 28px;
    }

    .pl-get-started__panel-signin--desktop {
        display: none;
    }

    .pl-get-started__panel-signin--mobile {
        display: block;
        margin: 0;
        font-size: 12px;
        color: rgba(255, 255, 255, 0.72);
        text-align: right;
        flex-shrink: 0;
    }

    .pl-get-started__panel-signin--mobile a {
        color: #fff;
    }

    .pl-get-started__panel-head {
        display: none;
    }

    .pl-get-started__visual-title {
        font-size: clamp(24px, 7vw, 32px);
    }

    .pl-get-started__panel-body {
        align-items: flex-start;
        padding-top: 28px;
        padding-bottom: 24px;
    }

    .pl-get-started__intro {
        margin-bottom: 14px;
        min-height: 0;
    }

    .pl-get-started__lead {
        min-height: 0;
    }

    .pl-get-started__progress {
        margin-bottom: 18px;
    }

    .pl-get-started__eyebrow {
        display: none;
    }

    .pl-get-started__panel {
        overflow: visible;
    }

    .pl-get-started__form-wrap,
    .pl-get-started__success {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .pl-get-started__actions {
        flex-wrap: wrap;
    }

    .pl-get-started__btn--ghost {
        margin-right: auto;
    }

    .pl-get-started__btn--primary {
        min-width: 148px;
    }
}


/* ---- css/pl-landing-calling.css ---- */
/* Calling marketing page — extends pl-landing-v4 */
.pl-landing-calling {
    --cl-blue: #1774ff;
    --cl-sky: #38bdf8;
    --cl-indigo: #6366f1;
}

.pl-landing-calling .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-calling .pl-landing-slide-inner,
.pl-landing-calling .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-calling .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-calling-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
}

.pl-landing-calling-blob--features {
    width: min(300px, 44vw);
    height: min(300px, 44vw);
    background: var(--cl-indigo);
    bottom: -8%;
    left: -6%;
    opacity: 0.14;
}

.pl-landing-calling .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(195deg, #eef4ff 0%, #fff 50%, #f6faff 100%);
}

.pl-landing-calling .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(160deg, #f1f7ff 0%, #fff 55%, #eef4ff 100%);
}

.pl-landing-calling .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(210deg, #fff 0%, #eef4ff 42%, #f6faff 100%);
}

.pl-landing-calling .pl-landing-slide[data-slide='4'] {
    background: linear-gradient(160deg, #f6faff 0%, #fff 55%, #eef4ff 100%);
}

.pl-landing-calling-hero-copy .pl-landing-headline--hero {
    max-width: 16ch;
}

.pl-landing-calling-hero-copy .pl-landing-sub--hero {
    max-width: 48ch;
}

.pl-landing-calling-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(20px, 3vh, 28px);
}

.pl-landing-calling-hero-actions .pl-landing-btn--ghost,
.pl-landing-calling .pl-landing-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--cl-blue);
    border: 1px solid rgba(23, 116, 255, 0.35);
    box-shadow: none;
}

.pl-landing-calling-hero-actions .pl-landing-btn--ghost:hover,
.pl-landing-calling .pl-landing-actions .pl-landing-btn--ghost:hover {
    background: rgba(23, 116, 255, 0.06);
    border-color: rgba(23, 116, 255, 0.5);
}

.pl-landing-calling-hero-visual {
    width: 100%;
    max-width: min(560px, 92vw);
    margin: 0 auto;
}

.pl-landing-calling-hero-visual img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.pl-landing-calling-perks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-calling-perk {
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-calling-perk h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--cl-blue);
}

.pl-landing-calling-perk p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-calling-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    padding: 0;
    list-style: none;
}

.pl-landing-calling-step {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-calling-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    color: var(--cl-blue);
    background: rgba(23, 116, 255, 0.1);
    border: 1px solid rgba(23, 116, 255, 0.2);
}

.pl-landing-calling-step h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-landing-calling-step p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-calling .pl-landing-v4-tabs--blue .pl-landing-v4-tabs-list button.is-active {
    background: rgba(23, 116, 255, 0.14);
    border-color: rgba(23, 116, 255, 0.35);
    color: var(--cl-blue);
}

@media (max-width: 1100px) {
    .pl-landing-calling-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .pl-landing-calling-perks,
    .pl-landing-calling-steps {
        grid-template-columns: 1fr;
    }

    .pl-landing-calling-hero-copy .pl-landing-headline--hero {
        max-width: none;
    }
}


/* ---- css/pl-landing-sms.css ---- */
/* Text messaging marketing page — extends pl-landing-v4 */
.pl-landing-sms {
    --sm-teal: #0d9488;
    --sm-cyan: #06b6d4;
    --sm-emerald: #10b981;
}

/* teal helpers not defined in base v4 */
.pl-landing-sms .pl-landing-eyebrow--teal { color: var(--sm-teal); }
.pl-landing-sms .pl-landing-v4-visual--teal { background: linear-gradient(135deg, #ccfbf1, #ecfeff); }

.pl-landing-sms .pl-landing-slide--teal {
    background: linear-gradient(165deg, #ecfdf9 0%, #f5fffd 55%, #fff 100%);
}

.pl-landing-sms .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-sms .pl-landing-slide-inner,
.pl-landing-sms .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-sms .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-sms-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
}

.pl-landing-sms-blob--features {
    width: min(300px, 44vw);
    height: min(300px, 44vw);
    background: var(--sm-emerald);
    bottom: -8%;
    left: -6%;
    opacity: 0.14;
}

.pl-landing-sms .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(195deg, #d9f7f0 0%, #fff 50%, #f4fffc 100%);
}

.pl-landing-sms .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(160deg, #f0fdfa 0%, #fff 55%, #ecfdf9 100%);
}

.pl-landing-sms .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(210deg, #fff 0%, #ecfdf9 42%, #f4fffc 100%);
}

.pl-landing-sms .pl-landing-slide[data-slide='4'] {
    background: linear-gradient(160deg, #f4fffc 0%, #fff 55%, #ecfdf9 100%);
}

.pl-landing-sms-hero-copy .pl-landing-headline--hero {
    max-width: 14ch;
}

.pl-landing-sms-hero-copy .pl-landing-sub--hero {
    max-width: 48ch;
}

.pl-landing-sms-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(20px, 3vh, 28px);
}

.pl-landing-sms-hero-actions .pl-landing-btn--ghost,
.pl-landing-sms .pl-landing-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--sm-teal);
    border: 1px solid rgba(13, 148, 136, 0.35);
    box-shadow: none;
}

.pl-landing-sms-hero-actions .pl-landing-btn--ghost:hover,
.pl-landing-sms .pl-landing-actions .pl-landing-btn--ghost:hover {
    background: rgba(13, 148, 136, 0.06);
    border-color: rgba(13, 148, 136, 0.5);
}

.pl-landing-sms-hero-visual {
    width: 100%;
    max-width: min(560px, 92vw);
    margin: 0 auto;
}

.pl-landing-sms-hero-visual img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.pl-landing-sms-perks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-sms-perk {
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-sms-perk h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--sm-teal);
}

.pl-landing-sms-perk p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

/* Conversation showcase */
.pl-landing-sms-threads {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    align-items: stretch;
}

.pl-landing-sms-thread {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
    border-top: 3px solid var(--sm-teal);
}

.pl-landing-sms-thread-label {
    margin: 0;
    padding: 14px 16px 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

.pl-landing-sms-thread-body {
    padding: 14px 16px 18px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pl-landing-sms-bubble {
    max-width: 82%;
    padding: 9px 13px;
    font-size: 12.5px;
    line-height: 1.4;
    border-radius: 16px;
}

.pl-landing-sms-bubble--in {
    align-self: flex-start;
    background: #f1f5f4;
    color: var(--pl-text);
    border-bottom-left-radius: 5px;
}

.pl-landing-sms-bubble--out {
    align-self: flex-end;
    background: var(--sm-teal);
    color: #fff;
    border-bottom-right-radius: 5px;
}

.pl-landing-sms-photo {
    align-self: flex-start;
    width: 60%;
    height: 64px;
    border-radius: 12px;
    background: linear-gradient(135deg, #99f6e4, #67e8f9);
    border: 1px solid rgba(13, 148, 136, 0.18);
}

.pl-landing-sms-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    padding: 0;
    list-style: none;
}

.pl-landing-sms-step {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-sms-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    color: var(--sm-teal);
    background: rgba(13, 148, 136, 0.1);
    border: 1px solid rgba(13, 148, 136, 0.2);
}

.pl-landing-sms-step h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-landing-sms-step p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-sms .pl-landing-v4-tabs--teal .pl-landing-v4-tabs-list button.is-active {
    background: rgba(13, 148, 136, 0.14);
    border-color: rgba(13, 148, 136, 0.35);
    color: var(--sm-teal);
}

@media (max-width: 1100px) {
    .pl-landing-sms-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .pl-landing-sms-perks,
    .pl-landing-sms-threads,
    .pl-landing-sms-steps {
        grid-template-columns: 1fr;
    }

    .pl-landing-sms-hero-copy .pl-landing-headline--hero {
        max-width: none;
    }
}


/* ---- css/pl-landing-email.css ---- */
/* Email marketing page — extends pl-landing-v4 */
.pl-landing-email {
    --em-coral: #ff5c45;
    --em-peach: #ff8a65;
    --em-rose: #fb7185;
}

.pl-landing-email .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-email .pl-landing-slide-inner,
.pl-landing-email .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-email .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-email-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
}

.pl-landing-email-blob--features {
    width: min(300px, 44vw);
    height: min(300px, 44vw);
    background: var(--em-rose);
    bottom: -8%;
    left: -6%;
    opacity: 0.14;
}

.pl-landing-email .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(195deg, #fff5f0 0%, #fff 50%, #fffaf8 100%);
}

.pl-landing-email .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(160deg, #fff4f0 0%, #fff 55%, #fff5f0 100%);
}

.pl-landing-email .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(210deg, #fff 0%, #fff4f0 42%, #fffaf8 100%);
}

.pl-landing-email-hero-copy .pl-landing-headline--hero {
    max-width: 16ch;
}

.pl-landing-email-hero-copy .pl-landing-sub--hero {
    max-width: 48ch;
}

.pl-landing-email-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(20px, 3vh, 28px);
}

.pl-landing-email-hero-actions .pl-landing-btn--ghost,
.pl-landing-email .pl-landing-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--em-coral);
    border: 1px solid rgba(255, 92, 69, 0.35);
    box-shadow: none;
}

.pl-landing-email-hero-actions .pl-landing-btn--ghost:hover,
.pl-landing-email .pl-landing-actions .pl-landing-btn--ghost:hover {
    background: rgba(255, 92, 69, 0.06);
    border-color: rgba(255, 92, 69, 0.5);
}

.pl-landing-email-hero-visual {
    width: 100%;
    max-width: min(640px, 92vw);
    margin: 0 auto;
}

.pl-landing-email-hero-visual img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.pl-landing-email-perks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-email-perk {
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-email-perk h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--em-coral);
}

.pl-landing-email-perk p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-email-previews {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    align-items: stretch;
}

.pl-landing-email-preview {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.pl-landing-email-preview--promo {
    border-top: 3px solid var(--em-coral);
}

.pl-landing-email-preview--newsletter {
    border-top: 3px solid var(--em-peach);
}

.pl-landing-email-preview--update {
    border-top: 3px solid var(--em-rose);
}

.pl-landing-email-preview-label {
    margin: 0;
    padding: 14px 16px 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

.pl-landing-email-preview-body {
    padding: 12px 16px 16px;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pl-landing-email-preview-subject {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--pl-text);
    line-height: 1.35;
}

.pl-landing-email-preview-snippet {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--pl-muted);
}

.pl-landing-email-preview-block {
    height: 8px;
    border-radius: 4px;
    background: #f3f4f6;
}

.pl-landing-email-preview-block--accent {
    background: linear-gradient(90deg, rgba(255, 92, 69, 0.35), rgba(255, 138, 101, 0.2));
}

.pl-landing-email-preview-block--short {
    width: 62%;
}

.pl-landing-email-preview-cta {
    display: inline-block;
    align-self: flex-start;
    margin-top: auto;
    padding: 8px 14px;
    font-size: 11px;
    font-weight: 600;
    border-radius: 999px;
    background: var(--em-coral);
    color: #fff;
}

.pl-landing-email-preview--newsletter .pl-landing-email-preview-cta {
    background: var(--em-peach);
    border-radius: 6px;
}

.pl-landing-email-preview--update .pl-landing-email-preview-cta {
    background: #111;
}

.pl-landing-email-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    padding: 0;
    list-style: none;
}

.pl-landing-email-step {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-email-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    color: var(--em-coral);
    background: rgba(255, 92, 69, 0.1);
    border: 1px solid rgba(255, 92, 69, 0.2);
}

.pl-landing-email-step h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-landing-email-step p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

@media (max-width: 900px) {
    .pl-landing-email-previews,
    .pl-landing-email-perks,
    .pl-landing-email-steps {
        grid-template-columns: 1fr;
    }

    .pl-landing-email-hero-copy .pl-landing-headline--hero {
        max-width: none;
    }
}

@media (max-width: 1100px) {
    .pl-landing-email-steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* ---- css/pl-landing-forms.css ---- */
/* Forms marketing page — extends pl-landing-v4 */
.pl-landing-forms {
    --fm-violet: #7c3aed;
    --fm-indigo: #6366f1;
    --fm-fuchsia: #d946ef;
    --fm-green: #10b981;
}

.pl-landing-forms .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-forms .pl-landing-slide-inner,
.pl-landing-forms .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-forms .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-forms-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
}

.pl-landing-forms-blob--custom {
    width: min(300px, 44vw);
    height: min(300px, 44vw);
    background: var(--fm-violet);
    bottom: -8%;
    left: -6%;
    opacity: 0.14;
}

.pl-landing-forms .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(195deg, #ede9fe 0%, #fff 50%, #fdf4ff 100%);
}

.pl-landing-forms .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(160deg, #faf5ff 0%, #fff 55%, #f5f3ff 100%);
}

.pl-landing-forms .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(210deg, #fff 0%, #f5f3ff 42%, #fdf4ff 100%);
}

.pl-landing-forms-hero-copy .pl-landing-headline--hero {
    max-width: 14ch;
}

.pl-landing-forms-hero-copy .pl-landing-sub--hero {
    max-width: 48ch;
}

.pl-landing-forms-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
    margin-top: clamp(20px, 3vh, 28px);
}

.pl-landing-forms-hero-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--fm-violet);
    border: 1px solid rgba(124, 58, 237, 0.35);
    box-shadow: none;
}

.pl-landing-forms-hero-actions .pl-landing-btn--ghost:hover {
    background: rgba(124, 58, 237, 0.06);
    border-color: rgba(124, 58, 237, 0.5);
}

.pl-landing-forms .pl-landing-actions .pl-landing-btn--ghost {
    background: transparent;
    color: var(--fm-violet);
    border: 1px solid rgba(124, 58, 237, 0.35);
    box-shadow: none;
}

.pl-landing-forms .pl-landing-actions .pl-landing-btn--ghost:hover {
    background: rgba(124, 58, 237, 0.06);
    border-color: rgba(124, 58, 237, 0.5);
}

.pl-landing-forms-hero-visual {
    width: 100%;
    max-width: min(560px, 92vw);
    margin: 0 auto;
}

.pl-landing-forms-hero-visual .pl-code-panels {
    position: relative;
    height: 22em;
    min-height: 22em;
    max-height: 22em;
    overflow: hidden;
}

.pl-landing-forms-hero-visual .pl-code-panel {
    position: absolute;
    inset: 0;
    margin: 0;
    min-height: 0;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.pl-landing-forms-hero-visual .pl-code-panel[hidden] {
    display: none;
}

.pl-landing-forms .pl-code-tabs-list button.is-active {
    background: rgba(124, 58, 237, 0.18);
    border-color: rgba(124, 58, 237, 0.35);
}

.pl-landing-forms .pl-code-window ::selection,
.pl-landing-forms .pl-code-panel ::selection {
    background: rgba(124, 58, 237, 0.45);
}

.pl-landing-forms-custom-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    align-items: stretch;
}

.pl-landing-forms-custom-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.04);
}

.pl-landing-forms-custom-card--minimal {
    border-top: 3px solid #111;
}

.pl-landing-forms-custom-card--bold {
    border-top: 3px solid var(--fm-violet);
}

.pl-landing-forms-custom-card--soft {
    border-top: 3px solid var(--fm-indigo);
}

.pl-landing-forms-custom-card-body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 16px 18px 18px;
}

.pl-landing-forms-style-label {
    margin: 0 0 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--pl-muted);
}

.pl-landing-forms-demo {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 0;
    flex: 1;
}

.pl-landing-forms-demo label {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--pl-muted);
}

.pl-landing-forms-demo input,
.pl-landing-forms-demo textarea {
    width: 100%;
    box-sizing: border-box;
    font: inherit;
    border-radius: 8px;
    border: 1px solid var(--pl-border);
    padding: 10px 12px;
    background: #fff;
}

.pl-landing-forms-demo textarea {
    min-height: 72px;
    resize: vertical;
}

.pl-landing-forms-demo button {
    margin-top: auto;
    font: inherit;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    padding: 11px 16px;
    cursor: default;
}

.pl-landing-forms-demo--minimal input,
.pl-landing-forms-demo--minimal textarea {
    border: none;
    border-bottom: 1px solid #e5e7eb;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
}

.pl-landing-forms-demo--minimal button {
    background: #111;
    color: #fff;
    border-radius: 999px;
}

.pl-landing-forms-demo--bold {
    gap: 12px;
}

.pl-landing-forms-demo--bold input,
.pl-landing-forms-demo--bold textarea {
    border: 2px solid #7c3aed;
    border-radius: 0;
}

.pl-landing-forms-demo--bold button {
    background: linear-gradient(135deg, #7c3aed, #d946ef);
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 12px;
}

.pl-landing-forms-demo--soft {
    gap: 14px;
}

.pl-landing-forms-demo--soft textarea {
    min-height: 108px;
}

.pl-landing-forms-demo--soft input,
.pl-landing-forms-demo--soft textarea {
    border: none;
    background: #f3f4f6;
    border-radius: 12px;
}

.pl-landing-forms-demo--soft button {
    background: #6366f1;
    color: #fff;
    border-radius: 12px;
}

.pl-landing-forms-perks {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-forms-perk {
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-forms-perk h3 {
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
    color: var(--fm-violet);
}

.pl-landing-forms-perk p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-forms-steps {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
    margin-top: clamp(28px, 4vh, 40px);
    padding: 0;
    list-style: none;
}

.pl-landing-forms-step {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
}

.pl-landing-forms-step-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    color: var(--fm-violet);
    background: rgba(124, 58, 237, 0.1);
    border: 1px solid rgba(124, 58, 237, 0.2);
}

.pl-landing-forms-step h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-landing-forms-step p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

@media (max-width: 900px) {
    .pl-landing-forms-custom-grid,
    .pl-landing-forms-perks,
    .pl-landing-forms-steps {
        grid-template-columns: 1fr;
    }

    .pl-landing-forms-hero-copy .pl-landing-headline--hero {
        max-width: none;
    }
}


/* ---- css/pl-landing-websites.css ---- */
/* Websites marketing page — extends pl-landing-v4 */
.pl-landing-websites {
    --ws-indigo: #6366f1;
    --ws-violet: #8b5cf6;
    --ws-orange: #ff8a4c;
    --ws-sky: #38bdf8;
}

.pl-landing-websites .pl-landing-slide:not(.pl-landing-slide--cta) {
    position: relative;
    overflow: hidden;
}

.pl-landing-websites .pl-landing-slide-inner,
.pl-landing-websites .pl-landing-v4-trusted {
    position: relative;
    z-index: 1;
}

.pl-landing-websites .pl-landing-slide--hero {
    background: #fff;
}

.pl-landing-websites-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    pointer-events: none;
    z-index: 0;
}

.pl-landing-websites-blob--orange {
    width: min(260px, 40vw);
    height: min(260px, 40vw);
    background: var(--ws-orange);
    bottom: 6%;
    right: 14%;
    opacity: 0.22;
}

.pl-landing-websites-blob--speed {
    width: min(340px, 50vw);
    height: min(340px, 50vw);
    background: var(--ws-sky);
    top: -8%;
    right: -6%;
    opacity: 0.18;
}

.pl-landing-websites-blob--dev {
    width: min(320px, 48vw);
    height: min(320px, 48vw);
    background: var(--ws-violet);
    bottom: -10%;
    left: -8%;
    opacity: 0.16;
}

.pl-landing-websites-blob--workflow {
    width: min(280px, 42vw);
    height: min(280px, 42vw);
    background: var(--ws-indigo);
    top: 20%;
    right: -4%;
    opacity: 0.14;
}

.pl-landing-websites-blob--infra {
    width: min(360px, 52vw);
    height: min(360px, 52vw);
    background: #a78bfa;
    top: -14%;
    left: 38%;
    opacity: 0.15;
}

/* Section gradients — varied angles and stop positions */
.pl-landing-websites .pl-landing-slide[data-slide='1'] {
    background: linear-gradient(215deg, #fff 0%, #f5f3ff 38%, #fff4f0 100%);
}

.pl-landing-websites .pl-landing-slide[data-slide='2'] {
    background: linear-gradient(145deg, #faf5ff 0%, #fff 52%, #fff7ed 100%);
}

.pl-landing-websites .pl-landing-slide[data-slide='3'] {
    background: linear-gradient(195deg, #eef2ff 0%, #fff 55%, #fdf4ff 100%);
}

.pl-landing-websites .pl-landing-slide[data-slide='4'] {
    background: linear-gradient(170deg, #f8fafc 0%, #ede9fe 42%, #fff 100%);
}

.pl-landing-websites-hero-media {
    max-width: min(920px, 80vw);
    border: none;
    background: transparent;
}

.pl-landing-websites-hero-media video {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: none;
    transform: none;
    -webkit-transform: none;
    border-radius: 12px;
    border: none;
    box-shadow: none;
}

.pl-landing-websites-hero-media img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
    border: 1px solid var(--pl-border);
    box-shadow: none;
}

.pl-landing-websites-caption {
    margin: clamp(8px, 1.5vh, 16px) 0 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--pl-muted);
    text-align: center;
}

.pl-landing-websites .pl-landing-v4-visual--sites.pl-landing-v4-visual--code {
    padding: 10px;
    background: linear-gradient(145deg, rgba(99, 102, 241, 0.12), rgba(255, 255, 255, 0.92));
}

.pl-landing-websites .pl-landing-v4-visual--code .pl-code-window {
    box-shadow: none;
}

.pl-landing-websites .pl-code-tabs-list button.is-active {
    background: rgba(99, 102, 241, 0.18);
    border-color: rgba(99, 102, 241, 0.35);
}

.pl-landing-websites .pl-code-window ::selection,
.pl-landing-websites .pl-code-panel ::selection {
    background: rgba(99, 102, 241, 0.45);
}

.pl-landing-websites .pl-code-panels {
    position: relative;
    height: 24em;
    min-height: 24em;
    max-height: 24em;
    overflow: hidden;
}

.pl-landing-websites .pl-code-panel {
    position: absolute;
    inset: 0;
    margin: 0;
    min-height: 0;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.pl-landing-websites .pl-code-panel[hidden] {
    display: none;
}

@media (min-width: 900px) {
    .pl-landing-websites .pl-code-panels {
        height: 24em;
        min-height: 24em;
        max-height: 24em;
    }

    .pl-landing-websites .pl-code-panel {
        min-height: 0;
    }
}

.pl-landing-websites-stack-wrap {
    margin-top: clamp(28px, 4vh, 40px);
}

.pl-landing-websites-infra .pl-landing-sub {
    max-width: 52ch;
}

.pl-landing-websites-powered {
    margin: 0 0 16px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--v4-sites);
    text-align: left;
}

.pl-landing-websites-infra .pl-landing-websites-stack-card {
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 0;
    box-shadow: none;
}

.pl-landing-websites-infra .pl-landing-websites-stack-card h3 {
    color: var(--v4-sites);
}

.pl-landing-websites-stack {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(16px, 2.5vw, 24px);
}

.pl-landing-websites-stack-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: clamp(18px, 2.5vw, 24px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 14px;
    box-shadow: none;
}

.pl-landing-websites-stack-card h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: -0.02em;
}

.pl-landing-websites-stack-card p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--pl-muted);
}

.pl-landing-websites-stat-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(12px, 2vw, 20px);
    margin-top: clamp(20px, 3vh, 32px);
}

.pl-landing-websites-stat {
    padding: clamp(16px, 2.5vw, 22px);
    background: #fff;
    border: 1px solid var(--pl-border);
    border-radius: 12px;
    text-align: center;
}

.pl-landing-websites-stat strong {
    display: block;
    font-size: clamp(28px, 4vw, 40px);
    font-weight: 600;
    letter-spacing: -0.03em;
    color: var(--v4-green);
    line-height: 1.1;
}

.pl-landing-websites-stat span {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: var(--pl-muted);
    line-height: 1.4;
}

@media (max-width: 900px) {
    .pl-landing-websites-caption {
        display: none;
    }

    .pl-landing-websites-stack,
    .pl-landing-websites-stat-row {
        grid-template-columns: 1fr;
    }
}


/* ---- css/pl-time-anims/forms-styles.css ---- */
/**
 * Custom form style variants bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-forms-styles-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 14px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-forms-styles-anim {
    --forms-styles-cycle: 9s;
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}

body.pl-landing-time .pl-forms-styles-anim__card {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    padding: 14px 16px 16px;
    border-radius: 12px 12px 0 0;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    background: #fff;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.04),
        0 12px 28px rgba(0, 0, 0, 0.06);
    opacity: 0;
    transform: translateY(10px) scale(0.98);
}

body.pl-landing-time .pl-forms-styles-anim__card--minimal {
    animation: plFormsStyleMinimal var(--forms-styles-cycle) ease-in-out 1 forwards;
    border-top: 3px solid #111;
}

body.pl-landing-time .pl-forms-styles-anim__card--bold {
    animation: plFormsStyleBold var(--forms-styles-cycle) ease-in-out 1 forwards;
    border-top: 3px solid #7c3aed;
}

body.pl-landing-time .pl-forms-styles-anim__card--soft {
    animation: plFormsStyleSoft var(--forms-styles-cycle) ease-in-out 1 forwards;
    border-top: 3px solid #6366f1;
}

body.pl-landing-time .pl-forms-styles-anim__label {
    margin: 0 0 10px;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6b7280;
}

body.pl-landing-time .pl-forms-styles-anim__form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

body.pl-landing-time .pl-forms-styles-anim__field label {
    display: block;
    font-size: 8px;
    font-weight: 600;
    color: #6b7280;
    margin-bottom: 4px;
}

body.pl-landing-time .pl-forms-styles-anim__field input,
body.pl-landing-time .pl-forms-styles-anim__field textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    font: inherit;
    font-size: 9px;
    padding: 7px 9px;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #fff;
    color: #111;
}

body.pl-landing-time .pl-forms-styles-anim__card--minimal .pl-forms-styles-anim__field input {
    border: none;
    border-bottom: 1px solid #e5e7eb;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
    background: transparent;
}

body.pl-landing-time .pl-forms-styles-anim__card--bold .pl-forms-styles-anim__field input {
    border: 2px solid #7c3aed;
    border-radius: 0;
}

body.pl-landing-time .pl-forms-styles-anim__card--soft .pl-forms-styles-anim__field textarea {
    min-height: 52px;
    border: none;
    background: #f3f4f6;
    border-radius: 10px;
    resize: none;
}

body.pl-landing-time .pl-forms-styles-anim__btn {
    margin-top: auto;
    align-self: flex-start;
    padding: 7px 14px;
    border: none;
    border-radius: 8px;
    font-size: 9px;
    font-weight: 600;
    color: #fff;
    cursor: default;
}

body.pl-landing-time .pl-forms-styles-anim__card--minimal .pl-forms-styles-anim__btn {
    background: #111;
    border-radius: 999px;
}

body.pl-landing-time .pl-forms-styles-anim__card--bold .pl-forms-styles-anim__btn {
    background: linear-gradient(135deg, #7c3aed, #d946ef);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

body.pl-landing-time .pl-forms-styles-anim__card--soft .pl-forms-styles-anim__btn {
    background: #6366f1;
    border-radius: 10px;
}

body.pl-landing-time .pl-forms-styles-anim__tags {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    opacity: 0;
    transform: translateY(4px);
    animation: plFormsStyleTags var(--forms-styles-cycle) ease-out 1 forwards;
    pointer-events: none;
}

body.pl-landing-time .pl-forms-styles-anim__tags span {
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.05);
    font-size: 7px;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #4b5563;
}

@keyframes plFormsStyleMinimal {
    0%, 4% { opacity: 0; transform: translateY(10px) scale(0.98); }
    8%, 30% { opacity: 1; transform: translateY(0) scale(1); }
    34%, 100% { opacity: 0; transform: translateY(-8px) scale(0.98); }
}

@keyframes plFormsStyleBold {
    0%, 30% { opacity: 0; transform: translateY(10px) scale(0.98); }
    34%, 63% { opacity: 1; transform: translateY(0) scale(1); }
    67%, 100% { opacity: 0; transform: translateY(-8px) scale(0.98); }
}

@keyframes plFormsStyleSoft {
    0%, 63% { opacity: 0; transform: translateY(10px) scale(0.98); }
    67%, 100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes plFormsStyleTags {
    0%, 72% { opacity: 0; transform: translateY(4px); }
    78%, 100% { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-forms-styles-anim__card {
        animation: none !important;
        opacity: 0;
        transform: none;
    }

    body.pl-landing-time .pl-forms-styles-anim__card--minimal {
        opacity: 1;
    }

    body.pl-landing-time .pl-forms-styles-anim__tags {
        animation: none !important;
        opacity: 1;
        transform: none;
    }
}


/* ---- css/pl-time-anims/voice-wide.css ---- */
/**
 * Team communications bento — dashboard-style thread list + chat + typing indicator.
 * Pattern mirrors the recording bento (two-column mock dash).
 */
body.pl-landing-time .pl-time-voice-wide-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 12px 10px 0;
    display: flex;
    align-items: stretch;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-team-comms-anim {
    --team-comms-cycle: 10s;
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.15fr);
    gap: 8px;
    width: 100%;
    height: 100%;
    min-height: 0;
    align-items: stretch;
}

/* —— Left: thread list —— */
body.pl-landing-time .pl-team-comms-anim__list {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 9px 8px 0;
    border-radius: 12px 12px 0 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(8px);
    animation: plTeamCommsListIn var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-team-comms-anim__list-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    padding: 0 2px 6px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex: 0 0 auto;
}

body.pl-landing-time .pl-team-comms-anim__list-head strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-team-comms-anim__rows-wrap {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: hidden;
    mask-image: linear-gradient(to bottom, #000 0%, #000 78%, transparent 100%);
}

body.pl-landing-time .pl-team-comms-anim__rows {
    list-style: none;
    margin: 0;
    padding: 0 0 12px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.pl-landing-time .pl-team-comms-anim__row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    padding: 5px 6px;
    border-radius: 8px;
    border: 1px solid transparent;
    background: transparent;
}

body.pl-landing-time .pl-team-comms-anim__row.is-unread .pl-team-comms-anim__row-preview {
    color: #111;
    font-weight: 600;
    animation: plTeamCommsUnreadClear var(--team-comms-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__row--new {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
    margin: 0;
    animation:
        plTeamCommsRowIn var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards,
        plTeamCommsRowSelect var(--team-comms-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__av {
    position: relative;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #fff;
    background: var(--pl-team-fill, #6b7280);
    flex-shrink: 0;
}

body.pl-landing-time .pl-team-comms-anim__av--sam { --pl-team-fill: #3373d1; }
body.pl-landing-time .pl-team-comms-anim__av--alex { --pl-team-fill: #0d9488; }
body.pl-landing-time .pl-team-comms-anim__av--jordan { --pl-team-fill: #7c3aed; }
body.pl-landing-time .pl-team-comms-anim__av--cust { --pl-team-fill: #111; }
body.pl-landing-time .pl-team-comms-anim__av--muted {
    background: #e5e7eb;
    color: #6b7280;
}

body.pl-landing-time .pl-team-comms-anim__row-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-team-comms-anim__row-title {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

body.pl-landing-time .pl-team-comms-anim__row-title strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-team-comms-anim__badge {
    flex-shrink: 0;
    padding: 1px 4px;
    border-radius: 999px;
    background: #ecfdf5;
    color: #047857;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

body.pl-landing-time .pl-team-comms-anim__row-preview {
    font-size: 8px;
    font-weight: 500;
    color: #9ca3af;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-style: normal;
}

body.pl-landing-time .pl-team-comms-anim__row-time {
    font-size: 8px;
    font-weight: 600;
    color: #9ca3af;
    align-self: start;
    padding-top: 1px;
}

body.pl-landing-time .pl-team-comms-anim__dot {
    position: absolute;
    top: -1px;
    right: -1px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #007aff;
    border: 1.5px solid #fff;
    opacity: 0;
}

body.pl-landing-time .pl-team-comms-anim__row--new .pl-team-comms-anim__dot {
    animation: plTeamCommsDotIn var(--team-comms-cycle) ease-out 1 forwards;
}

/* —— Right: open thread —— */
body.pl-landing-time .pl-team-comms-anim__thread {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 9px 10px 10px;
    border-radius: 12px 12px 0 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-bottom: none;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(8px);
    animation: plTeamCommsThreadIn var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    overflow: hidden;
}

body.pl-landing-time .pl-team-comms-anim__thread-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    flex: 0 0 auto;
}

body.pl-landing-time .pl-team-comms-anim__thread-head-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-team-comms-anim__thread-head-copy strong {
    font-size: 11px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: #111;
}

body.pl-landing-time .pl-team-comms-anim__thread-head-copy em {
    font-style: normal;
    font-size: 8px;
    font-weight: 600;
    color: #9ca3af;
}

/* Prevent iOS Safari “I can call” blue link on demo phone numbers */
body.pl-landing-time .pl-team-comms-anim a[x-apple-data-detectors],
body.pl-landing-time .pl-team-comms-anim a[href^="tel:"] {
    color: inherit !important;
    text-decoration: none !important;
    font-weight: inherit !important;
    font-style: inherit !important;
    pointer-events: none;
}

body.pl-landing-time .pl-team-comms-anim__msgs {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 0;
    overflow: hidden;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row {
    display: flex;
    align-items: flex-end;
    gap: 5px;
    max-width: 92%;
    margin-bottom: 6px;
    opacity: 0;
    transform: translateY(6px);
}

body.pl-landing-time .pl-team-comms-anim__bubble-row.is-out {
    align-self: flex-end;
    flex-direction: row;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row.is-in {
    align-self: flex-start;
}

body.pl-landing-time .pl-team-comms-anim__actor-av {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #fff;
    background: var(--pl-team-fill, #6b7280);
    line-height: 1;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row--1 {
    animation: plTeamCommsBubbleIn var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
    animation-delay: 0s;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row--2 {
    animation: plTeamCommsBubbleIn2 var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row--3 {
    animation: plTeamCommsBubbleIn3 var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row--4 {
    animation: plTeamCommsBubbleIn4 var(--team-comms-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__tail {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex: 0 0 auto;
    animation: plTeamCommsTailSlot var(--team-comms-cycle) ease-in-out 1 forwards;
}

/* Typing overlays the same slot Alex’s reply will use — no extra gap */
body.pl-landing-time .pl-team-comms-anim__typing {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 28px;
    font-size: 9px;
    line-height: 1.3;
    color: #6b7280;
    opacity: 0;
    pointer-events: none;
    animation: plTeamCommsTyping var(--team-comms-cycle) ease-in-out 1 forwards;
}

body.pl-landing-time .pl-team-comms-anim__typing .pl-team-comms-anim__actor-av {
    width: 18px;
    height: 18px;
    font-size: 7px;
}

body.pl-landing-time .pl-team-comms-anim__typing-label {
    min-width: 0;
    font-weight: 500;
}

body.pl-landing-time .pl-team-comms-anim__bubble {
    padding: 7px 10px;
    border-radius: 14px;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.4;
    background: #eef2ff;
    color: #1e1e1e;
    min-width: 0;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row.is-in .pl-team-comms-anim__bubble {
    background: #f3f4f6;
    color: #111;
    border-bottom-left-radius: 4px;
}

body.pl-landing-time .pl-team-comms-anim__bubble--form {
    display: flex;
    flex-direction: column;
    gap: 5px;
    max-width: 100%;
    padding: 8px 9px;
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    border-bottom-left-radius: 4px;
}

body.pl-landing-time .pl-team-comms-anim__form-kicker {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-team-comms-anim__field {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-team-comms-anim__field span {
    font-size: 7px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #9ca3af;
}

body.pl-landing-time .pl-team-comms-anim__field strong {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #111;
    line-height: 1.35;
}

body.pl-landing-time .pl-team-comms-anim__bubble-row.is-out .pl-team-comms-anim__bubble {
    background: #007aff;
    color: #fff;
    border-bottom-right-radius: 4px;
}

body.pl-landing-time .pl-team-comms-anim__tail .pl-team-comms-anim__bubble-row--4 {
    align-self: flex-end;
    margin-bottom: 0;
}

@keyframes plTeamCommsListIn {
    0%, 4% { opacity: 0; transform: translateY(8px); }
    12%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plTeamCommsThreadIn {
    0%, 18% { opacity: 0; transform: translateY(8px); }
    24%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plTeamCommsRowIn {
    0%, 10% {
        max-height: 0;
        opacity: 0;
        padding-top: 0;
        padding-bottom: 0;
        transform: translateY(-4px);
    }
    16%, 100% {
        max-height: 48px;
        opacity: 1;
        padding-top: 5px;
        padding-bottom: 5px;
        transform: translateY(0);
    }
}

@keyframes plTeamCommsRowSelect {
    0%, 16% {
        background: transparent;
        border-color: transparent;
    }
    20%, 100% {
        background: #f3f4f6;
        border-color: rgba(0, 0, 0, 0.04);
    }
}

@keyframes plTeamCommsDotIn {
    0%, 12% { opacity: 0; }
    15%, 18% { opacity: 1; }
    22%, 100% { opacity: 0; }
}

@keyframes plTeamCommsUnreadClear {
    0%, 18% {
        color: #111;
        font-weight: 600;
    }
    22%, 100% {
        color: #9ca3af;
        font-weight: 500;
    }
}

@keyframes plTeamCommsBubbleIn {
    0%, 26% { opacity: 0; transform: translateY(6px); }
    32%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plTeamCommsBubbleIn2 {
    0%, 34% { opacity: 0; transform: translateY(6px); }
    40%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plTeamCommsBubbleIn3 {
    0%, 42% { opacity: 0; transform: translateY(6px); }
    48%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plTeamCommsBubbleIn4 {
    0%, 66% {
        opacity: 0;
        transform: translateY(6px);
        max-height: 0;
        overflow: hidden;
    }
    74%, 100% {
        opacity: 1;
        transform: translateY(0);
        max-height: 64px;
        overflow: visible;
    }
}

@keyframes plTeamCommsTyping {
    0%, 52% { opacity: 0; }
    56%, 64% { opacity: 1; }
    70%, 100% { opacity: 0; }
}

@keyframes plTeamCommsTailSlot {
    0%, 52% { min-height: 0; }
    56%, 68% { min-height: 28px; }
    74%, 100% { min-height: 0; }
}

@media (max-width: 720px) {
    body.pl-landing-time .pl-team-comms-anim {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
        gap: 6px;
    }

    body.pl-landing-time .pl-team-comms-anim__list,
    body.pl-landing-time .pl-team-comms-anim__thread {
        padding-left: 7px;
        padding-right: 7px;
    }

    body.pl-landing-time .pl-team-comms-anim__row {
        gap: 5px;
        padding: 4px 5px;
        border-radius: 7px;
    }

    body.pl-landing-time .pl-team-comms-anim__av {
        width: 20px;
        height: 20px;
        font-size: 7px;
    }

    body.pl-landing-time .pl-team-comms-anim__row-title strong {
        font-size: 9px;
    }

    body.pl-landing-time .pl-team-comms-anim__row-preview,
    body.pl-landing-time .pl-team-comms-anim__row-time {
        font-size: 7px;
    }

    body.pl-landing-time .pl-team-comms-anim__dot {
        width: 6px;
        height: 6px;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-team-comms-anim__list,
    body.pl-landing-time .pl-team-comms-anim__thread,
    body.pl-landing-time .pl-team-comms-anim__row--new,
    body.pl-landing-time .pl-team-comms-anim__row--new .pl-team-comms-anim__dot,
    body.pl-landing-time .pl-team-comms-anim__row.is-unread .pl-team-comms-anim__row-preview,
    body.pl-landing-time .pl-team-comms-anim__bubble-row,
    body.pl-landing-time .pl-team-comms-anim__typing,
    body.pl-landing-time .pl-team-comms-anim__tail {
        animation: none !important;
    }

    body.pl-landing-time .pl-team-comms-anim__list,
    body.pl-landing-time .pl-team-comms-anim__thread,
    body.pl-landing-time .pl-team-comms-anim__bubble-row {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-team-comms-anim__row--new {
        max-height: none;
        opacity: 1;
        padding-top: 5px;
        padding-bottom: 5px;
        background: #f3f4f6;
        border-color: rgba(0, 0, 0, 0.04);
    }

    body.pl-landing-time .pl-team-comms-anim__row.is-unread .pl-team-comms-anim__row-preview {
        color: #9ca3af;
        font-weight: 500;
    }

    body.pl-landing-time .pl-team-comms-anim__typing {
        opacity: 1;
    }
}


/* ---- css/pl-time-anims/voice.css ---- */
/**
 * Shared business line — iPhone call list bento animation.
 * Scoped to body.pl-landing-time only.
 */
body.pl-landing-time .pl-time-voice-stage {
    margin-top: auto;
    flex: 0 0 auto;
    height: 276px;
    min-height: 276px;
    max-height: 276px;
    padding: 14px 8px 0;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    background: #fafafa;
    border-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
}

body.pl-landing-time .pl-voice-anim {
    --voice-cycle: 8.5s;
    position: relative;
    width: 100%;
    max-width: 210px;
    margin: 0 auto;
    pointer-events: none;
}

/* Prevent iOS Safari auto-linking demo phone numbers as tel: */
body.pl-landing-time .pl-voice-anim a[x-apple-data-detectors],
body.pl-landing-time .pl-voice-anim a[href^="tel:"] {
    color: inherit !important;
    text-decoration: none !important;
    font-weight: inherit !important;
    font-style: inherit !important;
    pointer-events: none;
}

body.pl-landing-time .pl-voice-anim__phone {
    position: relative;
    width: 168px;
    height: 262px;
    margin: 0 auto;
    border-radius: 28px 28px 0 0;
    border: 2px solid #111;
    border-bottom: none;
    background: #111;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        0 18px 40px rgba(0, 0, 0, 0.16);
    overflow: hidden;
    opacity: 0;
    transform: translateY(14px);
    animation: plVoicePhoneIn var(--voice-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-voice-anim__notch {
    position: absolute;
    top: 8px;
    left: 50%;
    translate: -50% 0;
    width: 56px;
    height: 14px;
    border-radius: 999px;
    background: #000;
    z-index: 5;
}

body.pl-landing-time .pl-voice-anim__screen {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    padding-top: 28px;
    background: #fff;
    border-radius: 26px 26px 0 0;
    overflow: hidden;
}

body.pl-landing-time .pl-voice-anim__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 6px 11px 9px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    background: #fafafa;
}

body.pl-landing-time .pl-voice-anim__bar-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-voice-anim__bar-copy strong {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: #111;
}

body.pl-landing-time .pl-voice-anim__bar-copy span {
    font-size: 8px;
    font-weight: 550;
    letter-spacing: -0.01em;
    color: #9ca3af;
}

/* Overlapped teammate initials — one line, whole crew. */
body.pl-landing-time .pl-voice-anim__team {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    padding-left: 6px;
}

body.pl-landing-time .pl-voice-anim__team .pl-voice-anim__av {
    margin-left: -6px;
}

body.pl-landing-time .pl-voice-anim__av {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid #fff;
    background: #111;
    color: #fff;
    font-size: 7px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

body.pl-landing-time .pl-voice-anim__av--al { background: #0d9488; }
body.pl-landing-time .pl-voice-anim__av--sm { background: #155eef; }
body.pl-landing-time .pl-voice-anim__av--jr { background: #7c3aed; }

body.pl-landing-time .pl-voice-anim__list {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: 0 9px;
    overflow: hidden;
}

body.pl-landing-time .pl-voice-anim__row {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 7px 2px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    opacity: 0;
    transform: translateY(6px);
    animation: plVoiceRowIn var(--voice-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-voice-anim__row--r1 { animation-delay: 0.35s; }
body.pl-landing-time .pl-voice-anim__row--r2 { animation-delay: 0.5s; }
body.pl-landing-time .pl-voice-anim__row--r3 { animation-delay: 0.65s; }

/* New calls land at the top and push the log down. */
body.pl-landing-time .pl-voice-anim__row--new,
body.pl-landing-time .pl-voice-anim__row--new2 {
    overflow: hidden;
    animation: plVoiceRowLand var(--voice-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

body.pl-landing-time .pl-voice-anim__row--new2 {
    animation-name: plVoiceRowLandLate;
}

body.pl-landing-time .pl-voice-anim__dir {
    position: relative;
    width: 24px;
    height: 24px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f3f4f6;
    color: #4b5563;
}

body.pl-landing-time .pl-voice-anim__dir svg {
    width: 12px;
    height: 12px;
}

body.pl-landing-time .pl-voice-anim__dir--miss {
    background: #fef2f2;
    color: #dc2626;
}

body.pl-landing-time .pl-voice-anim__row--new .pl-voice-anim__dir {
    background: #ecfdf5;
    color: #15803d;
    animation: plVoiceDirLive var(--voice-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-voice-anim__ring {
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    border: 1.5px solid rgba(22, 163, 74, 0.55);
    opacity: 0;
    animation: plVoiceRowRing var(--voice-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-voice-anim__who {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

body.pl-landing-time .pl-voice-anim__who strong {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.2;
    color: #111;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.pl-landing-time .pl-voice-anim__who > span {
    font-size: 8px;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: #9ca3af;
    white-space: nowrap;
}

body.pl-landing-time .pl-voice-anim__state {
    position: relative;
    display: block;
    height: 15px;
    overflow: hidden;
}

body.pl-landing-time .pl-voice-anim__state em {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    gap: 4px;
    font-style: normal;
    font-size: 8px;
    font-weight: 600;
    letter-spacing: -0.01em;
    white-space: nowrap;
}

/* Ring group shown inline with the status so it can't crowd the caller name. */
body.pl-landing-time .pl-voice-anim__mini {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1.5px solid #fff;
    color: #fff;
    font-size: 6px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1;
}

body.pl-landing-time .pl-voice-anim__mini + .pl-voice-anim__mini {
    margin-left: -6px;
}

body.pl-landing-time .pl-voice-anim__state-ring {
    color: #111;
    animation: plVoiceStateRinging var(--voice-cycle) ease-out 1 forwards;
}

body.pl-landing-time .pl-voice-anim__state-live {
    color: #15803d;
    opacity: 0;
    animation: plVoiceStateAnswered var(--voice-cycle) ease-out 1 forwards;
}

/* Right slot stays reserved so the row doesn't reflow when Alex picks up. */
body.pl-landing-time .pl-voice-anim__answer {
    width: 19px;
    flex: 0 0 auto;
    display: inline-flex;
}

body.pl-landing-time .pl-voice-anim__answer .pl-voice-anim__av {
    opacity: 0;
    transform: scale(0.6);
    animation: plVoiceAnswerAv var(--voice-cycle) cubic-bezier(0.22, 1, 0.36, 1) 1 forwards;
}

@keyframes plVoicePhoneIn {
    0% { opacity: 0; transform: translateY(14px); }
    9%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plVoiceRowIn {
    0%, 6% { opacity: 0; transform: translateY(6px); }
    14%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes plVoiceRowLand {
    0%, 26% {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        transform: translateY(-4px);
    }
    36%, 100% {
        opacity: 1;
        max-height: 52px;
        padding-top: 7px;
        padding-bottom: 7px;
        transform: translateY(0);
    }
}

@keyframes plVoiceRowLandLate {
    0%, 74% {
        opacity: 0;
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        transform: translateY(-4px);
    }
    84%, 100% {
        opacity: 1;
        max-height: 52px;
        padding-top: 7px;
        padding-bottom: 7px;
        transform: translateY(0);
    }
}

@keyframes plVoiceRowRing {
    0%, 34% { opacity: 0; transform: scale(0.7); }
    40% { opacity: 0.85; transform: scale(0.95); }
    56% { opacity: 0; transform: scale(1.6); }
    100% { opacity: 0; transform: scale(1.6); }
}

@keyframes plVoiceDirLive {
    0%, 55% { background: #ecfdf5; color: #15803d; }
    60%, 100% { background: #dcfce7; color: #15803d; }
}

@keyframes plVoiceStateRinging {
    0%, 52% { opacity: 1; }
    58%, 100% { opacity: 0; }
}

@keyframes plVoiceStateAnswered {
    0%, 54% { opacity: 0; }
    60%, 100% { opacity: 1; }
}

@keyframes plVoiceAnswerAv {
    0%, 54% { opacity: 0; transform: scale(0.6); }
    60% { opacity: 1; transform: scale(1.16); }
    66%, 100% { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    body.pl-landing-time .pl-voice-anim__phone,
    body.pl-landing-time .pl-voice-anim__row,
    body.pl-landing-time .pl-voice-anim__ring,
    body.pl-landing-time .pl-voice-anim__dir,
    body.pl-landing-time .pl-voice-anim__state em,
    body.pl-landing-time .pl-voice-anim__answer .pl-voice-anim__av {
        animation: none !important;
    }

    body.pl-landing-time .pl-voice-anim__phone,
    body.pl-landing-time .pl-voice-anim__row {
        opacity: 1;
        transform: none;
    }

    body.pl-landing-time .pl-voice-anim__row--new,
    body.pl-landing-time .pl-voice-anim__row--new2 {
        max-height: 52px;
    }

    body.pl-landing-time .pl-voice-anim__ring {
        opacity: 0;
    }

    body.pl-landing-time .pl-voice-anim__state-ring {
        opacity: 0;
    }

    body.pl-landing-time .pl-voice-anim__state-live {
        opacity: 1;
    }

    body.pl-landing-time .pl-voice-anim__answer .pl-voice-anim__av {
        opacity: 1;
        transform: none;
    }
}


.pl-marketing-header.is-open .pl-marketing-header__mobile,
.pl-marketing-header__nav.is-open ~ .pl-marketing-header__mobile,
nav.is-open .pl-marketing-header__mobile {
  display: block;
}
.pl-marketing-header.is-open #plMarketingMobileNav[hidden] {
  display: block;
}
.pl-contact {
  max-width: 640px;
  margin: 0 auto;
  padding: 120px 24px 64px;
}
.pl-contact h1 { font-size: 2rem; margin: 0 0 8px; }
.pl-contact .lead { margin: 0 0 24px; color: #444; }
.pl-contact form { display: grid; gap: 12px; }
.pl-contact label { font-weight: 600; }
.pl-contact input[type="text"],
.pl-contact input[type="email"],
.pl-contact textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  font: inherit;
  box-sizing: border-box;
}
.pl-contact button[type="submit"] {
  justify-self: start;
  padding: 12px 20px;
  border: 0;
  border-radius: 999px;
  background: #0a0a0a;
  color: #fff;
  font: inherit;
  cursor: pointer;
}