@import"https://fonts.googleapis.com/css2?family=Mulish:wght@400;500;600;700;800;900&display=swap";:root {
    --pd-green-900: #014C24;
    --pd-green-800: #017737;
    --pd-green-700: #019244;
    --pd-green-600: #08A742;
    --pd-green-500: #1FBA5A;
    --pd-green-300: #8FE1A5;
    --pd-green-100: #D7F9D4;
    --pd-green-50: #ECFBE8;
    --pd-purple-700: #4A3AFF;
    --pd-purple-600: #6961F2;
    --pd-purple-300: #B5B0FA;
    --pd-purple-100: #E6E4FE;
    --pd-yellow-500: #FFC93C;
    --pd-yellow-400: #FFD865;
    --pd-yellow-100: #FFF4D1;
    --pd-pink-500: #FF7A77;
    --pd-pink-100: #FFE0DF;
    --pd-ink-900: #1A1B1F;
    --pd-ink-800: #26282C;
    --pd-ink-700: #404346;
    --pd-ink-500: #6B6E73;
    --pd-ink-400: #9094A0;
    --pd-ink-300: #C4C7CD;
    --pd-ink-200: #E1E3E7;
    --pd-ink-100: #F0F1F4;
    --pd-ink-50: #F7F8FA;
    --pd-white: #FFFFFF;
    --pd-success: #08A742;
    --pd-warning: #FFB020;
    --pd-danger: #E5484D;
    --pd-info: #2563EB;
    --fg-1: var(--pd-ink-900);
    --fg-2: var(--pd-ink-700);
    --fg-3: var(--pd-ink-500);
    --fg-4: var(--pd-ink-400);
    --fg-on-brand: var(--pd-white);
    --bg-1: var(--pd-white);
    --bg-2: var(--pd-ink-50);
    --bg-3: var(--pd-ink-100);
    --bg-brand: var(--pd-green-600);
    --bg-brand-soft: var(--pd-green-100);
    --border-1: var(--pd-ink-200);
    --border-2: var(--pd-ink-300);
    --shadow-xs: 0 1px 2px rgba(26, 27, 31, .06);
    --shadow-sm: 0 2px 6px rgba(26, 27, 31, .06), 0 1px 2px rgba(26, 27, 31, .04);
    --shadow-md: 0 8px 20px rgba(26, 27, 31, .08), 0 2px 4px rgba(26, 27, 31, .04);
    --shadow-lg: 0 24px 48px rgba(26, 27, 31, .1), 0 4px 8px rgba(26, 27, 31, .04);
    --shadow-brand: 0 8px 20px rgba(8, 167, 66, .25);
    --r-xs: 4px;
    --r-sm: 6px;
    --r-md: 8px;
    --r-lg: 8px;
    --r-xl: 8px;
    --r-2xl: 8px;
    --r-pill: 999px;
    --s-1: 4px;
    --s-2: 8px;
    --s-3: 12px;
    --s-4: 16px;
    --s-5: 20px;
    --s-6: 24px;
    --s-8: 32px;
    --s-10: 40px;
    --s-12: 48px;
    --s-16: 64px;
    --s-20: 80px;
    --s-24: 96px;
    --container-narrow: 880px;
    --container: 1200px;
    --container-wide: 1320px;
    --ease-out: cubic-bezier(.16, 1, .3, 1);
    --ease-in-out: cubic-bezier(.65, 0, .35, 1);
    --dur-fast: .12s;
    --dur-base: .2s;
    --dur-slow: .32s
}

:root {
    --font-sans: "Mulish", "Helvetica Neue", Arial, system-ui, -apple-system, sans-serif;
    --font-display: "Mulish", "Helvetica Neue", Arial, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
    --fs-display-xl: clamp(48px, 5.6vw, 84px);
    --fs-display-lg: clamp(40px, 4.4vw, 64px);
    --fs-display: clamp(32px, 3.4vw, 48px);
    --fs-h1: clamp(32px, 2.8vw, 40px);
    --fs-h2: clamp(26px, 2.2vw, 32px);
    --fs-h3: 22px;
    --fs-h4: 18px;
    --fs-body-lg: 18px;
    --fs-body: 16px;
    --fs-body-sm: 14px;
    --fs-caption: 13px;
    --fs-micro: 12px;
    --lh-tight: 1.05;
    --lh-snug: 1.18;
    --lh-base: 1.5;
    --lh-loose: 1.65;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semibold: 600;
    --fw-bold: 700;
    --fw-black: 800;
    --tracking-tight: 0;
    --tracking-snug: 0;
    --tracking-normal: 0;
    --tracking-wide: .02em
}

