/* Public product-story pages: light, fast, and deliberately free of UI dependencies. */
.pocketpapi-funnel-home,
.pocketpapi-product-page {
    --funnel-ink: #172033;
    --funnel-muted: #657087;
    --funnel-line: #dce3ee;
    --funnel-blue: #155eef;
    --funnel-blue-soft: #edf4ff;
    --funnel-coral: #ff7f56;
    background: #f6f8fb;
    color: var(--funnel-ink);
}

.pocketpapi-funnel-home .landing-nav,
.pocketpapi-product-page .landing-nav { min-height: 74px; }
.pocketpapi-funnel-home .landing-nav nav,
.pocketpapi-product-page .landing-nav nav { gap: clamp(12px, 2vw, 26px); }
.pocketpapi-funnel-home .landing-nav nav a:not(.button-link),
.pocketpapi-product-page .landing-nav nav a:not(.button-link) { color: #46546b; font-size: .84rem; }
.pocketpapi-funnel-home .landing-nav .button-link,
.pocketpapi-product-page .landing-nav .button-link { min-height: 42px; border-color: var(--funnel-blue); background: var(--funnel-blue); color: #fff; }
.pocketpapi-funnel-home .landing-hero { gap: clamp(36px, 5vw, 72px); padding-top: clamp(56px, 8vw, 104px); padding-bottom: clamp(54px, 7vw, 88px); }
.pocketpapi-funnel-home .landing-hero h1 { max-width: 640px; font-size: clamp(3rem, 5.6vw, 5.5rem); line-height: .99; }
.pocketpapi-funnel-home .landing-hero-copy > p:not(.landing-eyebrow) { max-width: 580px; font-size: clamp(1rem, 1.45vw, 1.18rem); line-height: 1.62; }
.pocketpapi-funnel-home .landing-onboarding-card { align-self: center; }
.pocketpapi-funnel-home .landing-proof { margin-bottom: 0; color: #536078; }

.funnel-section { width: min(100% - 48px, 1180px); margin-inline: auto; }
.funnel-intro { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(260px, .7fr); align-items: end; gap: 40px; padding: 104px 0 35px; }
.funnel-intro h2,
.funnel-closing h2 { max-width: 760px; margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2.6rem, 5vw, 4.8rem); font-weight: 800; line-height: .99; letter-spacing: -.065em; }
.funnel-intro p { max-width: 390px; margin: 0 0 5px; color: var(--funnel-muted); font-size: 1rem; line-height: 1.65; }
.funnel-path { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); padding: 24px 0 32px; border-top: 1px solid var(--funnel-line); border-bottom: 1px solid var(--funnel-line); }
.funnel-path a { position: relative; display: flex; align-items: center; gap: 12px; min-width: 0; padding: 10px 14px 10px 0; color: var(--funnel-ink); font-size: .9rem; font-weight: 750; }
.funnel-path a:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: 14px; width: 24px; height: 1px; background: #9ba9bd; }
.funnel-path a span { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 1px solid #bfd0ec; border-radius: 50%; background: #fff; color: var(--funnel-blue); font-size: .75rem; }
.funnel-path a:hover { color: var(--funnel-blue); }

.funnel-chapters { padding: 14px 0 34px; }
.funnel-chapter { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); align-items: center; gap: clamp(42px, 7vw, 96px); padding: clamp(64px, 8vw, 104px) 0; border-bottom: 1px solid var(--funnel-line); scroll-margin-top: 24px; }
.funnel-chapter--reverse .funnel-chapter-copy { order: 2; }
.funnel-chapter--reverse .funnel-visual { order: 1; }
.funnel-chapter-copy { max-width: 490px; }
.funnel-overline { margin: 0 0 17px; color: var(--funnel-blue); font-size: .72rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.funnel-chapter-copy h2 { margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2.25rem, 4.2vw, 3.75rem); font-weight: 800; line-height: 1.02; letter-spacing: -.06em; }
.funnel-chapter-copy > p:not(.funnel-overline) { margin: 19px 0 0; color: var(--funnel-muted); font-size: 1rem; line-height: 1.68; }
.funnel-points { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 22px; margin: 22px 0 0; padding: 0; list-style: none; }
.funnel-points li { padding: 12px 0; border-top: 1px solid var(--funnel-line); color: #35435a; font-size: .84rem; line-height: 1.45; }
.funnel-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; color: var(--funnel-blue); font-size: .88rem; font-weight: 800; }
.funnel-link svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; transition: transform .2s ease; }
.funnel-link:hover svg { transform: translateX(3px); }

