.sales-page{margin:0;background:#fff;color:var(--portfolio-ink);font-family:Lato,Arial,sans-serif;line-height:1.65;overflow:visible}
.sales-page *{box-sizing:border-box}.sales-page a{color:inherit}.sales-page a:focus-visible,.sales-page summary:focus-visible{outline:3px solid var(--portfolio-accent);outline-offset:5px}.sales-page ::selection{background:var(--portfolio-accent);color:#fff}
.sales-shell{max-width:1280px;width:calc(100% - 96px);margin:auto}.sales-page h1,.sales-page h2,.sales-page h3{font-family:Oswald,sans-serif;font-weight:600;letter-spacing:-.02em;line-height:1.12;text-wrap:balance}.sales-page h1{font-size:clamp(42px,4.6vw,66px);margin:0 0 28px}.sales-page h2{font-size:clamp(34px,3.6vw,52px);margin:0 0 24px;max-width:850px}.sales-page h3{font-size:25px;margin:0 0 16px}.sales-page p{margin:0 0 22px}
.sales-skip{position:fixed;top:-100px;left:16px;padding:14px;background:#fff;z-index:30}.sales-skip:focus{top:12px}.sales-nav{max-width:1440px;min-height:112px;margin:auto;padding:20px 48px;display:flex;gap:36px;align-items:center;justify-content:space-between;border-bottom:1px solid color-mix(in srgb,var(--portfolio-ink) 12%,white)}.sales-nav__logo{display:flex;width:300px;min-width:180px;max-width:32%;height:72px;align-items:center}.sales-nav__logo img{width:100%;height:auto;max-height:72px;object-fit:contain;object-position:left center}.sales-nav nav{display:flex;align-items:center;justify-content:center;gap:28px;font-size:14px;font-weight:700}.sales-nav nav a{text-decoration:none;white-space:nowrap}.sales-nav .sales-button{min-height:46px;padding:10px 17px;font-size:14px}
.sales-button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;max-width:100%;padding:14px 23px;border-radius:11px;background:var(--portfolio-ink);color:#fff!important;border:1px solid var(--portfolio-ink);text-decoration:none;font-size:15px;font-weight:900;line-height:1.4;text-align:center}.sales-button--outline{background:transparent;color:var(--portfolio-ink)!important}.sales-button:hover{background:color-mix(in srgb,var(--portfolio-ink) 85%,var(--portfolio-accent));color:#fff!important}.sales-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.sales-hero{padding:74px 0 94px;background:linear-gradient(120deg,#fff,color-mix(in srgb,var(--portfolio-accent) 9%,white))}.sales-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:64px}.sales-lead{font-size:19px;line-height:1.75;max-width:570px}.sales-hero .portfolio-stage{--portfolio-ink:#1d2330;aspect-ratio:1.07}.sales-hero__more{display:inline-block;margin-top:25px;font-size:14px;font-weight:700;text-underline-offset:5px}
.sales-section{padding:96px 0}.sales-intro{font-size:19px;max-width:760px;line-height:1.75}.sales-problems{background:var(--portfolio-ink);color:#fff}.sales-problem-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:46px}.sales-problem-grid article{border-top:1px solid color-mix(in srgb,var(--portfolio-accent) 50%,white);padding-top:26px}.sales-problem-grid p{color:#edeaf1;font-size:16px;margin:0}.sales-problem-grid h3{font-size:27px;line-height:1.25}

/* Feature rows: the visual keeps the wide column whichever side it sits on. */
.sales-split{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:76px;align-items:center}.sales-feature--reverse .sales-split{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}.sales-feature:nth-of-type(even){background:color-mix(in srgb,var(--portfolio-accent) 5%,white)}.sales-feature--reverse .sales-feature__copy{order:2}.sales-feature__copy p{font-size:18px}.sales-feature__visual{position:relative;margin:0;min-width:0}
.sales-screen{border:1px solid #68717c;border-radius:13px;background:#fff;overflow:hidden;box-shadow:0 24px 48px #18243622}/* Crops zoom into the part of a capture that tells the story. The generator sets the window shape (--ar), the
   image scale (--cw) and the offset (--cx/--cy), with -m twins for phones. */
.sales-screen__crop{position:relative;overflow:hidden;background:#fff;aspect-ratio:var(--ar,1.6)}.sales-screen__crop img{position:absolute;left:0;top:0;width:var(--cw,100%);max-width:none;height:auto;aspect-ratio:1.6;display:block;transform:translate(var(--cx,0%),var(--cy,0%))}
@media(max-width:640px){.sales-screen__crop{aspect-ratio:var(--ar-m,var(--ar,1.6))}.sales-screen__crop img{width:var(--cw-m,var(--cw,100%));transform:translate(var(--cx-m,var(--cx,0%)),var(--cy-m,var(--cy,0%)))}}
.sales-checklist{padding-left:22px;margin:24px 0 28px;font-size:17px}.sales-checklist li{margin:9px 0}
.sales-phone{position:relative;z-index:2;width:100%;border:7px solid #29303a;border-radius:28px;overflow:hidden;box-shadow:0 22px 42px #14213540;background:#111}.sales-phone img{display:block;width:100%;height:auto;aspect-ratio:390/844;object-fit:cover;object-position:top}
.sales-feature__visual--phone{display:grid;place-items:center;padding:46px 24px;border-radius:24px;border:1px solid color-mix(in srgb,var(--portfolio-accent) 22%,white);background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--portfolio-accent) 20%,white),color-mix(in srgb,var(--portfolio-accent) 6%,white) 70%)}.sales-feature__visual--phone .sales-phone{width:250px;max-width:64%;transform:rotate(-3deg)}
.sales-feature__visual--pair{padding:0 0 58px 30px}.sales-feature__visual--pair .sales-phone{position:absolute;left:0;bottom:0;width:27%;border-width:6px;border-radius:24px;transform:rotate(-4deg)}

/* Demo section: walkthrough, one wide team-side screen, then the two ways in. */
.sales-section--dark{background:var(--portfolio-ink);color:#fff}.sales-section-heading{display:flex;gap:64px;align-items:start;justify-content:space-between;margin-bottom:44px}.sales-section-heading h2{max-width:610px}.sales-section-heading>p{max-width:430px;color:#e9e4ef}
.sales-tour,.sales-showcase{margin:0 0 54px}.sales-tour video{display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:contain;border:1px solid #ffffff50;border-radius:16px;box-shadow:0 24px 50px #0004;background:#0b0f18}.sales-tour figcaption,.sales-showcase figcaption{font-size:14px;color:#eee6f4;margin-top:16px}.sales-showcase .sales-screen{border-color:#ffffff50;box-shadow:0 24px 50px #0004}
.sales-role-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.sales-role-grid article{display:flex;flex-direction:column;align-items:flex-start;padding:34px 34px 36px;border:1px solid #ffffff3d;border-radius:18px;background:#ffffff0f}.sales-role-grid h3{font-size:31px;margin-bottom:12px}.sales-role-grid p{color:#e9e4ef;font-size:17px;margin-bottom:28px}.sales-role-grid .sales-button{margin-top:auto}.sales-section--dark .sales-button{background:#fff;color:var(--portfolio-ink)!important;border-color:#fff}
.sales-deep-links{margin-top:54px;padding-top:32px;border-top:1px solid #ffffff40}.sales-deep-links h3{margin:0 0 12px}.sales-deep-links>p{max-width:760px;color:#eee6f4;margin:0 0 18px}.sales-deep-links__row{display:flex;flex-wrap:wrap;gap:14px 34px}.sales-deep-links a{font-weight:700;text-underline-offset:6px}

/* Product family: equal cards, links pinned to the bottom edge. */
.sales-system{background:color-mix(in srgb,var(--portfolio-accent) 7%,white)}.sales-system-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:50px}.sales-system-grid article{display:flex;flex-direction:column;padding:32px 28px;background:#fff;border-radius:16px;border:1px solid color-mix(in srgb,var(--portfolio-ink) 15%,white)}.sales-system-grid article[aria-current]{border-color:var(--portfolio-accent);box-shadow:0 0 0 1px var(--portfolio-accent)}.sales-system__logo{width:100%;height:90px;object-fit:contain;object-position:left center;display:block;margin-bottom:28px}.sales-system-grid p{font-size:17px;margin-bottom:26px}.sales-system-grid strong{font-weight:900}.sales-inline{margin-top:auto;align-self:flex-start;font-weight:900;text-underline-offset:5px}
.sales-handoff{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px 64px;align-items:end;margin-top:54px;padding-top:36px;border-top:1px solid color-mix(in srgb,var(--portfolio-ink) 22%,white)}.sales-handoff p{font-size:17px;max-width:820px}.sales-handoff p:last-child{margin-bottom:0}.sales-handoff__actions{display:flex;gap:12px;flex-wrap:wrap}
.sales-steps{list-style:none;counter-reset:steps;margin:0;padding:0}.sales-steps li{counter-increment:steps;position:relative;padding:0 0 28px 58px;margin-bottom:28px;border-bottom:1px solid color-mix(in srgb,var(--portfolio-ink) 15%,white)}.sales-steps li:before{content:counter(steps);position:absolute;left:0;top:0;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--portfolio-accent);border-radius:50%;font-weight:900}.sales-steps li:last-child{margin-bottom:0}.sales-steps li p{margin:0;font-size:17px}
.sales-faq{background:color-mix(in srgb,var(--portfolio-accent) 5%,white)}.sales-faq h2{margin-bottom:36px}.sales-faq details{max-width:960px;border-top:1px solid color-mix(in srgb,var(--portfolio-ink) 23%,white);padding:24px 0}.sales-faq summary{font-size:19px;font-weight:900;cursor:pointer;padding-right:16px}.sales-faq details p{font-size:17px;max-width:780px;margin:20px 0 0}
.sales-final{padding:90px 0;background:var(--portfolio-ink);color:#fff;text-align:center}.sales-final h2{margin-inline:auto}.sales-final p{font-size:19px;max-width:640px;margin-inline:auto}.sales-final .sales-actions{justify-content:center}.sales-final .sales-button{background:#fff;border-color:#fff;color:var(--portfolio-ink)!important}.sales-final .sales-button--outline{background:transparent;color:#fff!important}
.sales-footer{padding:45px 24px;background:#10101c;color:#e7e2ed;text-align:center;font-size:14px}.sales-footer>a{display:inline-block;margin:0 13px 22px}.sales-footer p{max-width:850px;margin:8px auto;font-size:12px;line-height:1.7}
.sales-gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 40px;margin-top:44px}.sales-gallery-grid article{display:flex;flex-direction:column;align-items:flex-start}.sales-gallery-grid .sales-screen{width:100%;margin-bottom:28px}.sales-gallery-grid h3{font-size:30px}.sales-gallery-grid p{font-size:17px;margin-bottom:26px}.sales-gallery-grid .sales-button{margin-top:auto}.sales-demo-instruction{font-size:15px!important;padding-left:16px;border-left:3px solid var(--portfolio-accent)}

@media(max-width:1100px){.sales-nav{gap:20px;padding:18px 28px}.sales-nav nav{gap:18px}.sales-nav__logo{width:250px}.sales-hero__grid{gap:36px}.sales-split{gap:40px}.sales-shell{width:calc(100% - 56px)}}
@media(max-width:800px){.sales-nav{flex-wrap:wrap;min-height:0;padding:16px 20px 12px;gap:12px 15px}.sales-nav__logo{width:230px;max-width:57%;height:58px}.sales-nav__logo img{max-height:58px}.sales-nav nav{order:3;width:100%;justify-content:flex-start;flex-wrap:nowrap;gap:20px;overflow-x:auto;scrollbar-width:none;font-size:13px;padding:2px 0}.sales-nav nav::-webkit-scrollbar{display:none}.sales-nav .sales-button{font-size:12px;padding:10px 12px;min-height:44px}.sales-shell{width:calc(100% - 40px)}.sales-hero{padding:48px 0 64px}.sales-hero__grid,.sales-split,.sales-feature--reverse .sales-split{grid-template-columns:minmax(0,1fr);gap:42px}.sales-page h1{font-size:46px}.sales-lead{font-size:18px}.sales-hero .portfolio-stage{max-width:620px;margin:auto}.sales-section{padding:66px 0}.sales-problem-grid{grid-template-columns:1fr;gap:28px}.sales-feature--reverse .sales-feature__copy{order:0}.sales-page h2{font-size:38px}.sales-section-heading{display:block;margin-bottom:30px}.sales-section-heading>p{max-width:none}.sales-role-grid{grid-template-columns:1fr;gap:20px}.sales-role-grid article{padding:28px 24px}.sales-system-grid{grid-template-columns:1fr;gap:20px}.sales-system__logo{width:300px;max-width:100%;height:80px}.sales-actions{align-items:stretch}.sales-actions .sales-button{flex:1 1 165px}.sales-handoff{grid-template-columns:1fr}.sales-handoff__actions .sales-button{flex:1 1 220px}.sales-final{padding:70px 0}.sales-gallery-grid{grid-template-columns:1fr;gap:44px}.sales-feature__visual--phone{padding:36px 20px}.sales-feature__visual--pair{padding:0 0 46px 18px}.sales-feature__visual--pair .sales-phone{width:30%;border-width:4px;border-radius:16px}}
@media(max-width:440px){.sales-hero .sales-actions .sales-button,.sales-final .sales-actions .sales-button{flex:1 1 100%}.sales-nav nav{gap:16px}}
@media(max-width:380px){.sales-page h1{font-size:40px}.sales-page h2{font-size:34px}.sales-nav__logo{width:165px;max-width:54%}.sales-nav .sales-button{padding:10px 8px}.sales-nav nav{gap:14px;font-size:12.5px}.sales-phone{border-width:5px;border-radius:22px}}

.sales-page--petops .sales-button:not(.sales-button--outline){background:var(--portfolio-accent);border-color:var(--portfolio-accent);color:#122037!important}.sales-page--petops .sales-button:not(.sales-button--outline):hover{filter:brightness(1.06)}