body {
    font-family: var(--font-sans);
    font-size: var(--fs-body);
    line-height: var(--lh-base);
    color: var(--fg-2);
    background: var(--bg-1);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility
}

h1,.h1 {
    font-family: var(--font-display);
    font-size: var(--fs-h1);
    font-weight: var(--fw-black);
    line-height: var(--lh-tight);
    letter-spacing: var(--tracking-tight);
    color: var(--fg-1)
}

h2,.h2 {
    font-family: var(--font-display);
    font-size: var(--fs-h2);
    font-weight: var(--fw-bold);
    line-height: var(--lh-snug);
    letter-spacing: var(--tracking-snug);
    color: var(--fg-1)
}

h3,.h3 {
    font-size: var(--fs-h3);
    font-weight: var(--fw-bold);
    line-height: 1.3;
    color: var(--fg-1)
}

h4,.h4 {
    font-size: var(--fs-h4);
    font-weight: var(--fw-semibold);
    line-height: 1.4;
    color: var(--fg-1)
}

.display-xl {
    font-size: var(--fs-display-xl);
    font-weight: var(--fw-black);
    line-height: .98;
    letter-spacing: 0;
    color: var(--fg-1)
}

.display-lg {
    font-size: var(--fs-display-lg);
    font-weight: var(--fw-black);
    line-height: 1.02;
    letter-spacing: 0;
    color: var(--fg-1)
}

.display {
    font-size: var(--fs-display);
    font-weight: var(--fw-bold);
    line-height: 1.08;
    letter-spacing: 0;
    color: var(--fg-1)
}

.body-lg {
    font-size: var(--fs-body-lg);
    line-height: var(--lh-loose)
}

.body {
    font-size: var(--fs-body);
    line-height: var(--lh-base)
}

.body-sm {
    font-size: var(--fs-body-sm);
    line-height: var(--lh-base)
}

.caption {
    font-size: var(--fs-caption);
    line-height: 1.4;
    color: var(--fg-3)
}

.eyebrow {
    font-size: var(--fs-caption);
    font-weight: var(--fw-bold);
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--pd-green-700)
}

a {
    color: var(--pd-green-700);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px
}

a:hover {
    color: var(--pd-green-800)
}

code,kbd,samp,pre {
    font-family: var(--font-mono);
    font-size: .92em
}

* {
    box-sizing: border-box
}

html,body {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth
}

body {
    background: #fff;
    font-family: var(--font-sans)
}

ul {
    list-style: none;
    padding: 0;
    margin: 0
}

button {
    font-family: var(--font-sans)
}

img {
    max-width: 100%;
    display: block
}

.pd-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: var(--font-sans);
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),transform .1s ease-out;
    white-space: nowrap
}

.pd-btn svg {
    flex-shrink: 0
}

.pd-btn:active {
    transform: scale(.98)
}

.pd-btn-md {
    padding: 13px 22px;
    font-size: 15px;
    border-radius: 8px
}

.pd-btn-sm {
    padding: 9px 16px;
    font-size: 14px;
    border-radius: 6px
}

.pd-btn-lg {
    padding: 16px 28px;
    font-size: 16px;
    border-radius: 8px
}

.pd-btn-primary {
    background: var(--pd-green-600);
    color: #fff;
    box-shadow: var(--shadow-brand)
}

.pd-btn-primary:hover {
    background: var(--pd-green-800)
}

.pd-btn-secondary {
    background: transparent;
    color: var(--pd-green-800);
    box-shadow: inset 0 0 0 1.5px var(--pd-green-800)
}

.pd-btn-secondary:hover {
    background: var(--pd-green-100)
}

.pd-btn-white {
    background: #fff;
    color: var(--pd-green-800)
}

.pd-btn-white:hover {
    background: var(--pd-green-100)
}

.pd-btn-ghost {
    background: transparent;
    color: var(--fg-1)
}

.pd-btn-ghost:hover {
    background: var(--pd-ink-100)
}

.pd-section {
    padding: 96px 24px
}

.pd-section-tight {
    padding: 72px 24px
}