.funnel-visual { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #d3dce9; border-radius: 20px; background: #fff; box-shadow: 0 24px 60px rgba(29, 62, 110, .09); }
.funnel-visual-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 52px; padding: 0 18px; border-bottom: 1px solid #e7ecf3; color: #58667e; font-size: .7rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.funnel-visual-head b { color: var(--funnel-ink); font-size: .79rem; letter-spacing: 0; }
.funnel-visual-body { padding: clamp(18px, 3vw, 30px); }
.funnel-web-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; align-items: stretch; }
.funnel-web-flow article { position: relative; display: grid; align-content: center; min-height: 188px; padding: 20px; border-right: 1px solid #e5ebf3; }
.funnel-web-flow article:last-child { border-right: 0; }
.funnel-web-flow small { color: #8290a5; font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.funnel-web-flow strong { display: block; margin-top: 13px; color: var(--funnel-ink); font-size: 1.08rem; letter-spacing: -.025em; }
.funnel-web-flow span { display: block; margin-top: 8px; color: var(--funnel-muted); font-size: .79rem; line-height: 1.5; }
.funnel-web-flow article:not(:last-child)::after { content: ""; position: absolute; z-index: 1; top: 50%; right: -6px; width: 11px; height: 11px; border-top: 1.5px solid #8ea0ba; border-right: 1.5px solid #8ea0ba; background: #fff; transform: rotate(45deg); }

.funnel-screen-preview { display: grid; grid-template-columns: 1.45fr .9fr; gap: 12px; min-height: 300px; padding: 17px; background: #101e35; }
.funnel-screen-main { display: grid; align-content: space-between; min-height: 265px; padding: clamp(20px, 4vw, 40px); background: #172e50; color: #fff; }
.funnel-screen-main small { color: #ffb394; font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.funnel-screen-main strong { max-width: 400px; font-family: Georgia, serif; font-size: clamp(1.9rem, 4vw, 3.4rem); font-weight: 500; line-height: 1.02; letter-spacing: -.045em; }
.funnel-screen-main span { color: #e6edf7; font-size: .79rem; }
.funnel-screen-side { display: grid; gap: 12px; }
.funnel-screen-side article { display: grid; align-content: center; padding: 20px; background: #fff; color: var(--funnel-ink); }
.funnel-screen-side small { color: var(--funnel-blue); font-size: .64rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.funnel-screen-side strong { margin-top: 9px; font-size: 1rem; }
.funnel-screen-side span { margin-top: 6px; color: var(--funnel-muted); font-size: .72rem; }

.funnel-people-preview { display: grid; grid-template-columns: .9fr 1.1fr; gap: 20px; padding: 24px; background: #f5f8fc; }
.funnel-people-list { display: grid; gap: 9px; }
.funnel-people-list article { display: flex; align-items: center; gap: 12px; min-height: 58px; padding: 10px 13px; border: 1px solid #e0e7f0; background: #fff; color: var(--funnel-ink); font-size: .84rem; font-weight: 750; }
.funnel-people-list span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--funnel-blue-soft); color: var(--funnel-blue); font-size: .72rem; }
.funnel-people-list article:last-child span { background: #fff0e9; color: #cc5d37; }
.funnel-day-flow { display: grid; align-content: center; gap: 14px; padding: 18px; border-left: 1px solid #d9e1ed; }
.funnel-day-flow article { display: grid; grid-template-columns: 86px 1fr; align-items: center; gap: 11px; color: #56657c; font-size: .75rem; }
.funnel-day-flow b { padding: 9px 10px; border-left: 3px solid var(--funnel-blue); background: #e9f1ff; color: #244879; font-size: .76rem; }
.funnel-day-flow article:last-child b { border-left-color: var(--funnel-coral); background: #fff0e9; color: #854528; }

.funnel-crm-preview { display: grid; grid-template-columns: 1.4fr .8fr; min-height: 300px; }
.funnel-pipeline { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 20px; background: #f6f8fb; }
.funnel-pipeline section { min-width: 0; padding: 12px; border: 1px solid #e0e7f0; background: #fff; }
.funnel-pipeline h3 { margin: 0; color: #526078; font-size: .73rem; }
.funnel-pipeline span { display: block; height: 8px; margin-top: 12px; border: 0; background: #eff4fb; }
.funnel-pipeline span:nth-of-type(2) { width: 84%; }
.funnel-pipeline span:nth-of-type(3) { width: 70%; }
.funnel-customer-activity { display: grid; align-content: center; gap: 11px; padding: 22px; border-left: 1px solid #e0e7f0; }
.funnel-customer-activity small { color: #75839a; font-size: .67rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.funnel-customer-activity strong { color: var(--funnel-ink); font-size: 1.05rem; }
.funnel-customer-activity span { padding-top: 10px; border-top: 1px solid #e4eaf2; color: var(--funnel-muted); font-size: .74rem; line-height: 1.45; }

.funnel-app-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(22px, 4vw, 48px); padding: 82px 0; border-bottom: 1px solid var(--funnel-line); }
.funnel-app-story { display: grid; grid-template-columns: minmax(0, .9fr) minmax(170px, .7fr); align-items: center; gap: 20px; min-width: 0; }
.funnel-app-story + .funnel-app-story { padding-left: clamp(22px, 4vw, 48px); border-left: 1px solid var(--funnel-line); }
.funnel-app-story h2 { margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(1.8rem, 3vw, 2.65rem); line-height: 1.04; letter-spacing: -.06em; }
.funnel-app-story p { color: var(--funnel-muted); font-size: .9rem; line-height: 1.62; }
.funnel-app-story > img { display: block; width: 100%; height: 240px; border-radius: 16px; object-fit: cover; }
.funnel-app-story--screens > img { height: auto; aspect-ratio: 1; object-fit: cover; }

.funnel-how { padding: 96px 0 84px; }
.funnel-how h2 { max-width: 700px; margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2.3rem, 4.5vw, 4rem); line-height: 1; letter-spacing: -.06em; }
.funnel-how-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 36px; border-top: 1px solid var(--funnel-line); }
.funnel-how-list article { padding: 22px 22px 0 0; }
.funnel-how-list article + article { padding-left: 22px; border-left: 1px solid var(--funnel-line); }
.funnel-how-list span { display: block; color: var(--funnel-blue); font-size: .72rem; font-weight: 850; letter-spacing: .12em; }
.funnel-how-list h3 { margin: 13px 0 8px; color: var(--funnel-ink); font-size: 1rem; }
.funnel-how-list p { margin: 0; color: var(--funnel-muted); font-size: .83rem; line-height: 1.55; }
.funnel-closing { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 28px; padding: 56px 0 82px; border-top: 1px solid var(--funnel-line); }
.funnel-closing h2 { font-size: clamp(2.2rem, 4vw, 3.6rem); }
.funnel-closing p { max-width: 590px; margin: 13px 0 0; color: var(--funnel-muted); line-height: 1.6; }
.funnel-closing .landing-primary { min-height: 48px; padding-inline: 20px; white-space: nowrap; }
.funnel-resources { display: flex; flex-wrap: wrap; gap: 12px 24px; padding: 20px 0; border-top: 1px solid var(--funnel-line); color: #68758a; font-size: .82rem; }
.funnel-resources a { color: #42516a; font-weight: 700; }

/* Reusable detail-page system */
.product-shell { width: min(100% - 48px, 1180px); margin-inline: auto; }
.product-hero { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: center; gap: clamp(38px, 6vw, 88px); min-height: 610px; padding: 78px 0 74px; }
.product-hero h1 { max-width: 650px; margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(3rem, 5.8vw, 5.5rem); font-weight: 800; line-height: .98; letter-spacing: -.07em; }
.product-lead { max-width: 560px; margin: 22px 0 0; color: var(--funnel-muted); font-size: clamp(1rem, 1.4vw, 1.16rem); line-height: 1.68; }
.product-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 29px; }
.product-actions .button-link { min-height: 46px; padding-inline: 17px; }
.product-actions .landing-primary { border-color: var(--funnel-blue); background: var(--funnel-blue); color: #fff; }
.product-preview { overflow: hidden; border: 1px solid #d4deea; border-radius: 20px; background: #fff; box-shadow: 0 26px 65px rgba(29, 62, 110, .1); }
.product-preview--photo { display: flex; min-height: 420px; align-items: stretch; background: #efe4ce; }
.product-preview--photo img { width: 100%; height: 100%; min-height: 420px; object-fit: cover; }
.product-preview--screens { padding: 16px; background: #111f36; }
.product-preview--screens img { display: block; width: 100%; height: auto; border-radius: 9px; }
.product-preview-caption { padding: 13px 17px; color: #66758c; font-size: .75rem; }
.product-visual-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 18px; border-bottom: 1px solid #e6ebf2; color: #718097; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.product-visual-heading strong { color: var(--funnel-ink); font-size: .79rem; letter-spacing: 0; }
.product-visual-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 30px 20px; background: #f5f8fc; }
.product-visual-flow article { position: relative; display: grid; align-content: center; min-height: 245px; padding: 17px; border-right: 1px solid #dce4ef; }
.product-visual-flow article:last-child { border: 0; }
.product-visual-flow span { color: var(--funnel-blue); font-size: .66rem; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.product-visual-flow strong { margin-top: 12px; color: var(--funnel-ink); font-size: 1.1rem; }
.product-visual-flow small { margin-top: 8px; color: var(--funnel-muted); font-size: .78rem; line-height: 1.5; }
.product-section { padding: 82px 0; border-top: 1px solid var(--funnel-line); }
.product-section-heading { display: grid; grid-template-columns: 1fr minmax(240px, .6fr); align-items: end; gap: 36px; margin-bottom: 32px; }
.product-section-heading h2 { max-width: 700px; margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2.2rem, 4.5vw, 4rem); line-height: 1; letter-spacing: -.065em; }
.product-section-heading p { margin: 0 0 3px; color: var(--funnel-muted); font-size: .95rem; line-height: 1.65; }
.product-steps { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--funnel-line); }
.product-step { padding: 22px 22px 8px 0; }
.product-step + .product-step { padding-left: 22px; border-left: 1px solid var(--funnel-line); }
.product-step span { color: var(--funnel-blue); font-size: .74rem; font-weight: 850; letter-spacing: .1em; }
.product-step h3 { margin: 13px 0 8px; color: var(--funnel-ink); font-size: 1.08rem; }
.product-step p { margin: 0; color: var(--funnel-muted); font-size: .86rem; line-height: 1.62; }
.product-capabilities { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 54px; }
.product-capability { display: grid; grid-template-columns: 34px 1fr; gap: 16px; padding: 23px 0; border-top: 1px solid var(--funnel-line); }
.product-capability > span { color: var(--funnel-coral); font-size: .75rem; font-weight: 850; letter-spacing: .08em; }
.product-capability h3 { margin: 0; color: var(--funnel-ink); font-size: 1.03rem; }
.product-capability p { margin: 7px 0 0; color: var(--funnel-muted); font-size: .85rem; line-height: 1.6; }
.product-note { padding: 16px 18px; border-left: 3px solid var(--funnel-blue); background: var(--funnel-blue-soft); color: #40516d; font-size: .84rem; line-height: 1.6; }
.product-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 64px; padding: 76px 0; border-top: 1px solid var(--funnel-line); }
.product-faq h2 { max-width: 380px; margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2rem, 3.6vw, 3.1rem); line-height: 1.03; letter-spacing: -.06em; }
.product-faq-list { display: grid; align-content: start; }
.product-faq-list details { padding: 17px 0; border-bottom: 1px solid var(--funnel-line); }
.product-faq-list summary { color: var(--funnel-ink); font-size: .95rem; font-weight: 780; cursor: pointer; }
.product-faq-list details p { max-width: 650px; margin: 12px 0 0; color: var(--funnel-muted); font-size: .88rem; line-height: 1.65; }
.product-end { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 42px 0 72px; border-top: 1px solid var(--funnel-line); }
.product-end h2 { margin: 0; color: var(--funnel-ink); font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(2rem, 3.8vw, 3.3rem); line-height: 1; letter-spacing: -.06em; }
.product-end p { max-width: 600px; margin: 12px 0 0; color: var(--funnel-muted); line-height: 1.6; }
.product-downloads { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.product-downloads a { color: var(--funnel-blue); font-size: .86rem; font-weight: 800; }
.product-footer { width: min(100% - 48px, 1180px); margin: 0 auto; padding: 22px 0 38px; border-top: 1px solid var(--funnel-line); color: #79859a; font-size: .78rem; }
.product-footer nav { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-top: 14px; }
.product-footer a { color: #526078; font-weight: 700; }

@media (max-width: 980px) {
    .funnel-section, .product-shell { width: min(100% - 40px, 760px); }
    .funnel-chapter { grid-template-columns: 1fr; gap: 28px; }
    .funnel-chapter--reverse .funnel-chapter-copy, .funnel-chapter--reverse .funnel-visual { order: initial; }
    .funnel-chapter-copy { max-width: 680px; }
    .funnel-app-grid { grid-template-columns: 1fr; }
    .funnel-app-story + .funnel-app-story { padding: 38px 0 0; border-top: 1px solid var(--funnel-line); border-left: 0; }
    .product-hero { grid-template-columns: 1fr; min-height: unset; padding: 60px 0; }
    .product-hero-copy { max-width: 740px; }
    .product-preview { max-width: 760px; }
}
@media (max-width: 700px) {
    .funnel-section, .product-shell { width: min(100% - 32px, 560px); }
    .pocketpapi-funnel-home .landing-hero { padding-top: 42px; padding-bottom: 48px; }
    .pocketpapi-funnel-home .landing-hero h1 { font-size: clamp(2.8rem, 12vw, 4rem); }
    .pocketpapi-funnel-home .landing-hero-copy > p:not(.landing-eyebrow) { font-size: 1rem; }
    .funnel-intro { grid-template-columns: 1fr; gap: 16px; padding-top: 68px; }
    .funnel-intro h2 { font-size: clamp(2.5rem, 11vw, 3.6rem); }
    .funnel-path { grid-template-columns: 1fr; gap: 2px; padding: 16px 0; }
    .funnel-path a { min-height: 46px; padding: 4px 0; }
    .funnel-path a:not(:last-child)::after { top: auto; right: auto; bottom: -1px; left: 16px; width: 1px; height: 9px; }
    .funnel-chapter { padding: 56px 0; }
    .funnel-chapter-copy h2 { font-size: clamp(2.35rem, 10vw, 3.3rem); }
    .funnel-points { grid-template-columns: 1fr; }
    .funnel-web-flow { grid-template-columns: 1fr; }
    .funnel-web-flow article { min-height: 125px; border-right: 0; border-bottom: 1px solid #e5ebf3; }
    .funnel-web-flow article:last-child { border-bottom: 0; }
    .funnel-web-flow article:not(:last-child)::after { top: auto; right: 50%; bottom: -6px; transform: rotate(135deg); }
    .funnel-screen-preview { grid-template-columns: 1fr; }
    .funnel-screen-main { min-height: 230px; }
    .funnel-screen-side { grid-template-columns: 1fr 1fr; }
    .funnel-screen-side article { min-height: 122px; padding: 14px; }
    .funnel-people-preview { grid-template-columns: 1fr; }
    .funnel-day-flow { border-top: 1px solid #d9e1ed; border-left: 0; }
    .funnel-crm-preview { grid-template-columns: 1fr; }
    .funnel-pipeline { padding: 12px; }
    .funnel-customer-activity { border-top: 1px solid #e0e7f0; border-left: 0; }
    .funnel-app-story { grid-template-columns: 1fr; }
    .funnel-app-story > img { height: 220px; }
    .funnel-app-story--screens > img { max-height: 340px; }
    .funnel-how { padding: 68px 0; }
    .funnel-how-list { grid-template-columns: 1fr 1fr; }
    .funnel-how-list article { padding: 18px 12px 18px 0; }
    .funnel-how-list article + article { padding-left: 12px; }
    .funnel-how-list article:nth-child(3) { padding-left: 0; border-left: 0; }
    .funnel-how-list article:nth-child(n+3) { border-top: 1px solid var(--funnel-line); }
    .funnel-closing { grid-template-columns: 1fr; padding: 42px 0 62px; }
    .funnel-closing .landing-primary { justify-self: start; }
    .product-hero { gap: 30px; padding: 42px 0 50px; }
    .product-hero h1 { font-size: clamp(2.8rem, 12vw, 4.2rem); }
    .product-lead { font-size: 1rem; }
    .product-preview--photo, .product-preview--photo img { min-height: 310px; }
    .product-visual-flow { grid-template-columns: 1fr; padding: 12px 20px; }
    .product-visual-flow article { min-height: 150px; border-right: 0; border-bottom: 1px solid #dce4ef; }
    .product-visual-flow article:last-child { border-bottom: 0; }
    .product-section { padding: 60px 0; }
    .product-section-heading { grid-template-columns: 1fr; gap: 14px; }
    .product-steps { grid-template-columns: 1fr; }
    .product-step { padding: 19px 0; }
    .product-step + .product-step { padding-left: 0; border-left: 0; border-top: 1px solid var(--funnel-line); }
    .product-capabilities { grid-template-columns: 1fr; }
    .product-faq { grid-template-columns: 1fr; gap: 22px; padding: 58px 0; }
    .product-end { align-items: flex-start; flex-direction: column; padding-bottom: 56px; }
}
@media (prefers-reduced-motion: reduce) {
    .funnel-link svg { transition: none; }
}

/* Pixel-matched public funnel system: calm cool neutrals, editorial type, and
   product-specific interface previews instead of interchangeable feature cards. */
body.pocketpapi-funnel-home,
body.pocketpapi-product-page {
    --funnel-ink: #13233f;
    --funnel-muted: #65748b;
    --funnel-line: #dce4ef;
    --funnel-blue: #155eef;
    --funnel-blue-soft: #eef4ff;
    --funnel-coral: #ff8a67;
    --funnel-surface: #fff;
    background: #f7f9fc;
    color: var(--funnel-ink);
}
body.pocketpapi-funnel-home .landing-nav,
body.pocketpapi-product-page .landing-nav {
    width: min(calc(100% - 128px), 1376px);
    min-height: 82px;
    margin-inline: auto;
    border-bottom: 1px solid #e3e9f1;
}
body.pocketpapi-funnel-home .landing-nav .auth-brand,
body.pocketpapi-product-page .landing-nav .auth-brand {
    gap: 10px;
    color: var(--funnel-ink);
    font-size: 1.05rem;
    font-weight: 820;
    letter-spacing: -.055em;
}
.funnel-brand-mark {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 10px 10px 10px 4px;
    background: var(--funnel-blue);
    color: #fff;
    font-size: 1rem;
    font-weight: 850;
    letter-spacing: -.08em;
}
body.pocketpapi-funnel-home .landing-nav nav,
body.pocketpapi-product-page .landing-nav nav {
    gap: clamp(14px, 2vw, 29px);
}
body.pocketpapi-funnel-home .landing-nav nav a:not(.button-link),
body.pocketpapi-product-page .landing-nav nav a:not(.button-link) {
    color: #536178;
    font-size: .81rem;
    font-weight: 670;
    text-decoration: none;
}
body.pocketpapi-funnel-home .landing-nav nav a:not(.button-link):hover,
body.pocketpapi-product-page .landing-nav nav a:not(.button-link):hover { color: var(--funnel-blue); }
body.pocketpapi-funnel-home .landing-nav .button-link,
body.pocketpapi-product-page .landing-nav .button-link,
body.pocketpapi-product-page .landing-primary,
body.pocketpapi-funnel-home .landing-primary {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 18px;
    border: 1px solid var(--funnel-blue);
    border-radius: 9px;
    background: var(--funnel-blue);
    color: #fff !important;
    font-size: .82rem;
    font-weight: 780;
    text-decoration: none;
    box-shadow: 0 7px 16px rgba(21, 94, 239, .15);
}
body.pocketpapi-funnel-home .landing-nav .button-link:hover,
body.pocketpapi-product-page .landing-nav .button-link:hover,
body.pocketpapi-product-page .landing-primary:hover,
body.pocketpapi-funnel-home .landing-primary:hover { background: #0d4fd0; }

/* Homepage first viewport */
.pocketpapi-funnel-home .landing-shell { width: 100%; max-width: none; }
.pocketpapi-funnel-home .landing-hero {
    width: min(calc(100% - 128px), 1376px);
    min-height: 605px;
    grid-template-columns: minmax(0, .91fr) minmax(0, 1.09fr);
    gap: clamp(40px, 5vw, 76px);
    margin: 0 auto;
    padding: 54px 0 62px;
}
.pocketpapi-funnel-home .landing-hero-copy { align-self: center; min-width: 0; }
.pocketpapi-funnel-home .landing-eyebrow,
.pocketpapi-product-page .product-hero-copy .landing-eyebrow {
    margin: 0 0 17px;
    color: var(--funnel-blue);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}
.pocketpapi-funnel-home .landing-hero h1 {
    max-width: 590px;
    color: var(--funnel-ink);
    font-size: clamp(3.1rem, 4.15vw, 4.05rem);
    font-weight: 790;
    line-height: .99;
    letter-spacing: -.067em;
}
.pocketpapi-funnel-home .landing-hero-copy > p:not(.landing-eyebrow) {
    max-width: 555px;
    margin: 22px 0 0;
    color: var(--funnel-muted);
    font-size: 1.02rem;
    line-height: 1.67;
}
.home-hero-actions { display: flex; align-items: center; gap: 23px; flex-wrap: wrap; margin-top: 27px; }
.home-hero-actions > a:not(.landing-primary) { color: #354967; font-size: .83rem; font-weight: 760; text-decoration: none; }
.home-hero-actions > a:not(.landing-primary):hover { color: var(--funnel-blue); }
.home-hero-proof { display: flex; flex-wrap: wrap; gap: 10px 21px; margin-top: 24px; color: #68778c; font-size: .73rem; font-weight: 680; }
.home-hero-proof span { display: inline-flex; align-items: center; gap: 7px; }
.home-hero-proof i { color: #278776; font-size: .8rem; font-style: normal; font-weight: 900; }
.home-hero-visual {
    position: relative;
    align-self: stretch;
    min-width: 0;
    min-height: 490px;
    overflow: visible;
    border-radius: 18px;
    background: #dbe5ef;
    isolation: isolate;
}
.home-hero-photo { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: inherit; object-fit: cover; object-position: 64% center; }
.home-hero-visual::after { position: absolute; z-index: 0; inset: 0; border-radius: inherit; background: linear-gradient(90deg, rgba(9,24,46,.06), transparent 36%, rgba(10,24,43,.12)); content: ""; pointer-events: none; }
.home-photo-caption { position: absolute; right: 22px; bottom: 17px; left: 22px; z-index: 1; display: flex; justify-content: space-between; gap: 15px; color: rgba(255,255,255,.91); font-size: .64rem; font-weight: 720; text-shadow: 0 1px 4px rgba(8,20,35,.55); }
.home-photo-caption span:first-child { letter-spacing: .025em; }
.home-photo-caption span:last-child { font-weight: 580; }
.landing-onboarding-card {
    position: absolute;
    z-index: 2;
    top: 50%;
    right: 22px;
    width: min(365px, calc(100% - 44px));
    max-width: none;
    padding: 23px 24px 21px;
    transform: translateY(-50%);
    border: 1px solid rgba(220,228,239,.95);
    border-radius: 15px;
    background: rgba(255,255,255,.98);
    box-shadow: 0 22px 64px rgba(12,31,58,.2);
}
.landing-onboarding-card .onboarding-card-heading { margin-bottom: 16px; }
.landing-onboarding-card .onboarding-step-label { color: var(--funnel-blue); font-size: .61rem; font-weight: 850; letter-spacing: .11em; text-transform: uppercase; }
.landing-onboarding-card .onboarding-card-heading h2 { margin: 7px 0 0; color: var(--funnel-ink); font-size: 1.27rem; line-height: 1.13; letter-spacing: -.045em; }
.landing-onboarding-card .onboarding-card-heading p { margin: 7px 0 0; color: var(--funnel-muted); font-size: .75rem; line-height: 1.5; }
.landing-onboarding-card label { gap: 6px; margin: 12px 0 0; color: #475872; font-size: .68rem; font-weight: 750; }
.landing-onboarding-card input { min-height: 42px; padding: 0 11px; border-color: #dce4ef; border-radius: 8px; color: var(--funnel-ink); font-size: .75rem; }
.landing-onboarding-card .onboarding-form-grid { gap: 10px; }
.landing-onboarding-card .onboarding-form-grid label { min-width: 0; }
.landing-onboarding-card .landing-onboarding-submit,
.landing-onboarding-card .onboarding-email-step .landing-primary { min-height: 45px; margin-top: 16px; border-radius: 8px; background: var(--funnel-blue); font-size: .76rem; box-shadow: none; }
.landing-onboarding-card .onboarding-asset-details { margin-top: 13px; border-top: 1px solid #e8edf4; padding-top: 11px; }
.landing-onboarding-card .onboarding-asset-details summary { color: #61718a; font-size: .68rem; font-weight: 700; cursor: pointer; }
.landing-onboarding-card .onboarding-asset-details summary span { color: #8b97a8; font-weight: 550; }
.landing-onboarding-card .onboarding-asset-intake { margin: 10px 0 0; padding: 0; border: 0; background: none; }
.landing-onboarding-card .onboarding-asset-intake .onboarding-form-grid { grid-template-columns: 1fr; }
.landing-onboarding-card input[type=file] { min-height: 38px; padding: 7px; font-size: .66rem; }
.landing-onboarding-card .onboarding-asset-intake label { margin-top: 8px; }
.landing-onboarding-card .onboarding-error { font-size: .68rem; }
.landing-onboarding-card .onboarding-privacy { margin-top: 9px; }
.landing-onboarding-card .onboarding-status-list li { min-height: 60px; }
.landing-onboarding-card .onboarding-status-list strong { color: var(--funnel-ink); }
.landing-onboarding-card .onboarding-status-list small { color: #738198; }
.landing-onboarding-card .onboarding-status-list li.is-active > i { border-color: var(--funnel-blue); border-top-color: transparent; }
.landing-onboarding-card .onboarding-status-list li.is-active em { color: var(--funnel-blue); }
.landing-onboarding-card .onboarding-email-step { margin-top: 14px; padding-top: 14px; }

/* Full homepage funnel and in-flow product vignettes */
.funnel-section { width: min(calc(100% - 128px), 1376px); }
.funnel-proof {
    display: flex;
    width: 100%;
    min-height: 104px;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    padding: 20px max(64px, calc((100% - 1376px)/2));
    border: 0;
    background: #142441;
    color: #fff;
}
.funnel-proof::before { content: "One workday. Fewer handoffs."; margin-right: auto; color: #fff; font-family: "Avenir Next", "SF Pro Display", "Segoe UI", sans-serif; font-size: clamp(1.3rem, 2.1vw, 2rem); font-weight: 790; letter-spacing: -.045em; white-space: nowrap; }
.funnel-proof span { color: #dce7f6; font-size: .7rem; font-weight: 680; white-space: nowrap; }
.funnel-intro { grid-template-columns: 1fr; gap: 10px; padding: 68px 0 22px; }
.funnel-intro h2 { font-size: clamp(2.1rem, 3.2vw, 3rem); }
.funnel-intro p { max-width: 650px; font-size: .9rem; }
.funnel-path { grid-template-columns: repeat(5,minmax(0,1fr)); padding: 14px 0 17px; }
.funnel-path a { font-size: .78rem; }
.funnel-chapter { padding-block: 74px; }
.funnel-chapter-copy h2 { font-size: clamp(2.15rem,3.4vw,3.1rem); line-height: 1.02; }
.funnel-chapter-copy > p:not(.funnel-overline) { font-size: .92rem; line-height: 1.63; }
.funnel-points { gap: 0 18px; }
.funnel-points li { font-size: .76rem; }
.funnel-visual { border-color: #dce4ef; border-radius: 17px; box-shadow: 0 20px 52px rgba(28,50,83,.095); }
.funnel-visual-head { min-height: 50px; padding-inline: 17px; background: #fff; }
.funnel-web-flow { padding: 22px; background: #eef3f9; }
.funnel-web-flow article { min-height: 170px; padding: 16px; background: #fff; }
.funnel-web-flow article:first-child { border-radius: 11px 0 0 11px; }
.funnel-web-flow article:last-child { border-radius: 0 11px 11px 0; }
.funnel-people-preview { background: #f1f5fa; }
.funnel-pipeline section h3 { font-size: .72rem; }
.funnel-customer-activity { min-height: 190px; }
.funnel-app-grid { gap: 22px; }
.funnel-app-story { border-color: #dce4ef; border-radius: 17px; box-shadow: 0 16px 38px rgba(28,50,83,.07); }
.funnel-app-story h2 { font-size: clamp(1.5rem,2vw,2rem); }
.funnel-how { padding-block: 76px; }
.funnel-how > h2 { max-width: 760px; color: var(--funnel-ink); font-size: clamp(2.3rem,4vw,3.7rem); }
.funnel-how-list article { border-color: var(--funnel-line); }
.funnel-how-list article > span { color: var(--funnel-blue); }
.funnel-how-list h3 { color: var(--funnel-ink); }
.funnel-how-list p { color: var(--funnel-muted); }
.funnel-closing { border-color: var(--funnel-line); }
.funnel-closing > div > p:last-child { color: var(--funnel-muted); }
.funnel-resources { padding-block: 18px 35px; }

/* Product page shell and oversized, reference-proportioned hero */
.product-shell,
.crm-product-shell { width: min(calc(100% - 128px), 1376px); max-width: none; }
.product-hero {
    grid-template-columns: minmax(0,.84fr) minmax(0,1.16fr);
    gap: clamp(38px,5vw,76px);
    min-height: 610px;
    padding: 52px 0 62px;
}
.product-hero-copy { align-self: center; max-width: 520px; min-width: 0; }
.product-hero h1,
.crm-product-hero-copy h1 {
    max-width: 550px;
    margin: 0;
    color: var(--funnel-ink);
    font-size: clamp(3.05rem, 4.1vw, 4.05rem);
    font-weight: 790;
    line-height: .99;
    letter-spacing: -.067em;
}
.product-lead,
.crm-product-hero-copy > p:not(.landing-eyebrow) { max-width: 510px; margin: 20px 0 0; color: var(--funnel-muted); font-size: 1rem; line-height: 1.67; }
.product-actions { display: flex; align-items: center; gap: 21px; flex-wrap: wrap; margin-top: 26px; }
.product-actions > a:not(.landing-primary) { color: #354967; font-size: .82rem; font-weight: 750; text-decoration: none; }
.product-downloads { gap: 12px 18px; margin-top: 17px; }
.product-downloads a { font-size: .72rem; }
.product-mock {
    position: relative;
    align-self: center;
    width: 100%;
    min-width: 0;
    min-height: 485px;
    overflow: hidden;
    border: 1px solid #d9e2ed;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 58px rgba(27,48,79,.11);
}
.product-scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* POS photographed terminal with a true HTML order screen */
.product-mock--pos { min-height: 505px; background: #d5e0e7; }
.product-mock--pos .product-scene { object-position: 55% center; }
.pos-terminal-ui {
    position: absolute;
    top: 29.5%;
    left: 51%;
    display: grid;
    width: 45%;
    height: 31%;
    overflow: hidden;
    clip-path: polygon(9% 0,100% 13%,88% 100%,0 84%);
    background: #fff;
    color: #17263f;
    transform: rotate(-1deg);
}
.pos-ui-header { display: flex; align-items: center; justify-content: space-between; padding: 2.5% 6% 1.5% 10%; border-bottom: 1px solid #e9edf2; background: #fff; }
.pos-ui-header b { color: #112544; font-size: clamp(6px,.7vw,10px); letter-spacing: -.05em; }
.pos-ui-header b span { color: #155eef; }
.pos-ui-header small { color: #738198; font-size: clamp(4px,.45vw,7px); letter-spacing: .08em; }
.pos-ui-header i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: #36a886; }
.pos-ui-body { display: grid; grid-template-columns: 1.15fr .85fr; min-height: 0; padding: 3% 6% 2% 10%; gap: 5%; }
.pos-menu,.pos-ticket { display: grid; align-content: start; gap: 5%; min-width: 0; }
.pos-menu > small,.pos-ticket > small { color: #8390a1; font-size: clamp(4px,.43vw,7px); font-weight: 850; letter-spacing: .1em; }
.pos-menu > b { display: flex; justify-content: space-between; gap: 5px; padding: 4% 0; border-bottom: 1px solid #edf0f5; color: #33445f; font-size: clamp(5px,.54vw,8px); }
.pos-menu > b span { color: #697891; }
.pos-menu button,.pos-ticket button { padding: 4% 6%; border: 0; border-radius: 4px; background: #155eef; color: #fff; font-size: clamp(4px,.48vw,7px); font-weight: 750; }
.pos-ticket { padding: 6%; border: 1px solid #e4eaf1; border-radius: 5px; background: #f7f9fc; }
.pos-ticket strong { color: #162744; font-size: clamp(5px,.58vw,9px); }
.pos-ticket > span { color: #68778d; font-size: clamp(4px,.42vw,6px); }
.pos-ticket > b { display: flex; justify-content: space-between; border-top: 1px solid #e0e6ef; padding-top: 5%; color: #283953; font-size: clamp(4px,.44vw,7px); }
.pos-ticket em { color: #142745; font-style: normal; }
.pos-status-float { position: absolute; top: 11%; left: 6%; display: grid; grid-template-columns: 9px auto; align-items: center; gap: 4px 7px; min-width: 175px; padding: 12px 15px; border: 1px solid rgba(226,233,241,.9); border-radius: 11px; background: rgba(255,255,255,.96); box-shadow: 0 10px 28px rgba(17,36,66,.17); }
.pos-status-float .status-dot { grid-row: span 2; width: 8px; height: 8px; border-radius: 50%; background: #39a889; }
.pos-status-float strong { color: #192b48; font-size: .74rem; }
.pos-status-float span:last-child { grid-column: 2; color: #738097; font-size: .61rem; }

/* Team + time: staff, weekly shifts and clock status in one panel */
.product-mock--team { min-height: 505px; overflow: visible; padding: 25px 19px 23px; background: linear-gradient(145deg,#eaf1fb,#f9fbfd 65%); }
.team-dash-window { height: 100%; overflow: hidden; border: 1px solid #dce4ef; border-radius: 13px; background: #fff; box-shadow: 0 12px 30px rgba(26,50,87,.09); }
.team-dash-bar { display: flex; min-height: 43px; align-items: center; gap: 11px; padding: 0 14px; border-bottom: 1px solid #e9edf3; color: #77859a; font-size: .57rem; }
.team-dash-bar > b { color: #1b2e4c; font-size: .7rem; }
.team-dash-bar > span:nth-of-type(2) { margin-right: auto; }
.dash-dots { display: flex; gap: 4px; }
.dash-dots i { width: 6px; height: 6px; border-radius: 50%; background: #d4dce7; }
.team-dash-bar button { padding: 6px 8px; border: 1px solid #e0e6ef; border-radius: 6px; background: #fff; color: #53647d; font: inherit; }
.team-dash-heading { display: flex; align-items: center; justify-content: space-between; padding: 19px 18px 13px; }
.team-dash-heading > div { display: grid; gap: 5px; }
.team-dash-heading small,.team-roster > header,.team-schedule > header { color: #75849a; font-size: .52rem; font-weight: 820; letter-spacing: .09em; }
.team-dash-heading strong { color: #182b49; font-size: 1.04rem; letter-spacing: -.04em; }
.team-on-shift { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid #dceee8; border-radius: 30px; background: #f2faf6; color: #398d70; font-size: .58rem; font-weight: 740; }
.team-on-shift i { width: 6px; height: 6px; border-radius: 50%; background: #39a889; }
.team-dash-content { display: grid; grid-template-columns: minmax(0,.88fr) minmax(0,1.12fr); gap: 13px; padding: 0 13px 14px; }
.team-roster,.team-schedule { min-width: 0; padding: 12px; border: 1px solid #e7ecf3; border-radius: 9px; }
.team-roster > header,.team-schedule > header { display: flex; justify-content: space-between; margin-bottom: 10px; }
.team-roster > header span,.team-schedule > header span { color: #5574a1; font-size: .49rem; letter-spacing: 0; }
.team-roster article { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: center; gap: 7px; min-height: 51px; border-top: 1px solid #eff2f6; }
.team-roster article > span { display: grid; gap: 3px; min-width: 0; }
.team-roster article b { overflow: hidden; color: #283b57; font-size: .58rem; text-overflow: ellipsis; white-space: nowrap; }
.team-roster article small { overflow: hidden; color: #7b899c; font-size: .47rem; text-overflow: ellipsis; white-space: nowrap; }
.team-roster article em { color: #40896f; font-size: .45rem; font-style: normal; white-space: nowrap; }
.avatar { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 50%; background: #e8efff; color: #4c69b2; font-size: .48rem; font-style: normal; font-weight: 800; }
.avatar--peach { background: #fff0e8; color: #b86b50; }.avatar--green { background:#e7f5ef;color:#43856e }.avatar--lilac{background:#f0ecfc;color:#7462a8}
.schedule-days,.schedule-lanes { display: grid; grid-template-columns: 48px repeat(4,minmax(0,1fr)); align-items: center; gap: 4px; }
.schedule-days { min-height: 42px; border-bottom: 1px solid #edf1f6; text-align: center; }
.schedule-days b { color: #64748a; font-size: .47rem; line-height: 1.35; }.schedule-days small { color: #8b97a7; font-size: .45rem; font-weight: 550; }
.schedule-lanes { min-height: 47px; border-bottom: 1px solid #f0f3f7; }
.schedule-lanes > span { overflow: hidden; color: #78879b; font-size: .45rem; text-overflow: ellipsis; }
.shift-block { grid-column: span 2; overflow: hidden; padding: 6px 4px; border-radius: 4px; background: #edf3ff; color: #4670b7; font-size: .43rem; font-style: normal; text-align: center; white-space: nowrap; }
.shift-block--two { background:#e8f6f0;color:#3e8a70 }.shift-block--three{background:#fff1e9;color:#ac6b50}
.team-clock-float,.team-coverage-float { position: absolute; display: grid; gap: 4px; padding: 12px 15px; border: 1px solid #e2e9f2; border-radius: 10px; background: rgba(255,255,255,.97); box-shadow: 0 12px 28px rgba(25,48,82,.12); }
.team-clock-float { top: 18%; right: -15px; grid-template-columns: 28px 1fr auto; align-items: center; gap: 9px; }
.clock-icon { display: grid; width: 27px; height: 27px; place-items: center; border-radius: 8px; background: #edf4ff; color: #3367bc; font-size: 1rem; }
.team-clock-float > span:nth-child(2) { display: grid; gap: 3px; }.team-clock-float small,.team-coverage-float > span { color:#7b899c;font-size:.47rem;font-weight:820;letter-spacing:.07em }.team-clock-float strong,.team-coverage-float strong{color:#263a57;font-size:.67rem}.team-clock-float > i{color:#349476;font-size:.54rem;font-style:normal}
.team-coverage-float { right: -11px; bottom: 9%; min-width: 195px; }
.team-coverage-float small { color: #7a899c; font-size: .55rem; }

/* Pocket Papi app: native-feeling device screen plus contextual Phone/site cards */
.product-mock--app { display: grid; grid-template-columns: minmax(150px,1fr) 245px minmax(150px,1fr); align-items: center; gap: clamp(8px,2vw,25px); min-height: 520px; overflow: visible; padding: 18px; border: 0; background: radial-gradient(ellipse at 50% 50%,#e4edfb 0, #f3f6fb 53%,#e9eef7 100%); box-shadow: none; }
.app-phone { position: relative; z-index: 2; height: 486px; padding: 8px; border: 1px solid #344158; border-radius: 35px; background: #17243a; box-shadow: 0 24px 52px rgba(19,37,67,.26),inset 0 0 0 2px #344158; }
.app-phone::before { position:absolute;z-index:4;top:12px;left:50%;width:78px;height:17px;border-radius:12px;background:#17243a;content:"";transform:translateX(-50%) }
.app-phone-screen { position:relative;display:flex;height:100%;flex-direction:column;overflow:hidden;border-radius:27px;background:#fff }
.app-phone-status { display:flex;justify-content:space-between;padding:12px 13px 4px;color:#243552;font-size:.48rem;font-weight:800 }
.app-phone-top { display:flex;justify-content:space-between;padding:14px 14px 11px;border-bottom:1px solid #eff2f6;color:#1a2d4b;font-size:.65rem }
.app-phone-top span { color:#8290a2;letter-spacing:.13em }
.app-phone-greeting { display:grid;gap:5px;padding:15px 15px 12px }
.app-phone-greeting small { color:#6480a4;font-size:.47rem;font-weight:850;letter-spacing:.1em }
.app-phone-greeting strong { color:#1b2d49;font-size:1rem;letter-spacing:-.04em }
.app-phone-greeting span { color:#7b899c;font-size:.55rem }
.app-phone-metric { display:flex;justify-content:space-between;margin:0 12px;padding:9px 10px;border:1px solid #e4ebf4;border-radius:8px;background:#f6f9fd;color:#596a81;font-size:.54rem }
.app-phone-metric b { color:#315fa8;font-size:.52rem }.app-phone-metric i{color:#298f71;font-size:.45rem;font-style:normal}
.app-phone-lead { display:grid;grid-template-columns:28px 1fr 10px;align-items:center;gap:7px;padding:11px 13px;border-bottom:1px solid #eff2f6 }
.lead-avatar { display:grid;width:27px;height:27px;place-items:center;border-radius:50%;background:#eaf0ff;color:#5270b1;font-size:.48rem;font-weight:800 }.lead-avatar--peach{background:#fff0e8;color:#b7795f}
.app-phone-lead > span:nth-child(2) { display:grid;gap:3px;min-width:0 }.app-phone-lead b{overflow:hidden;color:#31435f;font-size:.55rem;text-overflow:ellipsis;white-space:nowrap}.app-phone-lead small{overflow:hidden;color:#7e8ca0;font-size:.46rem;text-overflow:ellipsis;white-space:nowrap}.app-phone-lead > i{color:#98a5b5;font-style:normal}
.app-phone-section { display:grid;gap:5px;margin:12px;padding:10px;border:1px solid #e5ebf3;border-radius:8px;background:#fff }
.app-phone-section > span { color:#6780a0;font-size:.43rem;font-weight:850;letter-spacing:.08em }.app-phone-section b{display:flex;justify-content:space-between;color:#344660;font-size:.51rem}.app-phone-section b i{display:grid;width:15px;height:15px;place-items:center;border-radius:50%;background:#155eef;color:#fff;font-size:.4rem;font-style:normal}.app-phone-section small{color:#8390a1;font-size:.45rem}
.app-phone-tabbar { display:flex;justify-content:space-around;margin-top:auto;padding:10px 5px 8px;border-top:1px solid #ebeff4;color:#6a7d99;font-size:.66rem;text-align:center }
.app-phone-tabbar span { display:grid;gap:3px }.app-phone-tabbar small{font-size:.42rem}
.app-side-card { position:relative;z-index:1;display:grid;gap:9px;min-width:0;padding:16px 14px;border:1px solid #dfe7f0;border-radius:13px;background:rgba(255,255,255,.96);box-shadow:0 14px 38px rgba(27,47,77,.1) }
.app-side-card > small { color:#76869d;font-size:.49rem;font-weight:850;letter-spacing:.08em }.app-side-card > strong{color:#203451;font-size:.84rem;letter-spacing:-.03em}
.app-side-card--phone { transform:translateY(20px) }.app-side-card--tools { transform:translateY(-9px) }
.app-call-avatar { display:grid;width:40px;height:40px;place-items:center;margin:4px auto 0;border-radius:50%;background:#eaf0ff;color:#4668af;font-size:.73rem;font-weight:800 }
.app-side-card--phone > b,.app-side-card--phone > span:not(.app-call-avatar) { color:#52647d;font-size:.59rem;text-align:center }.app-side-card--phone > span:not(.app-call-avatar){color:#8591a2;font-size:.51rem}
.app-call-wave { display:flex;height:25px;align-items:center;justify-content:center;gap:4px }.app-call-wave i{width:3px;border-radius:4px;background:#86a8e9}.app-call-wave i:nth-child(3n){height:18px}.app-call-wave i:nth-child(3n + 1){height:10px}.app-call-wave i:nth-child(3n + 2){height:14px}
.app-side-card a { display:flex;justify-content:space-between;padding-top:10px;border-top:1px solid #edf1f5;color:#155eef;font-size:.55rem;font-weight:750;text-decoration:none }
.app-side-card--tools article { display:grid;grid-template-columns:27px 1fr 10px;align-items:center;gap:7px;padding:8px 0;border-top:1px solid #eff2f6 }.app-side-card--tools article > i{display:grid;width:25px;height:25px;place-items:center;border-radius:7px;background:#eef4ff;color:#4773bb;font-size:.76rem;font-style:normal}.app-side-card--tools article > span{display:grid;gap:2px}.app-side-card--tools article b{color:#41536e;font-size:.53rem}.app-side-card--tools article small{color:#8894a5;font-size:.45rem}.app-side-card--tools article em{color:#98a4b3;font-size:.7rem;font-style:normal}

/* Screens: real venue image with separately-rendered menu/remote UI */
.product-mock--screens { min-height: 510px; background: #dce6ef; }
.product-mock--screens .product-scene { object-position:center; }
.screens-display-ui { position:absolute;top:8.2%;left:46.7%;display:grid;width:41%;height:36.3%;padding:2% 2.1% 1.5%;background:#122440;color:#fff;box-shadow:0 1px 6px rgba(0,0,0,.22); }
.screens-ui-top,.screens-ui-bottom { display:flex;justify-content:space-between;align-items:center;color:#bdcde1;font-size:clamp(4px,.47vw,7px);letter-spacing:.07em }
.screens-ui-main { display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:3%;padding:2% 1% }
.screens-ui-main > small { grid-column:1/-1;color:#9bb5d7;font-size:clamp(4px,.43vw,6px);font-weight:850;letter-spacing:.12em }
.screens-ui-main > strong { color:#fff;font-size:clamp(10px,1.42vw,21px);line-height:1.05;letter-spacing:-.05em }
.screens-ui-main > div { display:grid;gap:4px;padding:8% 7%;border:1px solid #3a5272;border-radius:4px;background:#1c3557 }
.screens-ui-main > div span { display:flex;justify-content:space-between;gap:5px;color:#d8e3f0;font-size:clamp(4px,.39vw,6px);white-space:nowrap }.screens-ui-main > div b{color:#fff}
.screens-ui-bottom { padding-top:4px;border-top:1px solid #344d6e;font-size:clamp(3px,.35vw,5px) }
.screens-remote-card { position:absolute;right:4%;bottom:5%;display:grid;width:205px;gap:9px;padding:14px;border:1px solid #e1e8f0;border-radius:12px;background:rgba(255,255,255,.98);box-shadow:0 15px 34px rgba(18,39,68,.2) }
.screens-remote-card > span { color:#72839a;font-size:.47rem;font-weight:850;letter-spacing:.09em }.screens-remote-card > strong{color:#213651;font-size:.78rem}
.screens-remote-card article { display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:7px;padding:7px 0;border-top:1px solid #edf1f5 }.screens-remote-card article i{display:grid;width:25px;height:25px;place-items:center;border-radius:6px;background:#edf4ff;color:#4d75b5;font-size:.7rem;font-style:normal}.screens-remote-card article b{color:#465a75;font-size:.53rem}.screens-remote-card article em{color:#3f987a;font-size:.47rem;font-style:normal;font-weight:750}
.screens-remote-card button { display:flex;justify-content:space-between;padding:9px 10px;border:0;border-radius:7px;background:#155eef;color:#fff;font-size:.54rem;font-weight:750 }

/* Details below hero */
.product-section { padding: 69px 0; }
.product-section-heading { grid-template-columns: minmax(0,1fr) minmax(270px,.56fr); gap: 40px; margin-bottom: 27px; }
.product-section-heading h2 { font-size: clamp(2.1rem,3.5vw,3.2rem); }
.product-section-heading p { font-size: .87rem; }
.product-step { padding: 18px 22px 6px 0; }.product-step + .product-step { padding-left:22px; }
.product-step h3 { font-size: .97rem; }.product-step p { font-size: .78rem; }
.product-capabilities { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0 32px; }
.product-capability { grid-template-columns: 28px minmax(0,1fr); gap: 12px; padding: 20px 0; }
.product-capability > span { color: var(--funnel-blue); }.product-capability h3 { font-size:.91rem }.product-capability p { font-size:.77rem;line-height:1.55 }
.product-note { margin-top: 9px; border-radius: 0 8px 8px 0; font-size: .75rem; }
.product-faq { gap: 48px; padding: 62px 0; }
.product-faq h2 { font-size: clamp(1.9rem,3.2vw,2.65rem); }
.product-faq-list summary { font-size:.84rem }.product-faq-list details p{font-size:.78rem}
.product-end { padding: 35px 0 59px; }.product-end h2{font-size:clamp(1.9rem,3vw,2.8rem)}.product-end p{font-size:.85rem}
.product-footer { width:min(calc(100% - 128px),1376px);padding-bottom:32px }

@media (max-width: 1080px) {
    body.pocketpapi-funnel-home .landing-nav, body.pocketpapi-product-page .landing-nav,
    .pocketpapi-funnel-home .landing-hero,.funnel-section,.product-shell,.crm-product-shell,.product-footer { width:min(calc(100% - 64px),900px); }
    .pocketpapi-funnel-home .landing-hero { min-height:550px;gap:34px;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr) }
    .pocketpapi-funnel-home .landing-hero h1,.product-hero h1,.crm-product-hero-copy h1{font-size:clamp(2.8rem,5vw,3.6rem)}
    .home-hero-visual{min-height:455px}.landing-onboarding-card{right:14px;width:min(345px,calc(100% - 28px));padding:20px}
    .product-hero{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px;min-height:560px}
    .product-mock--team{padding:17px 13px}.team-clock-float{right:-8px}.team-coverage-float{right:-5px}
    .product-mock--app{grid-template-columns:minmax(130px,1fr) 220px minmax(130px,1fr);gap:10px;padding:12px}.app-phone{height:470px}
    .crm-product-hero{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px;min-height:560px}
    .crm-product-capabilities{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 820px) {
    body.pocketpapi-funnel-home .landing-nav,body.pocketpapi-product-page .landing-nav{min-height:72px}
    body.pocketpapi-funnel-home .landing-nav nav,body.pocketpapi-product-page .landing-nav nav{gap:5px;padding:9px;border-color:#dce4ef;border-radius:14px;background:#fff;box-shadow:0 15px 36px rgba(20,39,68,.13)}
    body.pocketpapi-funnel-home .landing-nav nav a:not(.button-link),body.pocketpapi-product-page .landing-nav nav a:not(.button-link){min-height:40px;padding:0 10px;color:#485a74;font-size:.78rem}
    body.pocketpapi-funnel-home .landing-nav nav a:not(.button-link):hover,body.pocketpapi-product-page .landing-nav nav a:not(.button-link):hover{background:#f2f6fc}
    body.pocketpapi-funnel-home .landing-nav .public-menu-toggle,body.pocketpapi-product-page .landing-nav .public-menu-toggle{border-color:#dbe4ef;border-radius:9px;background:#fff;color:#283e5d}
    .pocketpapi-funnel-home .landing-hero{grid-template-columns:1fr;gap:32px;min-height:0;padding:50px 0 56px}
    .pocketpapi-funnel-home .landing-hero-copy{max-width:680px}.home-hero-visual{min-height:500px}
    .product-hero,.crm-product-hero{grid-template-columns:1fr;min-height:0;gap:35px;padding:49px 0 55px}
    .product-hero-copy,.crm-product-hero-copy{max-width:680px}.product-mock,.crm-product-preview{max-width:720px;margin-inline:auto}
    .product-mock--app{max-width:720px}
    .funnel-proof{flex-wrap:wrap;justify-content:flex-start;gap:9px 18px;padding:20px 32px}
    .funnel-proof::before{width:100%;font-size:1.4rem}
    .funnel-section,.product-shell,.crm-product-shell,.product-footer{width:min(calc(100% - 64px),760px)}
    .funnel-chapter{grid-template-columns:1fr;gap:25px}.funnel-chapter--reverse .funnel-chapter-copy,.funnel-chapter--reverse .funnel-visual{order:initial}
    .funnel-intro{grid-template-columns:1fr}.funnel-path{grid-template-columns:repeat(5,minmax(0,1fr))}
    .funnel-app-grid{grid-template-columns:1fr}.funnel-app-story + .funnel-app-story{border-top:1px solid var(--funnel-line);border-left:0}
    .crm-product-workflow{grid-template-columns:1fr;gap:25px}
}
@media (max-width: 620px) {
    body.pocketpapi-funnel-home .landing-nav,body.pocketpapi-product-page .landing-nav,
    .pocketpapi-funnel-home .landing-hero,.funnel-section,.product-shell,.crm-product-shell,.product-footer{width:calc(100% - 36px)}
    body.pocketpapi-funnel-home .landing-nav,body.pocketpapi-product-page .landing-nav{min-height:66px}
    body.pocketpapi-funnel-home .landing-nav .auth-brand,body.pocketpapi-product-page .landing-nav .auth-brand{font-size:.98rem}
    .funnel-brand-mark{width:29px;height:29px}
    .pocketpapi-funnel-home .landing-hero{gap:24px;padding:39px 0 42px}
    .pocketpapi-funnel-home .landing-hero h1,.product-hero h1,.crm-product-hero-copy h1{font-size:clamp(2.6rem,12vw,3.35rem);line-height:.99}
    .pocketpapi-funnel-home .landing-hero-copy > p:not(.landing-eyebrow),.product-lead,.crm-product-hero-copy > p:not(.landing-eyebrow){font-size:.91rem;line-height:1.62}
    .home-hero-actions{gap:16px;margin-top:21px}.home-hero-actions .landing-primary{width:100%}.home-hero-proof{gap:8px 14px;font-size:.63rem}
    .home-hero-visual{display:flex;min-height:0;flex-direction:column;overflow:hidden;border-radius:15px;background:#fff}
    .home-hero-photo{position:relative;inset:auto;width:100%;height:245px;border-radius:15px 15px 0 0;object-position:65% center}
    .home-hero-visual::after{inset:0 0 auto;height:245px;border-radius:15px 15px 0 0}
    .home-photo-caption{top:210px;bottom:auto;left:12px;right:12px;gap:6px;font-size:.5rem}.home-photo-caption span:last-child{display:none}
    .landing-onboarding-card{position:relative;top:auto;right:auto;width:auto;margin:-9px 10px 10px;padding:19px 16px 17px;transform:none;border-radius:12px;box-shadow:0 10px 30px rgba(12,31,58,.12)}
    .landing-onboarding-card .onboarding-card-heading h2{font-size:1.2rem}.landing-onboarding-card .onboarding-card-heading p{font-size:.72rem}
    .landing-onboarding-card .onboarding-form-grid{grid-template-columns:1fr;gap:0}
    .landing-onboarding-card label{margin-top:10px}.landing-onboarding-card input{min-height:43px}
    .funnel-proof{gap:8px 11px;padding:19px 18px}.funnel-proof::before{font-size:1.25rem}.funnel-proof span{font-size:.59rem}
    .funnel-intro{gap:10px;padding:53px 0 17px}.funnel-intro h2{font-size:2.2rem}.funnel-intro p{font-size:.82rem}
    .funnel-path{grid-template-columns:1fr;gap:2px;padding:11px 0}.funnel-path a{min-height:42px;padding:3px 0}.funnel-path a:not(:last-child)::after{top:auto;right:auto;bottom:-1px;left:16px;width:1px;height:8px}
    .funnel-chapter{gap:20px;padding:45px 0}.funnel-chapter-copy h2{font-size:2.24rem}.funnel-chapter-copy > p:not(.funnel-overline){font-size:.84rem}
    .funnel-points{grid-template-columns:1fr;gap:0}.funnel-points li{padding:9px 0;font-size:.73rem}
    .funnel-web-flow{grid-template-columns:1fr;gap:0;padding:12px}.funnel-web-flow article{min-height:115px;border-right:0;border-bottom:1px solid #e5ebf3;border-radius:0!important}.funnel-web-flow article:last-child{border-bottom:0}.funnel-web-flow article:not(:last-child)::after{top:auto;right:50%;bottom:-6px;transform:rotate(135deg)}
    .funnel-people-preview{grid-template-columns:1fr;padding:15px}.funnel-day-flow{border-top:1px solid #d9e1ed;border-left:0}.funnel-crm-preview{grid-template-columns:1fr}.funnel-customer-activity{border-top:1px solid #e0e7f0;border-left:0}
    .funnel-app-grid{gap:15px}.funnel-app-story{grid-template-columns:1fr;padding:18px}.funnel-app-story > img{height:165px}.funnel-app-story--screens > img{max-height:260px}.funnel-app-story h2{font-size:1.62rem}
    .funnel-how{padding:53px 0}.funnel-how > h2{font-size:2.25rem}.funnel-how-list{grid-template-columns:1fr 1fr}.funnel-how-list article{padding:15px 9px 15px 0}.funnel-how-list article + article{padding-left:9px}.funnel-how-list article:nth-child(3){padding-left:0;border-left:0}.funnel-how-list article:nth-child(n+3){border-top:1px solid var(--funnel-line)}
    .funnel-closing{grid-template-columns:1fr;gap:20px;padding:35px 0 46px}.funnel-closing h2{font-size:2.25rem}
    .product-hero,.crm-product-hero{gap:27px;padding:39px 0 43px}.product-hero-copy .landing-eyebrow{margin-bottom:13px}.product-actions{gap:14px;margin-top:21px}.product-actions .landing-primary{width:100%}.product-downloads{display:grid;gap:9px}
    .product-mock{min-height:380px;border-radius:13px}.product-mock--pos{min-height:355px}.pos-status-float{top:7%;left:4%;min-width:140px;padding:9px 11px}.pos-terminal-ui{top:29%;left:50%;width:47%;height:31%}.product-mock--team{min-height:420px;padding:11px 8px}.team-dash-bar{gap:6px;padding:0 8px;font-size:.48rem}.team-dash-bar button{display:none}.team-dash-heading{padding:14px 10px 10px}.team-dash-heading strong{font-size:.9rem}.team-dash-content{grid-template-columns:1fr;gap:8px;padding:0 8px 10px}.team-roster{display:none}.team-schedule{padding:9px}.team-clock-float{top:12%;right:5%;padding:8px 10px}.team-coverage-float{right:5%;bottom:4%;min-width:165px;padding:9px 11px}
    .product-mock--app{grid-template-columns:1fr;min-height:525px;padding:16px}.app-phone{width:238px;height:475px;justify-self:center}.app-side-card{display:none}
    .product-mock--screens{min-height:360px}.screens-display-ui{top:9%;left:45.8%;width:42.5%;height:36%}.screens-remote-card{position:relative;right:auto;bottom:auto;z-index:2;width:min(245px,82%);margin:257px 12px 11px auto;padding:10px}.screens-remote-card > strong{font-size:.7rem}.screens-remote-card article{padding:5px 0}
    .product-section{padding:48px 0}.product-section-heading{grid-template-columns:1fr;gap:11px;margin-bottom:22px}.product-section-heading h2{font-size:2.17rem}.product-section-heading p{font-size:.8rem}
    .product-steps{grid-template-columns:1fr}.product-step{padding:15px 0}.product-step + .product-step{padding-left:0;border-top:1px solid var(--funnel-line);border-left:0}.product-step h3{margin:7px 0;font-size:.93rem}.product-step p{font-size:.75rem}
    .product-capabilities{grid-template-columns:1fr;gap:0}.product-capability{padding:16px 0}.product-faq{grid-template-columns:1fr;gap:20px;padding:46px 0}.product-faq h2{font-size:2rem}.product-faq-list summary{font-size:.78rem}.product-faq-list details p{font-size:.73rem}.product-end{align-items:flex-start;flex-direction:column;gap:17px;padding:29px 0 46px}.product-end h2{font-size:2rem}.product-end p{font-size:.79rem}
    .crm-product-hero{padding:39px 0 43px}.crm-product-preview{padding:8px;border-radius:12px;transform:none}.crm-app-window{grid-template-columns:1fr}.crm-app-sidebar{display:none}.crm-app-main{padding:8px}.crm-app-toolbar{gap:6px}.crm-app-toolbar > div > span{display:none}.crm-app-toolbar button{font-size:.52rem}.crm-app-title > span{display:none}.crm-preview-columns{gap:4px}.crm-preview-columns article{padding:7px 5px}.crm-preview-columns article strong{font-size:.48rem}.crm-preview-columns article small{font-size:.42rem}.crm-customer-drawer{position:relative;right:auto;bottom:auto;width:auto;margin:9px 0 0;border:1px solid #e4eaf2;border-radius:9px}.crm-product-workflow{padding:40px 0}.crm-product-workflow h2{font-size:2rem}.crm-product-steps{grid-template-columns:1fr;gap:15px}.crm-product-steps article{display:grid;grid-template-columns:28px 1fr;gap:0 9px}.crm-product-steps article > span{grid-row:span 2;width:26px;height:26px;margin:0}.crm-product-steps h3{align-self:center;font-size:.9rem}.crm-product-steps p{grid-column:2;margin-top:3px;font-size:.72rem}.crm-product-capabilities{grid-template-columns:1fr;margin-bottom:43px}.crm-product-capabilities article{min-height:0;padding:16px}.crm-product-final{align-items:flex-start;flex-direction:column;margin-bottom:40px;padding:21px}.crm-product-final .landing-primary{width:100%;justify-content:center}
}
@media (prefers-reduced-motion: reduce) {
    .home-hero-actions a,.funnel-link svg { transition:none; }
}

/* Homepage-specific product snapshots. All device copy is selectable text. */
.funnel-browser-mock { padding:0;background:#fff; }
.funnel-browser-bar { display:flex;height:34px;align-items:center;gap:5px;padding:0 11px;border-bottom:1px solid #e5eaf1;background:#fbfcfe; }
.funnel-browser-bar > i { width:6px;height:6px;border-radius:50%;background:#d3dce8; }
.funnel-browser-bar > span { flex:1;margin-left:8px;padding:4px 10px;border:1px solid #e8edf3;border-radius:5px;background:#fff;color:#8793a4;font-size:.48rem;text-align:center; }
.funnel-browser-bar > b { color:#94a0af;font-size:.52rem;letter-spacing:.08em; }
.funnel-browser-page { padding:0 18px 14px; }
.funnel-browser-nav { display:flex;height:38px;align-items:center;justify-content:space-between;gap:8px; }
.funnel-browser-nav strong { color:#20304b;font-size:.54rem;letter-spacing:.07em; }
.funnel-browser-nav > span { color:#7b899b;font-size:.47rem; }
.funnel-browser-nav button,.funnel-browser-hero button { padding:6px 9px;border:0;border-radius:5px;background:#155eef;color:#fff;font-size:.45rem;font-weight:750; }
.funnel-browser-hero { position:relative;display:grid;min-height:218px;overflow:hidden;align-items:center;border-radius:7px;background:#e1e9ef; }
.funnel-browser-hero > img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:67% 46%; }
.funnel-browser-hero::after { position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,28,51,.67),rgba(13,28,51,.25) 52%,transparent);content:""; }
.funnel-browser-hero > div { position:relative;z-index:1;display:grid;gap:7px;max-width:53%;padding:19px;color:#fff; }
.funnel-browser-hero > div small { color:#dce6f0;font-size:.4rem;font-weight:800;letter-spacing:.08em; }
.funnel-browser-hero > div strong { font-size:1.13rem;line-height:1.02;letter-spacing:-.05em; }
.funnel-browser-hero > div span { color:#e6edf4;font-size:.49rem; }
.funnel-browser-hero button { justify-self:start;background:#ff7f56;color:#0f2749; }
.funnel-browser-actions { display:grid;grid-template-columns:repeat(3,1fr);margin-top:9px;border:1px solid #e9edf3;border-radius:7px;background:#fff; }
.funnel-browser-actions article { display:grid;grid-template-columns:22px 1fr;align-content:center;gap:3px 6px;min-height:47px;padding:7px 8px;border-right:1px solid #edf1f5; }
.funnel-browser-actions article:last-child { border:0; }
.funnel-browser-actions i { grid-row:span 2;display:grid;width:20px;height:20px;place-items:center;border-radius:6px;background:#edf4ff;color:#4c73b6;font-size:.65rem;font-style:normal; }
.funnel-browser-actions b { color:#354863;font-size:.48rem; }.funnel-browser-actions span{color:#8390a0;font-size:.41rem}
.funnel-pos-photo { position:relative;min-height:330px;aspect-ratio:1.58; }
.funnel-pos-photo > img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:53% center; }
.funnel-pos-photo::after { position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,28,49,.2),transparent 55%);content:""; }
.funnel-pos-photo > div { position:absolute;z-index:1;top:10%;left:5%;display:grid;gap:8px;width:min(240px,47%);padding:14px;border:1px solid rgba(226,233,241,.9);border-radius:10px;background:rgba(255,255,255,.96);box-shadow:0 10px 25px rgba(16,34,58,.16); }
.funnel-pos-photo > div > span { color:#647894;font-size:.46rem;font-weight:850;letter-spacing:.08em; }
.funnel-pos-photo > div > strong { display:flex;align-items:center;justify-content:space-between;gap:5px;color:#1c304d;font-size:.7rem; }
.funnel-pos-photo > div > strong i { padding:4px 6px;border-radius:12px;background:#fff2e9;color:#bc6d4e;font-size:.42rem;font-style:normal; }
.funnel-pos-photo > div > small { color:#718198;font-size:.5rem;line-height:1.4; }
.funnel-pos-photo > div > b { display:flex;justify-content:space-between;padding-top:8px;border-top:1px solid #e8edf3;color:#4a607e;font-size:.48rem; }
.funnel-pos-photo > div > b em { color:#155eef;font-size:.7rem;font-style:normal; }
.funnel-team-mock { position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:12px;padding:19px 18px 28px;background:#f3f6fb; }
.funnel-team-roster,.funnel-team-week { min-width:0;padding:12px;border:1px solid #e1e7ef;border-radius:9px;background:#fff; }
.funnel-team-roster > header,.funnel-team-week > header { display:flex;justify-content:space-between;margin-bottom:8px;color:#78879b;font-size:.48rem;font-weight:850;letter-spacing:.08em; }
.funnel-team-roster > header b { color:#3f9075; }
.funnel-team-roster article { display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:6px;min-height:46px;border-top:1px solid #eff2f6; }
.funnel-team-roster article > i { display:grid;width:23px;height:23px;place-items:center;border-radius:50%;background:#eaf0ff;color:#5570af;font-size:.43rem;font-style:normal;font-weight:800; }
.funnel-team-roster article > i.peach { background:#fff0e8;color:#b7795f; }.funnel-team-roster article > i.green{background:#e7f5ef;color:#43856e}.funnel-team-roster article > i.lilac{background:#f0ecfc;color:#7462a8}
.funnel-team-roster article > span { display:grid;gap:3px;min-width:0; }.funnel-team-roster article b{overflow:hidden;color:#354861;font-size:.51rem;text-overflow:ellipsis;white-space:nowrap}.funnel-team-roster article small{color:#8390a2;font-size:.41rem;white-space:nowrap}.funnel-team-roster article em{color:#459177;font-size:.4rem;font-style:normal;white-space:nowrap}
.funnel-team-week > header span { color:#667b99;font-size:.45rem;font-weight:600;letter-spacing:0; }
.funnel-team-week > div { display:grid;grid-template-columns:43px repeat(4,1fr);min-height:37px;align-items:center;border-bottom:1px solid #edf1f5;text-align:center; }
.funnel-team-week > div b { color:#64758d;font-size:.43rem;line-height:1.4; }.funnel-team-week > div b:first-child{color:transparent}
.funnel-team-week > article { display:grid;grid-template-columns:43px 1fr 1fr;gap:4px;min-height:43px;align-items:center;border-bottom:1px solid #f0f3f7; }
.funnel-team-week > article > span { overflow:hidden;color:#78869a;font-size:.42rem;text-overflow:ellipsis; }
.funnel-team-week > article > i { grid-column:span 1;padding:5px 3px;border-radius:4px;text-align:center;font-size:.38rem;font-style:normal;white-space:nowrap; }
.funnel-team-week .shift-blue{background:#edf3ff;color:#4b70b6}.funnel-team-week .shift-green{background:#eaf6f0;color:#40886f}.funnel-team-week .shift-peach{background:#fff1e9;color:#ae7054}
.funnel-time-card { position:absolute;right:15px;bottom:10px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:3px 10px;padding:8px 11px;border:1px solid #dfE7f0;border-radius:8px;background:#fff;box-shadow:0 8px 18px rgba(26,48,78,.1); }
.funnel-time-card > span { grid-column:span 2;color:#8390a1;font-size:.39rem;font-weight:830;letter-spacing:.08em; }.funnel-time-card b{color:#344a68;font-size:.5rem}.funnel-time-card small{color:#8491a2;font-size:.39rem}
.funnel-pipeline { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;min-width:0;padding:16px;background:#f5f7fb; }
.funnel-pipeline section { display:grid;align-content:start;gap:6px;min-width:0;padding:8px;border:1px solid #e8edf3;border-radius:7px;background:#edf1f6; }
.funnel-pipeline section h3 { display:flex;justify-content:space-between;margin:0 0 2px;color:#56677f;font-size:.53rem; }
.funnel-pipeline section h3 b { display:grid;width:15px;height:15px;place-items:center;border-radius:50%;background:#fff;color:#75849a;font-size:.4rem; }
.funnel-pipeline section article { display:grid;gap:5px;min-width:0;padding:8px 7px;border:1px solid #e6ebf2;border-radius:6px;background:#fff; }
.funnel-pipeline section article.selected { border-color:#b9ccef;box-shadow:0 0 0 1px #dce6f7; }
.funnel-pipeline section article small { color:#8492a4;font-size:.36rem;font-weight:800;letter-spacing:.05em; }.funnel-pipeline section article strong{overflow:hidden;color:#354963;font-size:.48rem;text-overflow:ellipsis;white-space:nowrap}.funnel-pipeline section article span{overflow:hidden;color:#7c8999;font-size:.4rem;text-overflow:ellipsis;white-space:nowrap}
.funnel-customer-activity { display:grid;align-content:start;gap:8px;padding:15px 13px;border-left:1px solid #e2e8f0;background:#fff; }
.funnel-customer-activity small { color:#7d8ba0;font-size:.42rem;font-weight:800;letter-spacing:.05em; }.funnel-customer-activity strong{color:#30445f;font-size:.72rem}.funnel-customer-activity span{padding:7px 0;border-top:1px solid #eff2f6;color:#6e7f96;font-size:.43rem;line-height:1.4}.funnel-customer-activity b{padding:8px;border-radius:6px;background:#f2f6fc;color:#5175aa;font-size:.4rem}
.funnel-app-mini { align-self:center;min-width:0;padding:17px;border:1px solid #dfe6ef;border-radius:13px;background:#fff;box-shadow:0 10px 26px rgba(23,45,74,.09); }
.funnel-app-mini > div { display:grid;gap:4px;padding-bottom:12px;border-bottom:1px solid #edf1f5; }.funnel-app-mini > div span{color:#75869e;font-size:.43rem;font-weight:850;letter-spacing:.1em}.funnel-app-mini > div b{color:#2b3f5d;font-size:.91rem}.funnel-app-mini > div small{color:#8290a2;font-size:.49rem}
.funnel-app-mini article { display:grid;grid-template-columns:28px 1fr;align-items:center;gap:8px;padding:11px 0;border-bottom:1px solid #eff2f6; }.funnel-app-mini article > i{display:grid;width:27px;height:27px;place-items:center;border-radius:50%;background:#eaf0ff;color:#5270b1;font-size:.45rem;font-style:normal;font-weight:800}.funnel-app-mini article > i.peach{background:#fff0e8;color:#b7795f}.funnel-app-mini article > span{display:grid;gap:3px}.funnel-app-mini article b{color:#3d506d;font-size:.52rem}.funnel-app-mini article small{color:#8995a5;font-size:.43rem}
.funnel-app-mini footer { display:flex;justify-content:space-between;padding-top:10px;color:#607590;font-size:.5rem }.funnel-app-mini footer b{color:#3b8f74;font-size:.47rem}
.funnel-screen-photo { position:relative;min-width:0;overflow:hidden;border:1px solid #dce4ef;border-radius:12px;background:#dce6ef;box-shadow:0 10px 26px rgba(23,45,74,.1); }
.funnel-screen-photo img { display:block;width:100%;height:220px;object-fit:cover;object-position:center; }
.funnel-screen-photo > span { position:absolute;right:9px;bottom:9px;padding:6px 8px;border:1px solid rgba(255,255,255,.35);border-radius:6px;background:rgba(16,33,58,.86);color:#fff;font-size:.4rem;font-weight:800;letter-spacing:.06em; }
@media(max-width:620px){.funnel-browser-page{padding-inline:10px}.funnel-browser-hero{min-height:170px}.funnel-browser-hero>div{max-width:66%;padding:12px}.funnel-browser-hero>div strong{font-size:.95rem}.funnel-browser-actions article{grid-template-columns:1fr;text-align:center}.funnel-browser-actions i{display:none}.funnel-browser-actions b{font-size:.42rem}.funnel-browser-actions span{font-size:.37rem}.funnel-pos-photo{min-height:230px}.funnel-pos-photo>div{width:min(195px,60%);padding:10px}.funnel-team-mock{grid-template-columns:1fr;padding:12px 10px 30px}.funnel-team-roster{display:none}.funnel-team-week{padding:8px}.funnel-team-week>div{grid-template-columns:37px repeat(4,1fr)}.funnel-team-week>article{grid-template-columns:37px 1fr 1fr}.funnel-time-card{right:9px;bottom:7px}.funnel-crm-preview{grid-template-columns:1fr}.funnel-customer-activity{border-top:1px solid #e2e8f0;border-left:0}.funnel-app-mini{padding:14px}.funnel-screen-photo img{height:190px}}