.pd-section-inner {
    max-width: 1200px;
    margin: 0 auto
}

.pd-section-head {
    margin-bottom: 56px;
    max-width: 760px
}

.pd-section-head.center {
    margin-left: auto;
    margin-right: auto;
    text-align: center
}

.pd-announce {
    background: var(--pd-green-900);
    color: #fff;
    padding: 10px 24px;
    text-align: center;
    font-size: 13px;
    font-weight: 600
}

.pd-announce a {
    color: var(--pd-green-300);
    text-decoration: underline;
    text-underline-offset: 3px;
    margin-left: 6px
}

.pd-nav {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #fffffff0;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid var(--border-1)
}

.pd-nav-inner {
    max-width: 1240px;
    margin: 0 auto;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    gap: 20px
}

.pd-nav-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    margin-right: 8px
}

.pd-nav-locale {
    font-size: 11px;
    font-weight: 800;
    padding: 3px 8px;
    border-radius: 999px;
    background: var(--pd-green-100);
    color: var(--pd-green-800);
    letter-spacing: .04em;
    text-transform: uppercase
}

.pd-nav-links {
    display: flex;
    gap: 28px;
    flex: 1
}

.pd-nav-links a,.pd-nav-link-btn {
    font-size: 14.5px;
    font-weight: 600;
    color: var(--fg-1);
    text-decoration: none;
    cursor: pointer;
    background: none;
    border: none;
    font-family: var(--font-sans);
    padding: 8px 0;
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 4px
}

.pd-nav-links a:hover,.pd-nav-link-btn:hover {
    color: var(--pd-green-700)
}

.pd-nav-cta {
    display: flex;
    align-items: center;
    gap: 14px
}

.pd-nav-link {
    font-size: 14px;
    font-weight: 600;
    color: var(--fg-1);
    text-decoration: none
}

.pd-nav-link:hover {
    color: var(--pd-green-700)
}

.pd-nav-burger {
    display: none;
    background: none;
    border: none;
    padding: 8px;
    color: var(--fg-1);
    cursor: pointer;
    border-radius: 8px
}

.pd-nav-burger:hover {
    background: var(--pd-ink-100)
}

.pd-mobile-menu {
    display: none;
    flex-direction: column;
    gap: 4px;
    padding: 16px 24px 24px;
    background: #fff;
    border-bottom: 1px solid var(--border-1)
}

.pd-mobile-menu a {
    padding: 12px 8px;
    font-size: 16px;
    font-weight: 600;
    color: var(--fg-1);
    text-decoration: none;
    border-bottom: 1px solid var(--border-1)
}

.pd-mobile-menu a.pd-btn {
    border-bottom: none;
    color: #fff
}

.pd-nav-mega {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    background: #fff;
    border-bottom: 1px solid var(--border-1);
    box-shadow: var(--shadow-md);
    padding: 32px 24px
}

.pd-nav-mega-inner {
    max-width: 1240px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 32px
}

.pd-nav-mega-col h4 {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--fg-3)
}

.pd-nav-mega-item {
    display: flex;
    gap: 12px;
    padding: 10px;
    border-radius: 8px;
    text-decoration: none;
    color: var(--fg-1)
}

.pd-nav-mega-item:hover {
    background: var(--pd-ink-50)
}

.pd-nav-mega-item .ico {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--pd-green-100);
    color: var(--pd-green-800);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.pd-nav-mega-item .ttl {
    font-weight: 700;
    font-size: 14px
}

.pd-nav-mega-item .dsc {
    font-size: 12.5px;
    color: var(--fg-3);
    margin-top: 2px
}

.pd-hero {
    padding: 80px 24px 96px;
    background: linear-gradient(180deg,#fff 0%,var(--pd-green-50) 100%);
    position: relative;
    overflow: hidden
}

.pd-hero-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.05fr 1fr;
    gap: 56px;
    align-items: center;
    position: relative;
    z-index: 1
}

.pd-hero-copy h1 strong,.pd-hero-copy strong {
    font-weight: 900
}

.pd-hero-trust {
    display: flex;
    gap: 22px;
    margin-top: 28px;
    flex-wrap: wrap;
    align-items: center;
    font-size: 13px;
    color: var(--fg-3);
    font-weight: 600
}

.pd-hero-trust-item {
    display: flex;
    align-items: center;
    gap: 6px
}

.pd-hero-trust-item svg {
    color: var(--pd-green-600)
}

.pd-pipeline {
    background: #fff;
    border-radius: 8px;
    box-shadow: var(--shadow-lg);
    overflow: hidden
}

.pd-pipeline-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border-1);
    background: var(--pd-ink-50)
}

.pd-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block
}

.pd-pipeline-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 8px;
    padding: 14px;
    background: var(--pd-ink-50)
}

.pd-pipeline-col {
    background: #fff;
    border-radius: 8px;
    padding: 10px;
    min-height: 240px;
    display: flex;
    flex-direction: column;
    gap: 8px
}

.pd-pipeline-head {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 2px 8px;
    border-bottom: 1px solid var(--border-1);
    margin-bottom: 4px
}

.pd-deal {
    padding: 10px;
    border-radius: 8px;
    background: var(--pd-ink-50);
    border-left: 3px solid var(--pd-green-600);
    cursor: grab;
    transition: transform .2s var(--ease-out),box-shadow .2s var(--ease-out)
}

.pd-deal:hover {
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm)
}

.pd-logos {
    padding: 56px 24px;
    border-top: 1px solid var(--border-1);
    border-bottom: 1px solid var(--border-1);
    background: #fff
}

.pd-logos-inner {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center
}

.pd-logos-label {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--fg-3);
    margin: 0 0 28px
}

.pd-logos-grid {
    display: flex;
    justify-content: space-around;
    align-items: center;
    gap: 32px;
    flex-wrap: wrap
}

.pd-logos-item {
    font-size: 22px;
    color: var(--fg-3);
    opacity: .7;
    transition: opacity var(--dur-base)
}

.pd-logos-item:hover {
    opacity: 1
}

.pd-feature-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 24px
}

.pd-card {
    background: #fff;
    border-radius: var(--r-xl);
    padding: 28px;
    box-shadow: var(--shadow-sm);
    transition: all var(--dur-base) var(--ease-out);
    border: 1px solid var(--border-1)
}

.pd-card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-2px)
}

.pd-feature h3 {
    margin: 0 0 8px;
    font-size: 18px
}

.pd-feature p {
    margin: 0;
    color: var(--fg-2);
    font-size: 15px;
    line-height: 1.55
}

.pd-icon-tile {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 18px
}

.pd-showcase {
    background: var(--pd-ink-50)
}

.pd-showcase-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
    padding: 56px 0;
    border-bottom: 1px solid var(--border-1)
}

.pd-showcase-row:last-child {
    border-bottom: none
}

.pd-showcase-row.flip>.pd-showcase-copy {
    order: 2
}

.pd-showcase-copy h3 {
    font-size: 32px;
    margin: 14px 0 16px;
    line-height: 1.1;
    letter-spacing: 0
}

.pd-showcase-copy p {
    font-size: 17px;
    color: var(--fg-2);
    line-height: 1.6;
    max-width: 480px
}

.pd-showcase-bullets {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.pd-showcase-bullets li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 15px;
    color: var(--fg-2)
}

.pd-showcase-bullets svg {
    color: var(--pd-green-600);
    flex-shrink: 0;
    margin-top: 2px
}

.pd-mock {
    background: #fff;
    border-radius: 8px;
    box-shadow: var(--shadow-lg);
    overflow: hidden
}

.pd-mock-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-1);
    background: var(--pd-ink-50);
    font-size: 12px;
    color: var(--fg-3);
    font-family: var(--font-mono)
}

.pd-mock-bar .pd-dot {
    width: 9px;
    height: 9px
}

.pd-mock-ai {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.pd-msg {
    padding: 12px 14px;
    border-radius: 8px;
    font-size: 14px;
    max-width: 88%;
    line-height: 1.4
}

.pd-msg-bot {
    background: var(--pd-green-50);
    color: var(--fg-1);
    align-self: flex-start;
    border-bottom-left-radius: 4px
}

.pd-msg-user {
    background: var(--pd-green-600);
    color: #fff;
    align-self: flex-end;
    border-bottom-right-radius: 4px;
    font-weight: 600
}

.pd-msg-suggest {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 4px
}

.pd-msg-chip {
    padding: 6px 10px;
    border-radius: 999px;
    background: #fff;
    border: 1px solid var(--border-1);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    font-family: var(--font-sans);
    color: var(--fg-1)
}

.pd-msg-chip:hover {
    border-color: var(--pd-green-600);
    color: var(--pd-green-700)
}

.pd-mock-chart {
    padding: 22px
}

.pd-chart-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    height: 180px;
    padding: 0 6px
}

.pd-chart-bar {
    flex: 1;
    border-radius: 6px 6px 2px 2px;
    background: linear-gradient(180deg,var(--pd-green-500),var(--pd-green-600));
    position: relative;
    transition: opacity .2s
}

.pd-chart-bar:hover {
    opacity: .85
}

.pd-chart-bar.alt {
    background: linear-gradient(180deg,var(--pd-green-300),var(--pd-green-500))
}

.pd-chart-axis {
    display: flex;
    gap: 10px;
    padding: 8px 6px 0;
    font-size: 11px;
    color: var(--fg-3);
    font-weight: 600
}

.pd-chart-axis span {
    flex: 1;
    text-align: center
}

.pd-chart-legend {
    display: flex;
    gap: 16px;
    padding: 14px 6px 0;
    font-size: 12px;
    color: var(--fg-3)
}

.pd-chart-legend span {
    display: flex;
    align-items: center;
    gap: 6px
}

.pd-mock-flow {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center
}

.pd-flow-step {
    width: 100%;
    padding: 14px 16px;
    border-radius: 10px;
    background: var(--pd-ink-50);
    border: 1px solid var(--border-1);
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px
}

.pd-flow-step.trig {
    background: var(--pd-yellow-100);
    border-color: var(--pd-yellow-400)
}

.pd-flow-step.act {
    background: var(--pd-purple-100);
    border-color: var(--pd-purple-300)
}

.pd-flow-step .ico {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0
}

.pd-flow-arrow {
    color: var(--pd-ink-300)
}

.pd-stats {
    padding: 72px 24px;
    background: var(--pd-green-100)
}

.pd-stats-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 24px
}

.pd-stat {
    text-align: left
}

.pd-stat-value {
    font-family: var(--font-display);
    font-weight: 900;
    font-size: clamp(36px,4vw,56px);
    color: var(--pd-green-900);
    line-height: 1;
    letter-spacing: 0
}

.pd-stat-label {
    margin-top: 10px;
    font-size: 14px;
    color: var(--pd-green-900);
    font-weight: 600;
    max-width: 200px
}

.pd-testimonials {
    padding: 96px 24px;
    background: #fff
}

.pd-testi-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 24px
}

.pd-testi-grid-secondary {
    margin-top: 24px;
    grid-template-columns: 1fr 1fr
}

.pd-testi-card {
    background: #fff;
    border-radius: var(--r-xl);
    padding: 32px;
    border: 1px solid var(--border-1);
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-sm)
}

.pd-testi-card.feat {
    background: var(--pd-green-100);
    border-color: transparent
}

.pd-testi-quote {
    font-size: 18px;
    line-height: 1.5;
    color: var(--fg-1);
    font-weight: 500
}

.pd-testi-card.feat .pd-testi-quote {
    font-size: 22px;
    font-weight: 600
}

.pd-testi-meta {
    margin-top: auto;
    padding-top: 20px;
    display: flex;
    align-items: center;
    gap: 12px
}

.pd-testi-avatar {
    width: 44px;
    height: 44px;
    border-radius: 999px;
    background: var(--pd-green-300);
    color: var(--pd-green-900);
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0
}

.pd-testi-name {
    font-weight: 700;
    font-size: 14px;
    color: var(--fg-1)
}

.pd-testi-role {
    font-size: 13px;
    color: var(--fg-3);
    margin-top: 1px
}

.pd-testi-stars {
    color: var(--pd-yellow-500);
    display: flex;
    gap: 2px;
    margin-bottom: 14px
}

.pd-pricing {
    padding: 96px 24px;
    background: var(--pd-ink-50)
}

.pd-pricing-toggle {
    display: inline-flex;
    padding: 4px;
    background: #fff;
    border-radius: 999px;
    border: 1px solid var(--border-1);
    margin: 24px auto 48px
}

.pd-pricing-toggle button {
    padding: 8px 18px;
    border-radius: 999px;
    border: none;
    background: transparent;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    color: var(--fg-2)
}

.pd-pricing-toggle button.on {
    background: var(--pd-green-600);
    color: #fff
}

.pd-pricing-grid {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
    align-items: stretch
}

.pd-plan {
    background: #fff;
    border-radius: var(--r-xl);
    padding: 28px;
    border: 1px solid var(--border-1);
    display: flex;
    flex-direction: column;
    transition: transform .2s var(--ease-out),box-shadow .2s var(--ease-out);
    position: relative
}

.pd-plan.feat {
    border-color: var(--pd-green-600);
    box-shadow: 0 8px 32px #08a7422e;
    transform: translateY(-8px)
}

.pd-plan-badge {
    position: absolute;
    top: -12px;
    left: 24px;
    background: var(--pd-green-600);
    color: #fff;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: uppercase
}

.pd-plan-name {
    font-weight: 800;
    font-size: 18px;
    color: var(--fg-1)
}

.pd-plan-tag {
    font-size: 13px;
    color: var(--fg-3);
    margin-top: 4px;
    min-height: 36px
}

.pd-plan-price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin: 18px 0 4px
}

.pd-plan-price-num {
    font-size: 38px;
    font-weight: 900;
    color: var(--fg-1);
    letter-spacing: 0;
    line-height: 1
}

.pd-plan-price-cur {
    font-size: 16px;
    font-weight: 700;
    color: var(--fg-2)
}

.pd-plan-price-suf {
    font-size: 13px;
    color: var(--fg-3)
}

.pd-plan-billed {
    font-size: 12px;
    color: var(--fg-3);
    margin-bottom: 18px
}

.pd-plan ul {
    margin: 14px 0 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1
}

.pd-plan ul li {
    display: flex;
    gap: 10px;
    font-size: 13.5px;
    color: var(--fg-2);
    align-items: flex-start
}

.pd-plan ul svg {
    color: var(--pd-green-600);
    flex-shrink: 0;
    margin-top: 2px
}

.pd-compare {
    padding: 96px 24px;
    background: #fff
}

.pd-compare-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: var(--r-xl);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--border-1)
}

.pd-compare-table th,.pd-compare-table td {
    padding: 16px 20px;
    text-align: left;
    border-bottom: 1px solid var(--border-1);
    font-size: 14px
}

.pd-compare-table thead th {
    background: var(--pd-green-900);
    color: #fff;
    font-size: 13px;
    font-weight: 700
}

.pd-compare-table thead th.us {
    background: var(--pd-green-600)
}

.pd-compare-table tbody tr:last-child td {
    border-bottom: none
}

.pd-compare-table td.check {
    text-align: center
}

.pd-compare-table td.check svg {
    color: var(--pd-green-600)
}

.pd-compare-table td.cross {
    text-align: center;
    color: var(--pd-ink-300)
}

.pd-compare-table tbody tr:hover {
    background: var(--pd-green-50)
}

.pd-faq {
    padding: 96px 24px;
    background: var(--pd-ink-50)
}

.pd-faq-grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 64px;
    align-items: start
}

.pd-faq-list {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.pd-faq-item {
    background: #fff;
    border-radius: 8px;
    border: 1px solid var(--border-1);
    overflow: hidden
}

.pd-faq-q {
    width: 100%;
    text-align: left;
    padding: 20px 24px;
    background: none;
    border: none;
    font-family: var(--font-sans);
    font-weight: 700;
    font-size: 16px;
    color: var(--fg-1);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px
}

.pd-faq-q svg {
    transition: transform .2s var(--ease-out);
    flex-shrink: 0;
    color: var(--fg-3)
}

.pd-faq-item.open .pd-faq-q svg {
    transform: rotate(45deg)
}

.pd-faq-a {
    padding: 0 24px 22px;
    font-size: 15px;
    color: var(--fg-2);
    line-height: 1.6;
    display: none
}

.pd-faq-item.open .pd-faq-a {
    display: block
}

.pd-partner {
    padding: 96px 24px;
    background: #fff
}

.pd-partner-card {
    background: var(--pd-green-900);
    border-radius: 8px;
    padding: 56px;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    gap: 56px;
    align-items: center;
    box-shadow: var(--shadow-lg);
    position: relative;
    overflow: hidden
}

.pd-partner-list {
    margin: 28px 0 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative
}

.pd-partner-list li {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    color: #ffffffeb;
    font-size: 15px;
    line-height: 1.5
}

.pd-link-white {
    color: #fff;
    font-weight: 700;
    align-self: center;
    text-decoration: underline;
    text-underline-offset: 4px
}

.pd-signup {
    background: #fff;
    border-radius: 8px;
    box-shadow: var(--shadow-lg);
    overflow: hidden;
    position: relative;
    z-index: 1
}

.pd-signup-head {
    padding: 16px 22px;
    border-bottom: 1px solid var(--border-1);
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--pd-ink-50)
}

.pd-final-cta {
    padding: 96px 24px;
    background: var(--pd-green-600);
    color: #fff;
    text-align: center;
    position: relative;
    overflow: hidden
}

.pd-final-cta .display-lg {
    color: #fff;
    max-width: 800px;
    margin: 0 auto;
    position: relative
}

.pd-final-cta p {
    color: #ffffffe6;
    font-size: 19px;
    max-width: 600px;
    margin: 18px auto 36px;
    position: relative
}

.pd-final-cta .pd-final-actions {
    position: relative;
    display: inline-flex;
    gap: 14px;
    flex-wrap: wrap;
    justify-content: center
}

.pd-footer {
    background: var(--pd-ink-900);
    color: #ffffffbf;
    padding: 80px 24px 32px
}

.pd-footer-grid {
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr 1fr;
    gap: 40px
}

.pd-footer-title {
    font-size: 13px;
    font-weight: 800;
    color: #fff;
    letter-spacing: .04em;
    text-transform: uppercase;
    margin-bottom: 16px
}

.pd-footer-list {
    display: flex;
    flex-direction: column;
    gap: 10px
}

.pd-footer-list a {
    color: #ffffffb3;
    font-size: 14px;
    text-decoration: none
}

.pd-footer-list a:hover {
    color: #fff
}

.pd-footer-base {
    margin-top: 56px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,.12);
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px
}

.pd-footer-base a {
    color: #fff9;
    text-decoration: none
}

.pd-footer-base a:hover {
    color: #fff
}

.pd-footer-social {
    display: flex;
    gap: 12px
}

.pd-footer-social a {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #ffffff14;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff
}

.pd-footer-social a:hover {
    background: var(--pd-green-600)
}

@media(max-width: 980px) {
    .pd-hero-inner,.pd-feature-grid,.pd-stats-grid,.pd-partner-card,.pd-footer-grid,.pd-pipeline-grid,.pd-testi-grid,.pd-pricing-grid,.pd-faq-grid,.pd-showcase-row,.pd-nav-mega-inner {
        grid-template-columns:1fr
    }

    .pd-section,.pd-testimonials,.pd-pricing,.pd-compare,.pd-faq,.pd-partner,.pd-final-cta {
        padding: 64px 20px
    }

    .pd-nav-links {
        display: none
    }

    .pd-nav-burger {
        display: inline-flex
    }

    .pd-nav-cta {
        display: none
    }

    .pd-mobile-menu {
        display: flex
    }

    .pd-partner-card {
        padding: 36px 24px
    }

    .pd-showcase-row.flip>.pd-showcase-copy {
        order: initial
    }

    .pd-footer-grid {
        gap: 32px
    }

    .pd-compare-table {
        font-size: 13px
    }

    .pd-compare-table th,.pd-compare-table td {
        padding: 12px
    }

    .pd-compare {
        overflow-x: auto
    }

    .pd-compare-table {
        min-width: 640px
    }
}

@media(max-width: 640px) {
    .pd-announce {
        padding:9px 16px;
        font-size: 12px
    }

    .pd-nav-inner {
        padding: 10px 18px
    }

    .pd-nav-logo img {
        height: 61px!important;
    }

    .pd-hero {
        padding: 36px 18px 40px
    }

    .pd-hero-inner {
        gap: 22px
    }

    .pd-hero .display-lg {
        font-size: 36px;
        line-height: 1.06
    }

    .pd-hero .body-lg {
        font-size: 15.5px;
        line-height: 1.5;
        margin-top: 14px!important
    }

    .pd-hero-trust {
        margin-top: 14px;
        gap: 8px 14px;
        font-size: 12px
    }

    .pd-hero-actions {
        margin-top: 18px!important
    }

    .pd-btn-lg {
        padding: 13px 20px;
        min-height: 50px
    }

    .pd-pipeline-col {
        min-height: 0
    }

    .pd-footer-base span:last-child {
        flex-wrap: wrap
    }

    .pd-btn-lg {
        width: 100%
    }
}
